How users interact with input devices

Here's a list of common interactions, and how they map to gestures across touch, touchpad, mouse, keyboard , and pen/stylus for Windows 8.1.

See this feature in action as part of our App features, start to finish series: User interaction: Touch input... and beyond

Interactions and devices

Windows 8.1 supports a variety of input devices, from touch to keyboard. It also provides an intuitive and efficient interaction experience that is unique to each device, but functionally consistent across devices and modes, such as touch keyboard, mouse wheel, and pen eraser.

Design the UI of your Windows Store app for touch but consider the design implications for a variety of devices:

  • Touchpad, which combines touch and mouse experiences
  • Mouse
  • Pen/stylus, specialized for digital ink
  • Keyboard devices, for text editing and command shortcuts

Touch

Touchpad

Mouse

Keyboard (hardware)

Pen/Stylus

Select

Swipe opposite the scrolling direction (see Guidelines for cross-slide)

Tap two fingers

Right-click

Spacebar

Swipe opposite the scrolling direction (see Guidelines for cross-slide)

Show app bar

Swipe from top or bottom edge

Swipe from top or bottom edge

Right-click

Windows Logo Key+Z, menu key

Swipe from top or bottom edge

Show charms

Swipe from right edge

Swipe from right edge

Hover over top or bottom-right corner

Windows Logo Key+C

Swipe from right edge

Context menu

Tap on selected text, press and hold

Tap two fingers on selected text, press and hold

Right-click

Menu key

Tap on selected text, press and hold

Launch/activate

Tap

Tap

Left-click

Enter

Tap

Scrolling short distance

Slide

Slide two fingers

Scroll bar, arrow keys, left-click and slide

Arrow keys

Scroll bar

Scrolling long distance

Slide (including inertia)

Slide two fingers (including inertia)

Scroll bar, mouse wheel, left-click and slide

Page up, Page down

Scroll bar

Rearrange (drag)

Slide opposite the scrolling direction past a distance threshold (see Guidelines for cross-slide)

Press, hold, and slide

Left-click and slide

Ctrl-C or Ctrl-X, Ctrl-V

Slide opposite the scrolling direction past a distance threshold (see Guidelines for cross-slide)

Zoom

Pinch, stretch

Pinch, stretch

Mouse wheel, Ctrl+mouse wheel, UI command

Ctrl+Plus(+)/Minus(-)

UI command

Rotate

Turn

Turn

Ctrl+Shift+mouse wheel, UI command

Ctrl+Plus(+)/Minus(-)

UI command

Insert cursor/select text

Tap, tap on gripper

Tap

Left-click+slide, double-click

Arrow keys, Shift+arrow keys, Ctrl+arrow keys, and so on

Tap, tap on gripper

More information

Press and hold

Press and hold

Hover (with time threshold)

Move focus rectangle (with time threshold)

Press and hold

Move focus

N/A

N/A

N/A

Arrow keys, Tab

N/A

Interaction feedback

Touch visualizations

Cursor movement, cursor changes

Cursor movement, cursor changes

Focus rectangles

Pen visualizations

 

Conceptual

Responding to user interaction

Touch interaction design

Reference

Windows.UI.Core

Windows.UI.Input

Windows.UI.Xaml.Input

Samples (DOM)

HTML scrolling, panning and zooming sample

Input: DOM pointer event handling sample

Input: Instantiable gestures sample

Samples (Windows Store app APIs)

Input: Manipulations and gestures (JavaScript) sample

Input: Windows 8 gestures sample

Input: XAML user input events sample

XAML scrolling, panning, and zooming sample

Samples (DirectX)

DirectX touch input sample

Input: Manipulations and gestures (C++) sample