Blog article

3 Steps for Neuro-Inclusive Digital Product Design

October 10, 2024
5
 min read
Google DeepMind background texture image sourced from Pexels
Copied!

How can we leverage behavioural science and machine learning to build effective tools for neurodivergent entrepreneurs? This was the central question of Behave London's Behavioural Science and Machine Learning Workshop which I intended back in July. My role as a speaker and mentor was to support incredible graduates and share some tips for inclusive and engaging digital behavioural change. Check out the video above or read on for a framework of three memorable steps to improve the accessibility and inclusivity of your digital product.

STEP 1. SIMPLIFY

Consider the lower levels of UX Pyramid

Step one is removing any barriers preventing them from even using your product to begin with. Align with the 'Usable' level of the famous UX pyramid through using sans serif fonts, concise language and reducing clutter on the page.

It's not enough of course to just be usable--you want your product to provide convenient affordances to all users. One way of doing this is by offering multiple input and output data options. This means enabling users to consume content via voice, text or visually.

Chunking complex tasks and information

This step is essential for all users regardless of their neurodiverse profiles, particularly on web sites where we know that people are more llikely to skim dense text.

  • Product copy and microcopy best practices
  • This podcast episode features Senior UX Writer Katrin Sütterlin discussing how to write a diverse and inclusive UX copy.
  • Ensure appropriate font style hierarchy using tools like Google's Type Scale.
  • I am consistently blown away by the number of mobile apps who omit progress indicators in lengthy account setup/onboarding flows. There are numerous ways to apply progress indicators including the linear progress bar
  • Take a look at your current user journeys - if you're asking multiple questions in one screen, consider experimenting with chucking these longer journeys into distinct steps.

Embrace the design principle of redundancy

"Redundancy is not just information but also interaction modes such as point, speak, touch or tap that are cognitively more accessible to different users"-- Gareth Williams, BBC (source)

What does redundancy look like in practice?

A figure with four rows, displaying the four stages of the mentioned example. The first row shows three icons, similar in shape and stroke color. The second row shows the same icons with different stroke colours. In the third row, the icons shape has changes. In the last row, the icons are filled with different colours.
Source: Bekk Christmas; illustrating how designers can use colour, shape and clarification to embed redundancy to improve accessibility

STEP 2. TRIGGER

Treat marketing channels as an extension of your core product

This step is for the benefit of all individuals, and what I mean here is that to drive continued usage from your userbase, you need to invest in value-led messaging that links back to your core value proposition. Ex-busuu product manager Antoine Sakho has a great example of how his team embedded Nir Eyal's Hooked Model into the product, ensuring this 'external trigger' of a push notification was connected to the users' internal triggers of curiosity and desire to learn a language.

Lock Screen and Home Screen widgets

94% of mobile app installers won't return a month later and my bet is this is often due to forgetting about the app and/or not being sufficiently activated to  experience the core value proposition. The lock and home screens provide a high-visibility option, creating a hard-to-miss trigger to remind your users of your product, but most importantly provide value without requiring users to actively open your app.

Example widgets and lock-screen notifications to engage user beyond the core app
  • The Guardian employed an awesome live, updating lock-screen notification with real-time election results back in the 2016 and 2020 US presidential elections.
  • The Duolingo team share their approach to designing their streak-saving widget in this detailed article.
  • Paku for PurpleAir provides glanceable real-time air quality,  removing the necessity for users to re-open the app for real-time feedback.

Contextual Prompts

You're probably starting to see a pattern here, that neuro-inclusive affordances benefit all users. One example that I was inspired by from Treyce Meredith's YouTube talk was Gmail's mistake-proofing prompt "It seems like you forgot to attach a file". The essence here is that products can be more inclusive for everyone by actively anticipating and designing ways to support the potential errors users will make.

Source: Gmail

Contextual prompts don't have to be for a core action, but instead can help actively support users' wellbeing. Web blocking app Opal's interstitial reminders to breathe in and out before moving towards the next in-app action:

Opal's enforced 'break' to users considering ending their App/Web Blocking session early

STEP 3. MOTIVATE

Decades of research demonstrates that humans have three core, intrinsic needs which also serve as predictive mediators of motivation, engagement and wellbeing. They are:

  • Competence:  Feeling capable, balance of ability with challenge level
  • Autonomy: Meaningful options, freedom to act according to their values/goals
  • Relatedness: Feeling of connectedness with others


Fostering Competence

Progressive Disclosure

This is a design technique to gradually expose users to information over multiple screens, or at appropriate stages of their user journey.

As seen in my Google I/O talk with The Fabulous' co-founder Sami, The Fabulous aims to set users up for success by restricting how many features their new uses can interact with. In the screenshot below, you can see how they start people off on a small, seemingly easy task of drinking water when they wake up.

Designing for Autonomy

Enabling Customisation of the UI

This concept connects back to my earlier point about redundancy, where designers can give users more freedom of choice by offering multiple ways to engage with content or features.

Asana offers multiple ways of viewing a project: List, Board, Gantt, Timeline and more

Relatedness

Remote coworking apps such as Flow.Club and Groove are especially neuro-inclusive because they enable a concept called body doubling. It's a well known productivity strategy within the ADHD community, helping to cultivate forms of accountability and helps reduce distraction.

Flow.Club

"While body doubling is one of the most effective coping strategies for people with ADHD, the technique can also be used by neurotypical people looking to increase motivation, eliminate potential distractions, and complete tasks more efficiently". Flow.Club

Summary Checklist

  • Concise language, reduced clutter, no unnecessary screens
  • Multiple interaction modes (voice, text, visual)
  • Group goals/information/processes into smaller chunks
  • Embed nudges for wellbeing and mistake-proofing
  • Tailored messaging and features for user journey stage
  • Customisation alternatives for diverse preferences

Useful Resources

Want to learn more about how to build a more inclusive organisation? I highly recommend Tim Ferriman's Neurodiversity Champion course which I had the pleasure of participating in before the workshop.

Send me an email or book in a free discovery call to discuss how I can help you craft more effective, inclusive and engaging digital experiences!

(Source credit for article header image- Google DeepMind)

Share this post
Copied!

Don’t miss any updates

Receive updates on my latest writing and work

By subscribing, you agree to my Privacy Policy and consent to receive updates from me.
Thank you! We've received your submission.
Oops! Something went wrong. Please try again.