WhoBuilt

Can't touch this - Different ways users interact with their mobile devices

Sep 28, 2022· 29 min· 644 views·Watch on YouTube

Speakers

Eeva “Eevis” Panula, an accessibility specialist and senior software developer at Oura, explains how people use mobile devices with different input methods at RNEU 2022.

More than touch

Panula introduces alternatives to touch for people who cannot see or use a touchscreen easily. She outlines screen readers, physical keyboards, switch devices, voice recognition, and screen magnification, then explains why developers should consider and test these methods.

Screen readers and keyboards

Screen readers such as TalkBack and VoiceOver provide speech or Braille feedback and navigation options; text-to-speech reads selected text but does not offer the same navigation. Physical keyboards can help people with motor disabilities or tremors avoid small touch targets. Modified keyboards and keyboard-mimicking devices use the same events, so developers can begin testing with a regular keyboard.

Switches, voice, and magnification

Switch devices let users navigate and select items with one or two controls, which may be buttons, eye tracking, facial expressions, joysticks, or sip-and-puff controls. Panula notes that Stephen Hawking used a cheek switch to navigate and communicate. Voice recognition supports spoken commands, while larger text, device zoom, and screen magnification can help people with low vision.

Build accessible interfaces

For keyboard users, Panula recommends visible focus styles with enough contrast against both the background and the highlighted component. Screen reader users benefit from headings marked programmatically with an accessibility role. Use semantic controls such as buttons where possible; custom elements need an accessible name, role, and relevant state.

Respect settings and test

Panula says to respect the operating system's reduced motion setting, which can help people avoid distraction, nausea, or dizziness. In React Native, developers can check it with AccessibilityInfo's isReduceMotionEnabled method and omit animations or use reduced versions when enabled. She closes by urging developers to learn accessibility semantics and test with screen readers, keyboards, and switches.

Takeaways

  • Test mobile interfaces with input methods beyond touch, including keyboards, screen readers, and switches.
  • Give keyboard users a clearly visible focus indicator with sufficient contrast.
  • Mark headings programmatically and prefer semantic controls such as buttons.
  • Provide custom controls with an accessible name, role, and relevant state.
  • Honor reduced motion preferences and check layouts with larger text.

Mentioned in this talk

Search inside this talk

What was claimed 8

  • feature
    Oura: Ring company
    “Oura, the ring company”
    YouTube
    Unverified1 source· Talk
  • role at
    Eeva Panula is accessibility specialist and senior software developer at Oura
    “I'm an accessibility specialist and senior software developer ... I currently work at Oura”
    YouTube
    Unverified1 source· Talk
  • feature
    screen readers: Provide feedback from the screen through speech or Braille and offer navigation options
    “This feedback is provided either through speech or Braille.”
    YouTube
    Unverified1 source· Talk
  • feature
    VoiceOver: Screen reader for iOS devices
    “VoiceOver for iOS devices”
    YouTube
    Unverified1 source· Talk
  • feature
    TalkBack: Screen reader for Android
    “TalkBack for Android”
    YouTube
    Unverified1 source· Talk
  • feature
    text-to-speech: Reads selected on-screen text aloud but does not provide navigation options
    “It doesn't provide navigation options. It's just for listening to text”
    YouTube
    Unverified1 source· Talk
  • feature
    switch devices: Help people with movement-limiting disabilities navigate screens and make selections
    “Switch devices help people with movement-limiting disabilities navigate screens and make selections”
    YouTube
    Unverified1 source· Talk
  • feature
    AccessibilityInfo API: IsReduceMotionEnabled checks whether the user's reduced-motion setting is enabled
    “we can find out whether the user has this setting on via the AccessibilityInfo API's isReduceMotionEnabled method”
    YouTube
    Unverified1 source· Talk

Related talks