Presenters: Treyce Meredith, Product Designer, Carbon Five Devi Pellerin, Senior Designer, Carbon Five Design’s primary function is to make something useful. Unfortunately, most products are not accessible to everyone. For adults and children with non-typical cognition and learning styles, technology can help even the playing field, combats negative stereotypes, and take into account their deficits and capitalize on their cognitive strengths. We will look at design solutions targeting specific conditions like ADHD, Dyslexia, and Autism -- and the core problems technology is trying to solve. We'll then widen the lens to compare how many of our most commonly used devices and apps use the same tactics to achieve universal accessibility for all.

1. Universal Accessibility in Product Design:
Designing for alternative cognitive styles and learning disabilities

2. About Us
Treyce Meredith
Product Designer, Carbon Five
Worked with several ed-tech start ups in San Fransisco.
Diagnosed with Dyslexia and Dysgraphia at age 8.
Devi Pellerin
Senior Product Designer, Carbon Five
History of design for educational apps for kids.
History of ADHD in family and diagnosed at age 37.

3. It’s a brain thing!
People with neurocognitive disorders have greater difficulty with one or more cognitive abilities.
Including but not limited to…
What are cognitive disabilities?
SpellingReading Writing Math Cognition Executive Functions
Speaking Auditory Processing Visual Processing

4. 2.4 public school students
4.6 million Americans
18% decline in diagnoses
What are cognitive disabilities?

5. The most common cognitive disorders
ADHD Autism
Dislexia Visual Processing
Definitions from understood.org

6. Impacts focus, self-control and other skills important in daily life. It’s caused by differences in brain
anatomy and wiring, and often runs in families.
ADHD
Difficulty planning & making decisions
Starting and finishing tasks
Concentrating and blocking distractions
Short term memory
Regulate emotions
Listening - Processes Language differently
Communication - Difficulty organizing thoughts into structured verbal language

7. ADHD is like…

8. ADHD is like…

9. ADHD is like…

10. Impacts reading comprehension, spelling and writing. It is not a problem with eyesight.
Definition by understood.org
Dyslexia

11. Science!
Dyslexic
S???nce
Seyence
Sience
Sinence
Science
S??n?e
It’s your 500th time spelling:
Science
It’s your 500th time spelling:
Science
Non-Dyslexic

12. Dyslexia is like…

13. A visual processing or perceptual disorder refers to a hindered ability to make sense of
information taken in through the eyes. This is different from problems involving sight or sharpness
of vision. Difficulties with visual processing affect how visual information is interpreted or
processed by the brain.
Definition by understood.org
Visual Processing

14. Visual Processing disorders are like…

15. Visual Processing disorders are like…

16. Write your name on your paper.
Draw your dog on your paper.
Visual Processing disorders are like…

17. A lifelong developmental disability that affects how a person communicates with and relates to other
people. It also affects how they make sense of the world around them. Autism effects people differently.
Autism
Social Communication Challenges
Recognizing emotions/intentions in others
Expressing emotions
Recognizing facial expressions
Restricted, repetitive behaviors
Ritualistic routines
Repetitive body movements
Narrow or extreme interests in specific topics

18. Autism is like…
Video by The National Autistic Society

19. Neurological differences are to be recognized and respected as any other evolutionary
trait - and a product of evolution and genetic variation.
Devon MacEachron:
Stigma VS Reality
Neurodiversity

20. ★ Combat negative stereotypes & stigmas
★ Reduce depression & anxiety
★ Provide tools for teachers that empower!
★ Reduce struggles in relationships, work, and life from living with an invisible “disability”.
How Design can help

21. ✦ Show and track progress - Encourage accountability in a way that feels rewarding!
✦ Frictionless and easy to learn - Make me feel smart!
✦ Help me when I need it, not when I don’t!
✦ Utilize Game Design strategies: Explore, Onboard/train, Scaffold, Provide Meaning
Design Principles:
1
Motivation & Engagement

22. ★ A sense of ownership & control
★ Flexible features and workflows for different styles of working & learning
★ Learn at my own pace - Customized tracks and scaffolding
Design Principles:
2
Personalization

23. ★ Keep UI simple and consistent - Avoid cluttered UI
★ Reduce Cognitive Overload - Keep it simple!
★ Strategic use of color and shape relationships
★ Avoid bright contrasting colors, simple colors
★ Avoid patterned backgrounds
Design Principles:
3
Sensory Issues

24. ★ Consistent navigation - In appearance and behavior
★ Simple and clear hierarchy
★ Make links obvious
Design Principles:
4
Consistency

25. ★ Provide visual alternatives to textual material
★ Avoid metaphors, figures of speech and idioms
★ Avoid walls of text and use simple sentences and bullets instead
Design Principles:
5
Communication

26. Let’s break it down

27. Image via Asana blog
Asana: Timeline
Sensory Issues:
Strategic use of color & shape. Tactile.
Communication:
Simple draggable bars. Not drop down text
selectors
Motivation:
Filter to see incomplete and
complete tasks

28. Image via Asana blog
Asana
Sensory Issues:
Strategic user of color. High priority UI
elements in full color, secondary in more
subdued grey
Motivate/empower:
Users compelled to cooperate which
create a sense of accountability and
community
Motivate & empower
Feedback in the application from teammates
and peers. Give kudos via a “like” button to gi
recognition

29. Elevate - Brain Training
Image via Elevate
Motivating and engaging
ADHD and dyslexics benefit
from scaffolding, progress
and tracking.

30. Elevate - Brain Training
Image via Elevate
Personalized
Learn at your own pace.
Set up length and amount
of gameplay per day
Motivate and engate
Learn at your own pace.
Set up length and amount
of gameplay per day

31. Image via Grammarly blog
Grammerly
Motivate/empower:
Users don’t need to worry about
misspellings because the keyboard
helps you correct mistakes.
Personalized
You are free to ignore suggestions
and add new words to your own
personal dictionary.

32. Image via Grammarly blog
Grammerly
Personalized
Tell Grammerly what you are writing
and who it is for. The software
tailors corrections for your use
case.
Personalized
Reports help you understand how
you are doing, and what you are
doing.

33. Slack
Image via slack blog
Sensory Issues
Pulling side conversations into threads and
unread. Help the user understand what is
happening.

34. Toca Store
Image via Elevate
Communication
Learn words through
visual representations
Communication
Learn social skills through
interacting with characters
and and pictures

35. Image via Slack blog
Slack
Personalized
Getting to pick and customize your
color help users not have
overwhelming experiences.

36. understood.org
Image via understood.org

37. Thanks so much!
Devi Pellerin
Treyce Meredith
Email: devi@carbonfive.com
Email: treyce@carbonfive.com
Twitter @babytreyce