Accessibility/Mobile/GestureInterface: Difference between revisions

From MozillaWiki
Jump to navigation Jump to search
No edit summary
No edit summary
Line 1: Line 1:
This is a mapping of all functionality an accessible touch interface needs, and proposed gestures for each.
== Design Principals ==


This is a mapping of all functionality an accessible touch interface needs, and proposed gestures for each.
* Single handed operation whenever possible
* Shallow learning curve
* Portable knowledge from other platforms (iOS VoiceOver and Android TalkBack)
* Avoid timing-sensitive input, and have little assumptions of user dexterity
* Provide a large margin of error (help the user avoid mistakes), and empower them to explore


{| border="1" cellpadding="2" width="100%"
== Gesture Mappings ==
|+Accessibility Feature Mapping
=== Screen Reader ===
{| width="100%"
| colspan="2" align="center" style="background:#ffdead;" | '''One Finger'''
|-
|-
! Function !! Gesture !! Keyboard
| Double tap || Activate item
|-
|-
| Quick toggle || ||
| Swipe left/right || Move cursor to next/previous item
|-
|-
| colspan="3" align="center" style="background:#ffdead;" | '''Screen Reader'''
| Touch/move on the screen || Move cursor to item under finger ("explore by touch")
|-
|-
| Activate item under cursor || ||
| Swipe up/down || Move cursor by granularity* or adjust value
|-
|-
| Move cursor by item || ||
| Double tap-hold || Simulate long tap/drag*
|-
|-
| Move cursor to first or last item || ||
| Triple tap-hold || Open granularity menu*
|-
|-
| Move cursor by character || ||
| colspan="2" align="center" style="background:#ffdead;" | '''Two Fingers'''
|-
|-
| Move cursor by word || ||
| Swipe up/down || Scroll by page length
|-
|-
| Move cursor by line || ||
| Swipe left/right || Scroll or switch page
|-
|}
| Move cursor by heading || ||
 
|-
=== Magnifier ===
| Move cursor by link || ||
{| width="100%"
|-
| colspan="2" align="center" style="background:#ffdead;" | '''Two Fingers'''
| Move cursor by visited link || ||
|-
| Move cursor by landmark || ||
|-
| Move cursor by form control || ||
|-
| Move cursor by table || ||
|-
| Move cursor by table cell || ||
|-
| Make cursor selection || ||
|-
| Add cursor to selection || ||
|-
| Scroll to next or previous screen || ||
|-
| Read from cursor position || ||
|-
| Switch tab || ||
|-
| Open awesomebar || ||
|-
| Suspend special gestures (passthrough mode) || ||
|-
| colspan="3" align="center" style="background:#ffdead;" | '''Magnifier'''
|-
| Toggle magnifier || ||
|-
|-
| Pan region || ||
| Double tap-hold drag down/up || Zoom in/out
|-
|-
| Zoom in and out || ||
| Pan/Drag || Pan
|}
|}

Revision as of 21:07, 10 July 2014

Design Principals

  • Single handed operation whenever possible
  • Shallow learning curve
  • Portable knowledge from other platforms (iOS VoiceOver and Android TalkBack)
  • Avoid timing-sensitive input, and have little assumptions of user dexterity
  • Provide a large margin of error (help the user avoid mistakes), and empower them to explore

Gesture Mappings

Screen Reader

One Finger
Double tap Activate item
Swipe left/right Move cursor to next/previous item
Touch/move on the screen Move cursor to item under finger ("explore by touch")
Swipe up/down Move cursor by granularity* or adjust value
Double tap-hold Simulate long tap/drag*
Triple tap-hold Open granularity menu*
Two Fingers
Swipe up/down Scroll by page length
Swipe left/right Scroll or switch page

Magnifier

Two Fingers
Double tap-hold drag down/up Zoom in/out
Pan/Drag Pan
Retrieved from "https://wiki.mozilla.org/index.php?title=Accessibility/Mobile/GestureInterface&oldid=996177"