Accessibility on Android

Slide 1

Slide 1 text

Accessibility on Android Developing for the visually impaired

Slide 2

Slide 2 text

Every app that provides a service Transportation APPS THAT SHOULD BE ACCESSIBLE Messaging, Email, Social Banking, Financial E-commerce

Slide 3

Slide 3 text

STATS FOR FRANCE 8% color-blind in men 65k blind 1.2M suffer low vision

Slide 4

Slide 4 text

STATS FOR FRANCE 8% color-blind in men 1.2M suffer low vision 65k blind

Slide 5

Slide 5 text

STATS FOR FRANCE 8% color-blind in men 65k blind 1.2M suffer low vision

Slide 6

Slide 6 text

STATS FOR FRANCE 8% color-blind in men 65k blind 1.2M suffer low vision

Slide 7

Slide 7 text

Contrast COLOR BLINDNESS Matching

Slide 8

Slide 8 text

Lollipop accessibility Accessibility options Developer options

Slide 9

Slide 9 text

Developing for color blindness 1/4 Think about your color palette

Slide 10

Slide 10 text

Developing for color blindness 2/4 Offer patterns on top of colors

Slide 11

Slide 11 text

Developing for color blindness Developing for color blindness 3/4 Be careful about charts, maps...

Slide 12

Slide 12 text

Developing for color blindness 4/4 Test, test, test… !

Slide 13

Slide 13 text

LOW VISION Accessibility options Display options

Slide 14

Slide 14 text

Low vision • Use ‘sp’ for your text size • Make your layout adapt if the text is bigger (also needed for i18n) • Test your app

Slide 15

Slide 15 text

BLIND

Slide 16

Slide 16 text

TALKBACK

Slide 17

Slide 17 text

• Activates TalkBack when moving a finger around the screen • Double tap to validate selection • Two fingers for scrolling EXPLORE

Slide 18

Slide 18 text

Detect if accessibility services are enabled // For example: keep media controls visible if they are enabled AccessibilityManager am = (AccessibilityManager) context.getSystemService(ACCESSIBILITY_SERVICE); boolean isAccessibilityEnabled = am.isEnabled(); // TalkBack boolean isExploreByTouchEnabled = am.isTouchExplorationEnabled(); // Explore by touch

Slide 19

Slide 19 text

Content description: Buttons, ImageViews, CheckBoxes, ...

Slide 20

Slide 20 text

Content description: Buttons, ImageViews, CheckBoxes, ...

Slide 21

Slide 21 text

labelFor: links an EditText to its label

Slide 22

Slide 22 text

labelFor: links an EditText to its label

Slide 23

Slide 23 text

accessibilityLiveRegion: will be read when content is modified

Slide 24

Slide 24 text

accessibilityLiveRegion: will be read when content is modified

Slide 25

Slide 25 text

Testing frameworks // Espresso @Before public void setUp() { AccessibilityChecks.enable(); } // Robolectric @org.robolectric.annotation.AccessibilityChecks @Test public void clickingLogin_shouldStartLoginActivity() {}

Slide 26

Slide 26 text

• Provide content descriptions for: Buttons, ImageViews, ImageButtons, CheckBoxes, … • Do not put “button” or “image” in your content descriptions • Use labelFor on your EditTexts • Use Lint and Accessibility Checks • Test your app ! Developing for the blind

Slide 27

Slide 27 text

Thank you ! @AdrienCouque

Slide 28

Slide 28 text

Illustrations: Anne-Audrey Gounot Color blind palette: http://mkweb.bcgsc.ca/biovis2012/ Dots: https://dribbble.com/shots/1599809-Color-Blind-Mode Trello: http://littlebigdetails.com/post/35775193711/trello-color-blind-friendly-mode-makes Color blind graphs: wearecolorblind.com Blind app user: Tommy Edison: https://www.youtube.com/watch?v=0i1k3srHKAA RESOURCES