Accessibility --Week 1, Monday--

background-image: url(img/inclusive-design/people.png)

.left-column50[
# Welcome to the Future of Access Technologies

CSEP 590a, Spring 2021
 
 
Thanks to [Tracy Tran](https://www.microsoft.com/en-us/research/people/tracyt/) for much of the text and imagery in this slide deck!
]
---
name: normal
layout: true
class:

---
![:img What is disability? Text is surrounded by diverse people,100%, width](img/inclusive-design/what-is-disability.png)

---
.left-column[
## Disability

a context dependent .red[mismatched interaction]
]

.left-column40[
##       1980
![:img picture of a person,60%, width](img/inclusive-design/1980.png)
.font-medium[**Disability as a personal attribute**
"restriction or lack of ability ... within the range considered normal for a human being" (medical model)
]
]

.left-column40[
##       Today 
![:img picture of a network of people,60%, width](img/inclusive-design/today.png) 
.font-medium[**Disability as context-dependent**
 "the interaction between features of a person's body and features of  the society in which they live" (social model) 
]
]

---
# Worldwide Stats

1 Billion (~15%) of population [WHO'11]; 
19% of USA [Census'12]

| Visual | Hearing | Cognitive | Speech | Mobility | Neural |
|--------------------------------------------------------------------------------------------------------|-------------------------------------------------------------------------------------|-----------------------------------------------------------------------------------------------------------------------------------|--------------------------------------------------------------------------------------------------------------------------------------------------------------------|-----------------------------------------------------------------------------------------------------------------------------------------------------|-----------------------------------------------------------------------------------------|
| ![:img Headshot of ray charles in front of a microphone,100%,width](img/accessibility/raycharles.jpeg) | ![:img Headshot of Marlee Matlin signing,100%,width](img/accessibility/matlin.jpeg) | ![:img Headshot of Temple Grandin out in nature wiht her red tie blowing in the wind,80%,width](img/accessibility/grandin.jpeg) | ![:img Picture of President Biden hugging Brayden Harrington-the 13 year old boy with whom he bonded over stuttering,100%,width](img/accessibility/biden.jpg) | ![:img Picture of Ali Stroker; the first disabled woman to win a Tony Award; accepting her award, 100%, width](img/accessibility/stroker.jpeg) | ![:img Picture of Catherine Zeta-Jones, 100%, width](img/accessibility/zeta-jones.jpeg) |
| Ray Charles | Marleen Matlin | Temple Grandin | President Biden | Ali Stroker | Catherine Zeta-Jones |
| Colorblind Low Vision Blind | Hearing loss Deaf | Dyslexia Seizure Learning Disabilities Autism | Stutter | Quadriplegia | Bipolar Anxiety PTSD Depression |

---
# Worldwide Stats

.left-column60[
1 Billion (~15%) of population [WHO] 
19% of USA [Census'12]

Rates of disability are increasing
- Aging population
- Situational Impairment
- Increasing numbers of people with chronic illness (can span disability segments)
]
.right-column40[
| Parkinson's Disease | ALS |
| --- | --- | 
| ![:img Headshot of Michael J. Fox,100%,width](img/accessibility/fox.jpg) | ![:img Headshoot of Stephen Hawking in his wheelchair with a chalkboard covered in equations behind him,100%,width](img/accessibility/hawking.jpeg) 
| Michael J. Fox | Prof. Stephen Hawking | 
| Parkinson’s affects cognition, speech and mobility | ALS affects mobility and speech | 
]

---
# A note on language
.left-column[
![:img Picture of a hand crossing out the dis in the word disability, 100%, width](img/accessibility/ability.png)
]
.right-column[
Many ways to think about disability, ability. Will talk in more depth later this quarter but…
- Medical Model  (how do we *fix* people) 
- Social Model (disability as social construct)
- Combined: Disability resides both in the person and in society

Ability first vs person first
]

---
# Accessibility

.row[
.column[**Disability** is a mismatched interaction between someone and their context]
.column[**Accessibility** is a broad term for tools that help people navigate mismatched interactions and provides options for people of all ability]
.column[**Inclusive design** is a framework that helps us design more accessible products]
]
.row[
![:img line of animated iconic representations of people,100%, width](img/inclusive-design/longpeople.png)
]

---
.left-column50[
# Assistive technology

.quote["[anything] ... used to increase, maintain, or improve functional capabilities of individuals with disabilities"] (Wikipedia)

]
.right-column50[
![:img a spoon with a plastic attachment so it can be held without gripping, 100%, width](img/accessibility/spoonhelp.png)

]
---
.left-column50[
# Assistive technology 
.quote["[anything] ... used to increase, maintain, or improve functional capabilities of individuals with disabilities"] (Wikipedia)

How people with disabilities *may* navigate computing (and the world)

Not a *medical* device
]
.right-column50[
.left-column[
![:img A picture of a speaker; magnifier; microphone; computer; and game control ,85%, width](img/inclusive-design/at.png)]
.right-column90[
.font-medium[Screen Readers] 
.font-mediumsmall[Narrator, VoiceOver, JAWS, Window Eyes, NVDA, TalkBack]

.font-medium[Screen adjustment] 
.font-mediumsmall[ZoomText, Magnifier, Zoom, High Contrast ]

.font-medium[Speech input] 
.font-mediumsmall[Dragon Naturally Speaking, Dictation, Speech Recognition]

.font-medium[Keyboarding] 
.font-mediumsmall[Sticky Keys, Mouse Keys, Filter Keys, Keyboard Shortcuts]

.font-medium[Many more] 
]
]

---
# Some terms used in HCI

.left-column50[
Universal Design
- One design works for everybody
- Typical example: curb cuts

Accessibility software
- Accessibility of a computersystem to all people, regardlessof disability or severity of impairment
]
.right-column50[
Access Technology - Richard Ladner
- Technology that makes accessible what otherwise isn’t(including things out in the world and computers)

Ability-Based Design  -  Jacob Wobbrock
- Technology that adapts to the abilities of the user in their current context
]

---
# Accessibility Software

.left-column50[
Most Operating Systems have a whole collection of adaptations
- Accessories/Ease of Access
- Magnifier – make whole screen or a portion bigger
  - Can also just use larger fonts, lower resolution
  - Change colors and contrast
- Free Screen Reader – read the words on the screen
- On-Screen keyboard 
  - Can be scanned
- Built-in speech recognition
]
.right-column50[
![:img Windows magnifier control showing increase and decreas buttons; 300%; Views menu; settings and help ,75%, width](img/accessibility/magnifier.png)

![:img Windows access settings showing magnifier; narrator; on screen keyboard; windows speech recognition ,75%, width](img/accessibility/windows-access.png)]

---
# Accessibility Software

.left-column50[
Adaptations for mouse
- Make mouse easier to see
- Move mouse with the keyboard

Adaptations for keyboard
- Sticky Keys – so no need for chords
- Work like on Smartphones
]
---
# On Screen Keyboards

.left-column50[
Built-in or add-on
- Usually add auto-complete and *auto-predict* .footnote[Auto-predict: Predict next word based on previous words with no letters typed]

Can point to on-screen keyboards with various mechanisms

Or use scanning keyboards
- e.g. sip and puff to select 
]
.right-column50[
![:youtube Video of boy using switch input to game,2BhHwk9qSvI]

]

---
# Screen Readers: Non-Visual Computer Use

- Reads the words on the screen
- Keystroke to move to next area

.left-column40[
![:img  Same picture highlighting the hamburger menu (which has the alt text "hamburger menu") and an image (which has no alt tex and just plays an unintelligible name). The audio of this page is the video at right,100%, width](img/inclusive-design/banking.png)
]

.right-column60[
 
![:youtube Banking failure, b-R5r_aKmKo]
]

---
# Accessibility in the iPhone

Many pages of accessibility settings
- VoiceOver – reads what is on screen
- Speech recognition for controlling device
- Zoom – screen magnifier – 3 finger tap
- Closed captions on videos
- AssistiveTouch – so don’t need multiple fingers, don’t need to press Home 
button, etc.
- Switch Control (ios7 and later): 
 - Optional connection to external switch
 - Can use [head movement with built in camera](https://www.youtube.com/watch?v=RXF2ThtYXzM)

---
# Augmentative and Alternative Communication (AAC) devices
.left-column50[
Originally were cardboard pictures that eyes would point at

Now computerized e.g. [MinSpeak](https://minspeak.com/) 
  - Usually pictures since faster than typing
  - Pointing – head or eye tracking or scanning with switch (like keyboards)
]
.right-column50[
Black AAC User Perspectives on Racism and Disability

![:youtube Video from black disabled men talk podcast,iTSAK4yRf5A?t=960]
(start at around 16)

]
---
# Lots of exciting advances happening
.left-column[
- Vizwiz (Bigham)
]
.right-column[
![:img a website titled vizwiz showing about 10 photographs taken by blind people each with a question that the photographer was hoping to have answered ,75%, width](img/accessibility/vizwiz.png)
]
---
# Lots of exciting advances happening
.left-column[
- Vizwiz 
- Thingiverse (Hurst)
]
.right-column[
![:img a website titled thingiverse showing about 10 photographs of 3D printable accessibility solutions ,75%, width](img/accessibility/thingiverse.png)
]
---
# Lots of exciting advances happening
.left-column[
- Vizwiz 
- Thingiverse 
- Facade (Guo)
]
.right-column[
![:img a microwave with 3D printed facade making flat touchscreen accessible nonvisually ,75%, width](img/accessibility/facade.png)
]
---
# Lots of exciting advances happening
.left-column[
- Vizwiz 
- Thingiverse 
- Facade 
- Ravelry (Mankoff)
]
.right-column[
![:img Webpage labeled ravelry showing about 10 hand-knit accessibility solutions ,75%, width](img/accessibility/ravelry.png)
]

---
# Lots of exciting advances happening
.left-column[
- Vizwiz 
- Thingiverse 
- Facade 
- Ravelry 
- [Voice Assistants](https://voicebot.ai/2019/09/11/amazon-alexa-ad-shows-how-voice-assistants-help-visually-impaired-people/) (Findlater)
]

![:youtube Video showing notifications,UUEXVpC2ALQ]
(start at around 2:20)
]

---

.left-column60[
## Accessibility is not a given

Originated in the disability rights movement

History of protest

Collaboration with Black Panther movement

]

.right-column40[![:img A picture of protestors ,100%, width](img/inclusive-design/rights-narrow.png)]

---
# Legal Basis for Accessibility

Rehab Act (1976)
- Equal access to government services

Americans with Disabilities Act (1990)
- Equal access to all goods/services

UN Convention on Rights of PWD (2006)
- 147 countries ratified convention

---
# Human Rights Basis for Accessibility

.right-column50[
.row[
![:img online education by shashank singh from the Noun Project,20%, width](img/inclusive-design/education.png)     .centerv[Education]]

.row[
![:img employment by Tee Yang from the Noun Project,20%, width](img/inclusive-design/employment.png)     .centerv[Employment]]

.row[
![:img zoom icon,20%, width](img/inclusive-design/ZoomIcon.jpg)     .centerv[Pandemic everything!]]
]

.left-column50[
.row[
![:img shopping cart by LINDA WATI from the Noun Project
,20%, width](img/inclusive-design/shop.png)     .centerv[Shop From Home]]

.row[
![:img audiobook by mikicon from the Noun Project,20%, width](img/inclusive-design/audiobook.png)     .centerv[Blind People Read 7x as Many Books]]

]

---
# Practical Basis for Accessibility

.column[
.centerh[
![:img A typewriter,40%, width](img/inclusive-design/typewriter.png)
]
In 1808, Pellegrino Turri built the first typewriter, so that his blind lover, could write letters more legibly. 
]

.column[
.centerh[
![:img email,40%, width](img/inclusive-design/email.png)
]
In 1972, Vint Cerf programmed the first email protocols because electronic messaging was the only seamless way to communicate with his deaf wife while he was at work.
]
.column[
.centerh[
![:img A straw,40%, width](img/inclusive-design/straw.png)
]
In 1937, Joseph Friedman created the first bendy straw to help his young daughter drink from a cup on a counter that was too high for her. 
]

---
# People with Disabilities as Early Adopters