How to design for autism

About 1 in 100 people have autism. That makes 700,000 people in the UK alone, and around 1% of the entire world population.

Research suggests that many autistic people feel the most comfortable online, which results in a high representation of autistic online users who socialise, shop and learn frequently. 

So, how can we ensure that websites and apps are inclusive for those with Autism Spectrum Disorder (ASD)?  

To help raise awareness for World Autism Acceptance Week, here are 7 things to consider when designing for autism: 

https://youtu.be/_F_8s02KuT8

1. Imagery

• Use visual cues such as pictures or icons to illustrate a concept and help with reading comprehension.
• Simple graphics in colour have been found to be very effective, however, visuals should not overlay text as it can be distracting. 
• Visuals, icons and graphics should only be used to support or explain text further, or to provide information that text alone can not achieve. 

2. Text

• Text is best placed separately from other page content. This allows readers to fully process the text and not get distracted by other content. 
• Sticking to ‚plain' language can make it easier for people with ASD to understand the context and the inferred meaning.

3. Layout

• Rapidly changing information can be overwhelming for people with ASD due to overstimulation.
• Layouts should follow a simple and clear structure and avoid any unnecessary elements of movement and animation.

4. Colour

• Use muted colours such as brown, beige and grey. 
• People with ASD have a significantly lower preference for brighter colours such as red and yellow in comparison to people without ASD.
• Brighter colours have a higher luminance value, which could be the reason for the lower tolerance and people with ASD often have hypersensitivity and are prone to sensory overload.

5. Metaphors

• ASD people can be extremely proficient in understanding information as a whole. 
• However, it can be difficult for them to understand inferred meaning in language and social settings.
• Use 'plain' language to make it easier for people with ASD to understand the context and the inferred meaning. 
• Iconography should always, in most cases, be used in combination with labels - except in cases such as back buttons which are commonly known.

6. Navigation

• Reducing the number of toolbars to just one and using large, descriptive labels for buttons in combination with icons can also help. 
• Progress bars should be incorporated as well to provide a sense of structure.

7. Interaction

• It is suggested to only use animation and transitions if they add an additional benefit and are not used for purely visual effects. 
• Horizontal scrolling can also be unpleasant for autistic users. Elements on a page which do not show the entire content and are hard to control are distracting and uncomfortable to use for people with ASD. 
• Avoid using animated banners, autoplay ads and pop-ups, as this can cause anxiety for people with ASD.

. . .

See the links below for further reading on designing for autism:

• ‍Connecting with the Autism Spectrum    ‍
• The Pattern Seekers ‚ Simon Baron-Cohen‍
• www.autism.org.uk‍
• Autism Friendly Digital World', Living Autism, 2019, Lisa McNair    ‍
• Accessible and Usable Websites and Mobile Applications for People with Autism Spectrum Disorder: A Comparative Study'‍
• Usability Testing with People on the Autism Spectrum: What to Expect

‍

About EM Code

EM Code is a customer experience, digital innovation and AI agency. 

We’re a strategic digital partner that delivers breakthrough growth throughout the customer experience (CX). 

We achieve this through our industry-renowned services in digital transformation, web development, brand strategy, click rate optimisation (CRO) and UX (user experience).

Our human centric approach underpins every aspect of our work.

A collective of experts in multiple disciplines, we collaborate to distil the complex needs of organisations and end users to engineer solutions that make an impact.

From fast scaling start ups to global brands, we can help you to transform your organisation.

We are an EssenceMediacom North agency.

‍

About EssenceMediacom North

EssenceMediacom North helps brands to breakthrough in the new communications economy.

Disrupting models of media, EssenceMediacom North accelerates creative and business transformation for its clients roster, including Hillarys, Absolute Collagen, Webuyanycar.com and United Utilities.

The agency delivers breakthrough growth, capabilities, and revenue through the integration of media, creativity, data and technology, combined with its diverse industry-leading expertise.

Equipped with access to the richest data, robust benchmarking and advanced technologies, EssenceMediacom North unlocks new opportunities to deliver truly integrated media solutions for scaling and global brands.

EssenceMediacom North is part of WPP’s media investment group, GroupM

‍

Visit the agency

WPP Manchester Campus

1 New Quay Street

Greater Manchester

M3 4BN

#AIAgency #InnovationAgency #CXAgency #CustomerExperienceAgency #DesignSprint #ProductThinking #BrandStrategyAgency #CROAgency #DigitalTransformationAgency #TechnologyInnovationAgency

‍

‍