design like an ally

Design Like an

ally

a PSA by Rebecca Mushtare

al·ly [n. al-ahy]

(1) a supporter; (2) friend; (3) helper; (4) a person, or group, that is associated with one another for a common purpose. antonyms: enemy; foe; adversary

who needs an ally?

Employed graphic designers account for .06% of the US population. We can’t design just for ourselves.

<design> Lorem ipsum dolor sit amet, consecte-tur adipiscing elit. Proin posuere turpis a neque feugiat, sit amet rhoncus sapien eu-ismod. Aenean.

</design>

Occupational Employment and Wages, May 2012: 27-1024 Graphic Designershttp://www.bls.gov/oes/current/oes271024.htm

children

75% 66%Zero to Eight: Children’s Media Use in America 2013 http://www.commonsensemedia.org/sites/default/files/research/zero-to-eight-2013.pdf

Always Connected: The New Digital Media Habits of Young Childrenhttp://www.joanganzcooneycenter.org/wp-content/uploads/2011/03/jgcc_alwaysconnected.pdf

teens

74% 93%Teens & Technology 2013http://www.pewinternet.org/2013/03/13/teens-and-technology-2013/

millenials

97% 89%The Web at 25 in the UShttp://www.pewinternet.org/2014/02/27/the-web-at-25-in-the-u-s/

ages 18-29

gen-X

93% 86%The Web at 25 in the UShttp://www.pewinternet.org/2014/02/27/the-web-at-25-in-the-u-s/

ages 30-49

boomers

88% 84%The Web at 25 in the UShttp://www.pewinternet.org/2014/02/27/the-web-at-25-in-the-u-s/

ages 50-65

seniors

57% 56%The Web at 25 in the UShttp://www.pewinternet.org/2014/02/27/the-web-at-25-in-the-u-s/

ages 65+

18-29 30-49 50-65 65+

NewsEmail

SearchHealth InfoBuy Product

Government SiteTravel Reservations

NewsEmail

Search Banking

Health InfoBuy Product

Watch Video Social NetworkGovernment Site

Travel Reservations

IMNewsEmailMusicSearch Banking

&ODVVLÀHGVHealth InfoBuy ProductWatch Video

Social NetworkGovernment Site

Travel Reservations

IMNewsEmailMusicSearch

Gaming Banking&ODVVLÀHGVHealth InfoBuy ProductWatch Video

Social NetworkGovernment Site

Travel Reservations

Generations 2010: What Different Generations Do Online http://www.pewinternet.org/2010/12/16/generations-2010-what-different-generations-do-online/

WW

Only 54% of those with a disability use the internet.

1 in 5 Americans

&

1 in 2 seniors citizens

have a disability

Americans Living with Disability and Their Technology Profilehttp://www.pewinternet.org/2011/01/21/americans-living-with-disability-and-their-technology-profile/

Americans with Disabilities 2010 https://www.census.gov/people/disability/publications/sipp2010.html

operable

understandable robust

perceivable

Visual

auditory cognitive

motor

Ta

motorArthritis is the most common cause of disability in the US. 9.8% of adults have an arthritis related disease that limits activity.Arthritis Related Staticshttp://www.cdc.gov/arthritis/data_statistics/arthritis_related_stats.htm#6

Ta

simulation 1Tape knuckles of thumb, pointer ÀQJHU�DQG�PLGGOH�ÀQJHU�DQG�XVH�non-dominant hand to navigate tablet and desktop computer.

motor

“Sip and puff device attached to eSlate electronic voting machine” by Intel Free Press All Rights Reserved

“Jelly Bean Twist” by AbleNet Inc All Rights Reserved

One handed Keyboard” by Ken FlanneryAll Rights Reserved

Screenshot from Assistive Technology in Action - Meet Elle by FCTD Video

“Alternative Input: Joystick” by cobalt123 Attribution-NonCommercial-ShareAlike License

Ta

simulation 2Navigate digital media with only the keyboard. Be one with the tab and enter keys.

Have a PC? Experiment with a vision controlled mouse using the free CameraMouse software.http://www.cameramouse.org/index.html

motor

Ta

auditory9% of Americans have GLIÀFXOW\�KHDULQJ�

Americans Living with Disability and Their Technology Profilehttp://www.pewinternet.org/2011/01/21/americans-living-with-disability-and-their-technology-profile/

Ta

simulation 1Use cotton balls or ear plugs to simulate hearing loss while watch-ing online video or listening to on-line audio.

auditory

Ta

cognitive16% of Americans 16+ have a cognitive disability.

11% say that they have GLIÀFXOW\�FRQFHQWUDWLQJ��remembering or making decisions.

Americans Living with Disability and Their Technology Profilehttp://www.pewinternet.org/2011/01/21/americans-living-with-disability-and-their-technology-profile/

Cognitive Disabilities and the Web: Where Accessibility and Usability Meet?http://ncdae.org/resources/articles/cognitive/

Ta

simulation 1Use WebAim’s distraction simula-tor to experience cognitive overload and the confusion and disorientation that accompanies it. http://webaim.org/simulations/distractability-sim.html

cognitive

Ta

visual7% of Americans have GLIÀFXOW\�VHHLQJ�

10% of men have a form of color blindness.

Americans Living with Disability and Their Technology Profilehttp://www.pewinternet.org/2011/01/21/americans-living-with-disability-and-their-technology-profile/

ADAM Medical Encyclopedia: Color Blindnesshttp://www.ncbi.nlm.nih.gov/pubmedhealth/PMH0001997/

Ta

simulation 1Use NoCoffee Extension for Google Chrome to explore various visual impairments including low vision, mascular degeneration and color blindness. https://chrome.google.com/webstore/detail/nocoffee/jjeeg-

gmbnhckmgdhmgdckeigabjfbddl/related

visual

Ta

visual

simulation 2Create simulation glasses -- all you need is safety glasses and clear and black nailpolish.

Ta

simulation 3Use Chromatic Vision Simulator App and VisionSim on your mobile de-vice to simulate vision impairments in the physical world.https://itunes.apple.com/us/app/chromatic-vision-simulator/id389310222?mt=8

https://itunes.apple.com/us/app/visionsim-by-braille-institute/id525114829?mt=8

visual

Ta

simulation 4Experiment with navigating the web or your computer using a screen reader.

NVDA (Windows): www.nvaccess.org/download/

Voice Over(Mac): www.apple.com/accessibility/osx/voiceover/

visual

Design responsibly.

Digital Simulation Tools • No Coffee Chrome Extension • Vision Sim (iOS App) • Chromatic Vision Simulator (iOS App) • Slowy App !Digital Testing Tools • Web Developer Chrome Extension • WAVE Web Accessibility Evaluation Tool !Designed for Access • VoiceOver (Mac) *or NVDA (Windows)* • Camera Mouse (PC)* • Braille Touch (iOS App) • Verbally (iOS App) • Color ID (iOS App) • OpenWeb Dyslexia Browser (iOS App) • Readability (iOS App) • Clearly Chrome Extension • Silver Surf (iOS App) • Magnifying Glass with Light (iOS) !Further Reading • WebAim (web) • A Web For Everyone (Book) • Accessibility Simulations (Google Doc) @cyberthread