Designing for autistic people — overview of existing research
Best design practices for autistic people in 9 key categories including layout, content, colours, interactions, navigation and more.
Following my interview with Victoria about an ideal online experience for an autistic person, I immersed myself in research about designing for autistic people to find best practices. I have summarised my findings below into categories, with links to sources if you want to learn more. In a follow-up article, I will then distil my findings into an easy to follow design guide.
Many of the research projects I found that focused on designing for autistic people had contradictory outcomes. This could be because most of the available research was conducted with children. However, the findings for adults were often different.
To put this group in context, nearly 1% of the global population is autistic, and they feel most comfortable online — learning, communicating, shopping, and gaming. Therefore, this group makes up a significant percentage of online users, so designers should be aware of how best to cater to them.
But first, let’s start with a definition of autism. There are multiple ways that people and organisations approach this question. Still, perhaps the clearest and most inclusive description of autistic differences I came across belongs to autistic advocate and interdisciplinary educator Nick Walker:
Autism is a genetically-based human neurological variant. The current evidence indicates that the central distinction is that autistic brains are characterised by particularly high levels of synaptic connectivity and responsiveness. This tends to make the autistic individual’s subjective experience more intense and chaotic than that of non-autistic individuals: on both the sensorimotor and cognitive levels, the autistic mind tends to register more information, and the impact of each bit of information tends to be both stronger and less predictable.
Despite underlying neurological commonalities, autistic individuals are vastly different from one another. Some autistic individuals exhibit exceptional cognitive talents. However, in the context of a society designed around the sensory, cognitive, developmental, and social needs of non-autistic individuals, autistic individuals are almost always disabled to some degree — sometimes quite obviously, and sometimes more subtly.
With this in mind, the question is how non-autistic or neurotypical designers can be more inclusive in their projects? What do we need to be aware of to welcome neurodiverse audiences and create a comfortable digital space where they can thrive? Who else could benefit from these considerations? To answer these questions, I have summarised the research into the 9 key categories:
1. Layout
The overarching requirements for interface design are outlined by Zsombor Varnagy-Toth, who conducted a UX research study with autistic people:
The brains of people with autism process sensory information differently. As a consequence, they may have an advantage in processing vast amounts of complex, static information. On the other hand, they may have issues processing rapidly changing information — such as people moving and talking on crowded streets. In this latter case, they perceive a chaotic rush of impressions, which can make them feel overwhelmed and powerless. They need a greater sense of stability and predictability. This autistic information–processing style affects their experience and interactions with software user interfaces as well.
Some of the common requirements for autistic people are consistency, clarity and structure. In relation to UI design, this means a clear visual structure and consistent layout for similar types of information. This can also help with focusing on new information. A few elements and one main call to action on the screen will also help to reduce distractions. The principle of clustering and surfacing only the most commonly used features and controls can help reduce the number of elements on more complex pages.
The article ‘Autism Friendly Digital World’ by Living autism also confirms that a clean layout with clearly delineated text areas and clear images goes a long way.
Marc Fabri shares feedback from his participatory design workshop:
In terms of graphic design a basic and muted “skin” that did not distract from the content was preferable.
2. Content
There were contrasting statements when it comes to the preference of images vs written content. But the general pattern shows the priority of a logical, structured and clear presentation of information created using the most appropriate content type. Here is feedback from a participatory workshop with autistic people:
Autistic students attending our workshops told us that they tend to think logically, and that information needs to be presented in a clear and objective fashion for it to be both informative and believable. They liked the idea of having easy access to large amounts of information (like on Wikipedia) — and accessible ways to get to that information and process it at their own speed.
Another recommendation I came across was highlighting the importance of displaying all the content about one subject on a single page, rather than breaking it down into multiple pages.
3. Text
Multiple research sources agreed that the design of text fields should follow the principle of simplicity: a text box clearly separated from the rest of the content, presented in a single, left-aligned column, using clear fonts. Clear sections and large margins on a page are beneficial too.
4. Imagery
Research findings regarding the perception of imagery by autistic people differed. Potentially because the majority of research about designing for autistic people was conducted with young children and was mainly related to educational applications. They state that ASD children tend to be visual learners. A good number of researchers have found that these children learn more through visual rather than other sensory stimulation. Using visual cues (pictures and icons) to illustrate concepts was found to improve reading comprehension. These research findings suggest to include images and words next to each other to support the understanding of both.
Another research study recommended using simple graphics, ideally in colour. Multiple sources highlighted that images should not be used as a background to text to avoid a distraction.
On the other hand, Marc Fabri shares a different view from his experience of a participatory design project with autistic adults:
There is a general conception that autistic people think visually and like information to be presented through imagery. However, we found that the autistic people we spoke to preferred well-structured text information to illustrations, infographics or videos.
They did not wish to have visual elements added just to improve the look of a website but approved of visual content when it provided information that text alone could not achieve, e.g. in connection with directions to a building on the campus, or the photograph of a real person they were likely to meet.
5. Visual and verbal metaphors
Nancy Rasche, in her thesis on the design of applications for autistic children, talks about cognitive differences between neurotypical and autistic people. One of these cognitive differences is Central Coherence — the ability to understand the whole meaning from the assembled details. She highlights that autistic people have exceptional powers of processing information thoroughly, but might find it challenging to grasp inferred meaning in language and social settings.
This might explain why some research also highlights that autistic people are not always comfortable with metaphors and figurative language — verbal or visual (like iconography).
Victoria Rose Richards also mentioned:
I can’t understand tone, sarcasm, facial expressions or sayings very well.
Therefore, the recommendation is to use plain English and avoid navigation elements or buttons using only iconography without labels, except for the most popular actions, for example, the “back” icon. People from other cultural backgrounds or non-native speakers will also benefit from this.
6. Colour
Multiple sources highlighted a strong sensitivity to the brightness of colours in autistic people. This is caused by hyper-sensation, which makes bright colours and strong contrasts to be experienced as sensory overloading.
In 2016 Frontiers in Psychology conducted research on the colour preference of 29 autistic boys and 38 neurotypical boys:
When mean rank of preference was computed in each of the ASD and TD groups with regard to each colour, it was found that boys with ASD were more likely than TD boys to prefer green and brown colours and significantly less likely than TD boys to prefer yellow. These results appear to be caused by a hyper-sensation characteristic of ASD, due to which boys with this disorder perceive yellow as being sensory-overloading.
Also, the fact that the yellow colour in this test had the highest luminance value among other colours could be another reason. The observed aversion to this colour might also reflect the hyper-sensitivity of autistic children to luminance.
While the primary mechanism underlying the perception of colours would not differ between autistic and neurotypical people, the enhanced sensitivity to sensory stimulation in general (Markram and Markram, 2010) would influence colour perception by autistic people.
Living autism and research User Interface for People with ASD also highlight that website design for autistic people should use soft, mild colours and contrast clearly between the font of any text and the background to ensure a clear message.
7. Navigation
Multiple research findings suggest that to help autistic people feel more comfortable, and in control while using a website, designers should aim to simplify and clarify navigation while limiting it to one toolbar. Clearly label every page and show a progress bar in all journeys that are more than one page.
Multiple sources, including this research, suggested using clear, large buttons with both icons and text. Buttons, links and all action controls should have descriptive labels: e.g. ‘Attach file’ and not ‘Click here’.
One article suggested that image-based search results are more preferable by some autistic people than a list of hyperlinks.
Some people would like to have more time filling in forms and feel uncomfortable with time pressure. It is recommended to allow users to save and return to forms and to ensure ‘time outs’ on forms are reasonable.
8. Interaction
At a participatory workshop with autistic people, reactions to animations and transitions were positive only when they added a clear benefit to the interaction they supported (e.g. hover effects that reveal more details, not just for the visual effect).
The direction of scrolling and the speed of animated components on a page can also affect usability. Living autism suggests that having to scroll horizontally to view the entire content can be unpleasant for some autistic users. The feedback that I received from Victoria was that additional animated elements on a page that are hard to control are very uncomfortable and distractive for autistic people. This includes animated transitions of a filters panel or a side navigation section that doesn’t move fully in parallel with the main part of the page.
Animated banners and autoplay ads, especially with sound, can cause severe reactions for people with sensory sensitivity and anxiety.
Multiple sources suggest that automatic pop-up elements are best avoided. We all know how distractive and badly timed some pop-up interactions might be. For example, when an email subscription pop-up opens over your search results on an e-commerce website.
According to gov.uk, 40% of autistic people have an anxiety disorder. While an intrusive interaction or sound on a page might be an annoyance to a neurotypical person, for an autistic person, it can cause severe anxiety.
9. Personalisation
Multiple research findings highlighted the importance of personalisation for autistic people. Even though it might be hard to achieve on websites, digital products such as apps, games, and software could benefit from adding these options to their settings.
For example, Open book, an assistive reading tool created for autistic people, includes rich personalisation features that enable users to quickly adapt the presentation of documents to their preferences. These features help to adjust font typeface, font size, line spacing, colours, themes for text background and foreground colours. This can also help gather direct user feedback for an optimal design and involve their users in the design process.
The national autistic society also offers a personalisation option on their website. It’s a toggle that allows you to change the colour scheme from vivid to calm, including photographs and all visual elements of the site.
There is an opinion that studies on autistic people often have a negative tone. This is possibly because most of the available research is related to educational software for young autistic children with learning difficulties. Research on IQ levels in autistic children shows that there is no correlation between the two. This article reveals that the way IQ is traditionally measured is not suitable for autistic children, as most have communication difficulties. Some autistic children understand far more than they can say with words or show with gestures, and they are mistakenly thought to have low intelligence.
Many leading autism experts have suggested that some of the most intelligent and innovative people were autistic, including Albert Einstein, Issac Newton, Charles Darwin, and Steve Jobs. Is it a coincidence that the original design of Apple products and digital experiences so closely follow the requirements of autistic people? Remember the clean and well-structured layout with large margins, clear calls to action and no distraction UI layouts that inspired a generation of designers? Or is it just good design?
In carrying out this research, I discovered that following design principles for autistic people result in good design for everyone.
In the next article, I’ll summarise these detailed findings into an easy to follow visual design guide, but I’m also interested to know if you found this detailed article beneficial.
