29/11/2017

Today

Universal design Universal Design Types of exclusions Considerations for interactive technologies Resources and examples Nov 29, 2017

Slides based on materials from Chris Collins, Karyn Moffatt, Michael Terry. Thank you!

Fall 2017 COMP 3020 1 Fall 2017 COMP 3020 2

Universal Design Designing for Disabilities

What is it? Why design for users with disabilities? Why is it important? It’s the ethical thing to do Because it’s the law in some countries Business opportunities Because of the “curb cut phenomenon”

Fall 2017 COMP 3020 3 Fall 2017 COMP 3020 4

1 29/11/2017

Curb-Cut Phenomena Curb-Cut Effect

Designing to accommodate users with disabilities can Many technologies designed for those benefit everyone with disabilities have had this positive Dubbed the “curb cut effect phenomenon”

Sidewalk curbs must be Examples? “cut” to allow wheelchair access But benefits more than just wheelchair users Easier to roll luggage, use strollers, carts, etc.

Fall 2017 COMP 3020 5 Fall 2017 COMP 3020 6

Curb Cut: “Classic” Examples Curb Cut: Classic Examples

Cassette tape Voice-actuated telephone Developed as an alternative to reel-to-reel tape so visually impaired individuals could use books on tape more easily Hands-free dialing originally for paralyzed Engineers didn’t think average user would buy it because of inferior audio quality

Remote control for TV "Personal Digital Assistant” Originally designed for those with mobility impairments developed in support of enabling persons Closed captioning who are deaf to send and receive Designed for deaf messages Data mining, gyms, language learners, even children reading

Fall 2017 COMP 3020 7 Fall 2017 COMP 3020 8

2 29/11/2017

Economic and Cultural Other Forms of Accessibility? Exclusions The concept of Universal Design is Economic: about ensuring that technology is People are excluded if they cannot afford inclusive of all users some essential technology. Cultural: Beyond physical and cognitive disabilities, what other factors might Assumptions embedded in technology that exclude certain cultures. make technology accessible for some, E.g., using a metaphor based on American but not others? football would exclude those who do not understand the game.

Fall 2017 COMP 3020 9 Fall 2017 COMP 3020 10

Economic Exclusions: Economic Exclusions: Moses’ Moses’ Bridges Bridges NY City Planner, Robert Moses Made bridges small on purpose: busses could not go under Destinations (e.g., nice beaches) became socially segregated

Photo: Historic American Engineering Record Clearance: 7’, 7”. Too small for bus. http://www.hopesandfears.com/hopes/now/politics/216905-the- Fall 2017 COMP 3020 11 12 lingering-effects-of-nyc-racist-city-planning

3 29/11/2017

Social Exclusion Physical Exclusion

Can occur if technology is unavailable at Inappropriate positioning of equipment an appropriate time and place Or if people are not members of a Input and output devices making particular social group and cannot excessive demands on user abilities. understand particular social mores or messages. Examples: an ATM may be positioned too high for a person in a wheelchair to reach E.g., new high tech assistant, only on Facebook a mouse may be too big for a child’s hand

Fall 2017 COMP 3020 13 Fall 2017 COMP 3020 14

Conceptual Exclusions Equality vs equity

People may be excluded because they cannot understand complicated instructions or obscure commands or they cannot form a clear mental model of the system.

E.g., Command line interface for statistics (e.g., the program R). Giving everyone the same Giving everyone the same access Statistics knowledge not the barrier thing http://culturalorganizing.org/the-problem-with-that-equity-vs-equality-graphic/ Fall 2017 COMP 3020 15 Fall 2017 COMP 3020 16

4 29/11/2017

Good universal design Principles of Universal Design

Equitable Use: The design does not disadvantage or Equity “crutches” not needed – the stigmatize any group of users. barrier is removed Flexibility in Use: The design accommodates a wide range of individual preferences and abilities.

Simple, Intuitive Use: Use of the design is easy to understand, regardless of the user’s experience, knowledge, language skills, or current concentration level.

Perceptible Information: The design communicates necessary information effectively to the user, regardless of ambient conditions or the user’s sensory abilities.

http://www.ncsu.edu/ncsu/design/cud/pubs_p/docs/poster.pdf

Fall 2017 COMP 3020 17 Fall 2017 COMP 3020 18

Principles of Universal Design

Tolerance for Error: The design minimizes hazards and the adverse consequences of accidental or unintended actions.

Low Physical Effort: The design can be used efficiently Universal Design is mostly and comfortably, and with a minimum of fatigue. just good design Size and Space for Approach and Use: Appropriate size and space is provided for approach, reach, manipulation, and use, regardless of the user’s body Notice the overlap above with size, posture, or mobility. our standard usability principles? http://www.ncsu.edu/ncsu/design/cud/pubs_p/docs/poster.pdf

Fall 2017 COMP 3020 19 Fall 2017 COMP 3020 20

5 29/11/2017

Designing to Support Accessibility in User-Centered Everyone Design Often less resource intensive if A great online book and resource: accessibility is considered from the outset http://www.uiaccess.com/JustAsk/ rather than having to retrofit e.g., curb cuts require less concrete!

The next few slides will give pointers to considerations, resources, etc.

Some universities offer entire courses on accessible design

Fall 2017 COMP 3020 21 Fall 2017 COMP 3020 22

Designing to Support Operating System Support Everyone Modern operating systems have a lot Typical support includes: Built-in screen readers of built-in support Ability to magnify portions of screen Ability to increase contrast of Set of end-user tools/capabilities screen Ability to control interface Set of toolkits to help create an using only keyboard application that is more universally Ability to increase cursor size accessible Fonts People also adjust system- wide font size for minor visual impairments

Fall 2017 COMP 3020 23 Fall 2017 COMP 3020 24

6 29/11/2017

Accessibility Toolkits Designing for Accessibility

GUI toolkits like Java and those for MS Windows provide Basic ideas: hooks to integrate with accessibility functions In Java: Accessibility API Use accessibility API’s/toolkits to encode information about interface and its use within the components themselves. Windows: UI Automation Information is made available to accessibility software Toolkits provide features that allow you to provide additional Allows application to employ alternative input/output information about your interface, individual components, and modalities by accessibility software the functions they serve Ensure users can accomplish same task with multiple input This information allows accessibility software to expose your interface to users using different output modalities (e.g., screen devices readers) Create visual designs with expectation that users with Also allows accessibility software to control your software using visual impairments will be using your application alternative input methodologies (e.g., voice command) Test software under conditions of those with disabilities

Fall 2017 COMP 3020 25 Fall 2017 COMP 3020 26

Visual Impairment

A visual impairment can limit ones Supporting Everyone: ability to view text and graphical output Some Examples With text output, a common solution is to use a screen reader What about with graphical output?

Fall 2017 COMP 3020 27 Fall 2017 COMP 3020 28

7 29/11/2017

Visual Impairment VoiceOver

There are a number of ways to provide A built in screen alternative access to the information in reader with Mac OS X graphical output including: Supports speech Providing alternative text for graphics so that a screen reader can be used (e.g., webpages) synthesis as well as braille display output Using sound to provide auditory cues regarding the graphical elements in the interface (e.g., mouse-over sounds for buttons)

Using tactile output to provide more information about graphics (Example: braille)

Fall 2017 COMP 3020 29 Fall 2017 COMP 3020 30

Narrator Alternative Text

A built in screen reader with Windows 7/10 "This image is a line art drawing of a grey magnifying Supports speech synthesis glass with blue glass. If you click on it, it will take you to the Search page for this Acme Let’s try it! Company website."

Fall 2017 COMP 3020 31 Fall 2017 COMP 3020 32

8 29/11/2017

Alternative Text Images

We see more and more text being “Search” posted to twitter via images

Why?

Why is this problematic Use text that is concise and from an accessibility adequately descriptive standpoint?

Fall 2017 COMP 3020 Fall 2017 COMP 3020 34 33

Hearing & Speech Physical Impairment Impairment Output Input Multimedia is one area where a hearing impairment can be difficult With a physical impairment, providing input (As with television content) it is important the multimedia using a keyboard and mouse may be limited content on the web have captions or not possible

Input Alternative forms of input maybe used including: In addition to traditional text-based input the use of gesture-based input could enable users to use sign Speech language with a computer This may be faster depending on the gesture Eyegaze recognition software Keyboard with predictive text

Fall 2017 COMP 3020 35 Fall 2017 COMP 3020 36

9 29/11/2017

Dyslexia

“…a learning disability that manifests primarily as a difficulty with written language, particularly with reading and spelling.”

Speech input and output can be used in place of text

Specialized spell-checkers can be included E.g.: http://www.ghotit.com

When designing navigation, recall the “Consistency” principle Use color-coding and visual queues to help users navigate the interface

Fall 2017 COMP 3020 Fall 2017 COMP 3020 38 37

W3C Accessible Captchas Captchas Guidelines Solutions:

Logic puzzles, audio outputs

Single sign on across sites

Better spam filtering and heuristic detection of robot users

http://www.extremetech.com/wp-content/uploads/2011/11/captcha-selection1.jpg

Fall 2017 COMP 3020 Fall 2017 COMP 3020 39 40

10 29/11/2017

Example reCAPTCHA with audio alternative Accessibility Standards

Example logic captcha

http://files.samhart.net/img/mis c/logic-captcha.png

Fall 2017 COMP 3020 Fall 2017 COMP 3020 42 41

W3C Web Accessibility Assistive Technologies Initiative Guidelines and technical specifications for “Any product, instrument, equipment or universal web design, for example: technical system used by a disabled or Supporting screen reading elderly person, made specially or existing Use of styles which can be customized by on the market, aimed to prevent, accessibility plugins compensate, relieve or neutralise the Tools for designers / developpers deficiency, the inability or the handicap.” Accessibility “Check lists” International ISO-9999 Standard Evaluation tools (for automated checks) A very active area of HCI research as well http://www.w3.org/WAI/ as applied R&D

Fall 2017 COMP 3020 Fall 2017 COMP 3020 44 43

11 29/11/2017

VizWiz Curb Ramp Detection

[Bigham et al.] Automatic Curb ramp detection using computer vision

+ crowdsourced verification

[Hara et al]

Fall 2017 COMP 3020 45 Fall 2017 COMP 3020 46

Supple++ [Gajos et al.] Adaptive Mobile Input

Optimizing interface layout according TrueKeys: identifying and to unique motor abilities correcting typing errors for people with motor impairments. [Kane et al] http://www.eecs.harvard.edu/~kgajos/research/supple/ Also found useful for text input while walking [Kane, Wobbrock, &Smith, IMobileHCI'08.

Thinking in terms of access can help everyone!

Fall 2017 COMP 3020 47 Fall 2017 COMP 3020 48

12 29/11/2017

Aphasia

A f Y l Q w

r a i

i

Aphasia is a loss of words hp a s a sso o d x T l

y t e

e g – not intelligence - o n i iir nc Cognitive Support Examples

Acquired Impairment of language disorder communication abilities Caused by brain Relative sparing of damage (e.g. stroke, trauma, other cognitive abilities etc.)

Fall 2017 COMP 3020 49 Fall 2017 COMP 3020 2

VERA: Visually-Enhanced ESI Planner Recipe Application [Tee et. Al]

Fall 2017 COMP 3020 51 Fall 2017 COMP 3020 52

13 29/11/2017

MyVoice – Context Aware Today’s Message: Communication Aid Universal Design Universal design is about ensuring that technology is inclusive rather than exclusive

Technologies designed to accommodate disabilities can have their benefits extend to all

Assistive technologies are an exciting area of active research & development, with lots of potential for impact

Fall 2017 COMP 3020 Fall 2017 COMP 3020 53 54

14