The document discusses accessibility and inclusive design at IBM over several decades. It provides examples of IBM's accessibility innovations from 1914 to present day, including the first braille printer in the 1970s, screen readers in the 1980s/90s, and tools to make websites accessible in the 2000s. The rest of the document focuses on designing inclusively through exercises like using low vision simulation goggles and creating empathy maps to understand different disabilities. It also outlines the roles and responsibilities of design researchers, information architects, visual designers, UX designers, and front end developers in building accessible products and interfaces.

1. Accessible Design Thinking | SXSW
March 12, 2016

2. © 2015 IBM Corporation
Alarm Clock
EMPATHY ICEBREAKER

3. © 2015 IBM Corporation

4. © IBM Corporation
Take 1 minute and design an alarm
clock.
EMPATHY ICEBREAKER

5. © IBM Corporation
Over 100 Years of
Accessibility
Innovation
IBM CORPORATION

6. © IBM Corporation
1914
Hired first
employee with
a disability
1900s 1950-60s
1950s
Remote
Control
Keyboard
1960s
Shoebox
1970s
1970s
First Braille
Printer
1980s
1980
Talking
Typewriter
1981
Talking
Display
Terminal
1987
Phone
Communicator
1988
Screen
Reader / DOS
1990
Voice Type
Dictation
1991
THINKable
SpeechViewer
1992
Screen Reader/2
1994
SpeechViewer II
1996
SpeechViewer III
1997
Home Page Reader
1998
ViaVoice
1999
Corporate
mandate
WCAG 1.0
1990s
IBM CORPORATION

7. © IBM Corporation
2000s
2003
Easy Web
Browsing
Web Accessibility
Technology
2004
CaptionMeNow
aDesigner
2008
Spoken Web
WCAG 2.0
AbilityLab Sametime
Language Translator &
Conference Transcriber
Virtual Worlds Accessible
User Interface
2009
Accessible Workplace
Connection
iAccessible2 and
WAI-ARIA
AbilityLab Captioner &
Editor
AbilityLab
Accessibility Mentor
2010
Connections 3.0
AbilityLab Voice Chat
Transcriber
AbilityLab Compliance
Checker
2014
WAI-ARIA
IBM CORPORATION

8. Confidential :: © IBM Corporation

9. Confidential :: © IBM Corporation
Ginny Rometty
CEO
Today, when I think about diversity, I actually
think about the word ‘inclusion.’ And I think this
is a great time of inclusion.

10. Confidential :: © IBM Corporation

11. Confidential :: © IBM Corporation
Frances West
CHIEF ACCESSIBILITY OFFICER
It’s not about them; it’s about all of us.

12. Confidential :: © IBM Corporation

13. Confidential :: © IBM Corporation
Phil Gilbert
GM IBM DESIGN
The new IBM Design Language has
accessibility integrated into all aspects of
design.

15. Design is the
intent behind an
outcome.

16. Human-centered outcomes require empathy
for the people you serve.

17. Delivering outcomes at speed and scale
requires us to work together.

18. IBM Design Thinking

19. Understand people’s needs.

20. Form intent.

21. Deliver outcomes
at speed and scale.

22. The Loop

23. Observe Reflect Make

24. Observing is
about immersing
yourself in your
users’ world.
Meaningful outcomes come from an
understanding of the real problems your
users have.

25. Reflecting is about
converging on a
point of view.
Good decisions begin with an understanding of
your situation, your purpose, and how you can
make a difference for your users.

26. Making is about
giving form to ideas.
You can’t know everything but you do know
some things, so jump right in. The earlier you
make, the faster you’ll learn.

27. © 2015 IBM Corporation
Low Vision Goggles
EMPATHY EXERCISE

28. • Break into groups of 4 or 5
• Take a pair of the low-vision goggles
• Take out your phone
• Assistance by anyone in your group is
fine & encouraged.
EMPATHY EXERCISE

29. © 2015 IBM Corporation
Steps
While wearing a pair of the goggles, please take out your phone and do the following:
1. Take a photograph of something in the room.
2. Share that photograph on social media. Feel free to tag us on Twitter!
#a11ydesign | @bo.campbell | @charupandhi | @Moekraft | @ibmaccess
3. Email the photograph with a brief description to: bcampbell@us.ibm.com
4. Please pass the goggles to the next person.
EMPATHY MAP

31. Why is
Accessibility
Important?

32. 1. Diversity
a diverse workforce works harder and is more creative.
2. Economic
with a growing market of seniors, hundreds of billions of dollars are
untapped.
3. Humanitarian
we all want to work, be productive and earn our way.

33. © IBM Corporation
What Makes a
Product Usable
and Accessible?

34. © IBM Corporation
A product is usable if the
people for whom it is
intended can use it
effectively, efficiently,
and with satisfaction.
Usability
ISO 9241-11
The usability of a
product, service,
environment or facility
by people with the
widest range of
capabilities.
Accessibility
ISO 9241-11
Accessible
Design
Thinking

35. © IBM Corporation

36. © IBM Corporation
Disabilities we
design for…

37. © IBM Corporation
Physical
Epilepsy
Mobility
Fine Motor Movements
Speech Impairment

38. © IBM Corporation
Hearing
Deaf
Hard of Hearing

39. © IBM Corporation
Vision
Color Blindness
Visual Impairment
Blind

40. © IBM Corporation
Cognitive
ADD/ADHD
Autism
Dyslexia/Dyscalculia
Learning
Language

41. © 2015 IBM Corporation
Empathy Map
ACTIVITY

42. © 2015 IBM Corporation
What is an
Empathy Map?

46. What do they say or need to
say to others? How do they
likely express themselves?
What do they do to
get their job done?
How does this person
feel about their job?
What do they think about
the situation?
What is their worldview?
Quotes Expectations
& Reactions
Actions Values

47. © 2015 IBM Corporation
Please break into groups of 4 or 5
people. We will give you an
“empathy map” template for you to
place your sticky notes on.
EMPATHY MAP

48. © 2015 IBM Corporation
Ground Rules
1. Write before you talk.
Write or sketch lots of your ideas on sticky notes before talking about them.
During discussions, capture the main points on sticky notes and post to the wall.
2. There are no bad ideas.
Start big—diverge to get everyone’s ideas out there. Remix to discuss, cluster, and seek patterns. Then
converge to determine the strongest ideas.
3. Stay focused on your users.
Tell stories about users to keep them at the center of your attention.
4. Everyone participates.
Everyone has a Sharpie, everyone has a pad of sticky notes.
5. Stay engaged.
Avoid side conversations. Use a parking lot to capture issues that are off-topic.
EMPATHY MAP

49. © 2015 IBM Corporation
Think back to the goggle exercise
and remember what you thought,
said, felt, and did. Put these down
on your empathy maps.
EMPATHY MAP

50. © 2015 IBM Corporation
Ok, now let’s go!
1. One of the members of your group should draw a picture of the user that you will build an
empathy map around.
2. Pick a disability from the following: blind, low vision, deaf, physical disability (unable to use a
mouse).
3. In the context of our scenario for this user, please start considering things this person says,
does, thinks, and feels. Write each of your thoughts on a sticky and place it in the appropriate
quadrant.
* Duplicates on the map are fine. Don’t let what the others write affect your thoughts, just spill
them out as they come to you.
EMPATHY MAP

51. © IBM Corporation
Designer roles and
responsibilities

52. Confidential :: © IBM Corporation

53. Confidential :: © IBM Corporation
Design Research
Researchers must understand the nuances
of including people with disabilities in the
design thinking exercises.

54. Confidential :: © IBM Corporation
Design Research
- Finding resources
- Sponsor users
- Interviews
- Testing

56. Information Architecture
The information architect is responsible for a
structure and taxonomy that gives the best
experience to everyone.
Confidential :: © IBM Corporation

57. Confidential :: © IBM Corporation
Information Architecture
- Architecture
- Taxonomy
- Regions
- Tab Flow

59. Confidential :: © IBM Corporation
Visual Design
Visual designers have a huge responsibility
to make interfaces understandable and
enjoyable by people with disabilities.

60. Confidential :: © IBM Corporation
Visual Design
- Color Contrast Ratio
- Interaction states
- Typography
- Screen Magnifiers
- Images

61. Confidential :: © IBM Corporation

62. Confidential :: © IBM Corporation
User Experience
User experience designers likely have the
broadest range of responsibilities when it
comes to inclusive design.

63. Confidential :: © IBM Corporation
User Experience
- Communicate structure
- Choose appropriate interactions
- Establish the tab order
- Define and validate ARIA regions
- Create a comparable experience

64. Confidential :: © IBM Corporation

65. Front End Development
Front end developers must build the
intended interface, usable by everyone.

66. Front End Development
-Assistive Technologies
-Keyboard Access
-WAI-ARIA
-Meaningful Sequence