Вы находитесь на странице: 1из 50

One-Handed input

Challenges for one-handed input


Solutions
Design exercise
Announcements
Experiments will take place entire month of
March
Will provide sign-up sheets in class

Assignment 2 due on Friday


Feedback on GPS application

3/1/2013 Comp 4020 - HCI 2 (PPI) 2


Google Glass
Video/Thoughts

http://www.businessweek.com/stories/2008-01-02/the-long-nose-of-
innovationbusinessweek-business-news-stock-market-and-financial-advice

3/1/2013 Comp 4020 - HCI 2 (PPI) 3


Understanding Single-Handed Mobile Device
Interaction

Amy K. Karlson, Benjamin B. Bederson, Jose L. Contreras-Vidal

http://hcil.cs.umd.edu/trs/2006-02/2006-02.pdf

3/1/2013 74.402 - HCI 2 (PPI) 4


Field Study
50 travelers (27 male) at Baltimore
Washington International Airport

3/1/2013 74.402 - HCI 2 (PPI) 5


Survey
Questions to understand when and why
people use one vs. two hands to operate a
device

3/1/2013 74.402 - HCI 2 (PPI) 6


Number of hands (a) used and (b) preferred (1=solid vs. 2=striped) for 18
mobile tasks as a % of observed population. Hand usage for each task is
broken down by device type (TS = touchscreen).
The frequency and reasons for one (solid)
vs. two (striped) handed device use.
Thumb movement study

3/1/2013 74.402 - HCI 2 (PPI) 9


Movement maps by device. Depth of color in
columns 1 and 2 indicate user agreement.
Subjectively easier regions

Subjective ratings for interacting with


discrete targets in 9 regions of the device.
Mean comfort rating (1-7; 7=most
comfortable) is shown in the upper left
corner of each region, and depth of
background color indicates more
comfort.

White blocks in each cell indicate the


mean size, in mm, of the smallest
comfortable target in the region.

3/1/2013 Comp 4020 - HCI 2 (PPI) 11


Device convergence
Mini tablets flooding the market

Issues of one-handedness becomes more


crucial (aside from form factor concerns)

How do we address this challenge?

3/1/2013 Comp 4020 - HCI 2 (PPI) 12


Solutions
1. Minimize input (via simple global gestures)
2. Remap space (Thumbspace)
3. Quick access + Refine (TapTap)
4. Semantic objects (MagStick)
5. Extra sensory input (Dual-Surface)

3/1/2013 Comp 4020 - HCI 2 (PPI) 13


Gesture based cursor navigation
1

3/1/2013 Comp 4020 - HCI 2 (PPI) 14


Couple gesture with layout
1

3/1/2013 Comp 4020 - HCI 2 (PPI) 15


Thumb gesture vocabulary
1

3/1/2013 Comp 4020 - HCI 2 (PPI) 16


Micro-rolls
Thumb rolling can be used as shortcuts,
1
anywhere on the screen

3/1/2013 Comp 4020 - HCI 2 (PPI) 17


Micro-rolls traces
1

Typical instances of the kinematic traces produced on the touch-screen by


the 16 elemental gestures of our repertoire. Shown are the successive
positions of the fingertip barycenter (t 25 ms).
3/1/2013 Comp 4020 - HCI 2 (PPI) 18
RollMark Menu
1

3/1/2013 Comp 4020 - HCI 2 (PPI) 19


Micro-Rolls Study
1

3/1/2013 Comp 4020 - HCI 2 (PPI) 20


Results
1

3/1/2013 Comp 4020 - HCI 2 (PPI) 21


Remap input space - Thumbspace
2

(a) Defining a ThumbSpace. (b) ThumbSpace in use.

3/1/2013 Comp 4020 - HCI 2 (PPI) 22


Thumbspace activation
2

ThumbSpace interaction. (a) A calendar. (b)


Pressing enter on the directional pad launches a
Radar View within the users predefined
ThumbSpace. (c) To select July 3rd, the user aims
for the 3rd in the Radar View. (d) Touching the
screen highlights the object associated with the
Radar View proxy actually hit (June 26th), and the
ThumbSpace disappears. (e) To adjust the cursor
the user rolls her thumb downward to move it from
June 26th to July 3rd, and lifts her thumb to perform
the selection.
3/1/2013 Comp 4020 - HCI 2 (PPI) 23
Thumbspace evaluation
2

3/1/2013 Comp 4020 - HCI 2 (PPI) 24


Results
2

3/1/2013 Comp 4020 - HCI 2 (PPI) 25


Results
2

3/1/2013 Comp 4020 - HCI 2 (PPI) 26


Quick+Refine
3
Adaptative
Offset
DirectTouch Offset Cursor Cursor Shift Escape Thumbspace

Occlusion

Border Solves in
accessibility part

Accuracy

Evaluated in a controlled experiment

3/1/2013 Comp 4020 - HCI 2 (PPI) 27


TapTap
3

Target to select 1st tap Magnified popup 2nd tap

3/1/2013 Comp 4020 - HCI 2 (PPI) 28


TapTap

Temporal multiplexing strategy


3
1ST tap: Specify the focus area
2nd tap: Select the target at a larger scale
Zooming strategy (Automatic adjustment)

3/1/2013 Comp 4020 - HCI 2 (PPI) 29


TapTap

Occlusion
3
No occlusion problem:
Targets are large enough

3/1/2013 Comp 4020 - HCI 2 (PPI) 30


TapTap

Occlusion
3
Border accessibility

1st tap: No need to click 2nd tap: Targets are


in the border areas never in the border
areas

3/1/2013 Comp 4020 - HCI 2 (PPI) 31


TapTap
Occlusion
Border accessibility
3
Accuracy

Large targets in both


cases

3/1/2013 Comp 4020 - HCI 2 (PPI) 32


MagStick
4
Part of the stick
that controls the Magnetized cursor
cursor bends the stick
Reference
Point
Part of the
stick
controlled by
the thumb

3/1/2013 Comp 4020 - HCI 2 (PPI) 33


MagStick

Mirrored cursor movement


4
inspired by games design

Symmetric design
equal length of the stick

Magnetization effect
Semantic Pointing [Blanch 04]

3/1/2013 Comp 4020 - HCI 2 (PPI) 34


MagStick
Occlusion 4
The thumb moves away
from the target/ focus of
interest

3/1/2013 Comp 4020 - HCI 2 (PPI) 35


MagStick

Occlusion
Reference point
4
Border accessibility
Current point

Reference point and


current point are always in
the center

3/1/2013 Comp 4020 - HCI 2 (PPI) 36


MagStick

Occlusion
4
Border accessibility
Accuracy

Magnetization improves
accuracy

3/1/2013 Comp 4020 - HCI 2 (PPI) 37


Video
4

3/1/2013 Comp 4020 - HCI 2 (PPI) 38


Controlled study
Goal: Evaluate the accuracy and efficiency of technique
Participants : 12 (from 23 to 47)
Task
4
Select the red target as quickly and accurately as possible
Each participant selected 2 targets in the 8 zones (16 selections for
each techniques)
Only one try to select the target (otherwise considered as an error)

3/1/2013 Comp 4020 - HCI 2 (PPI) 39


Error rate
60.00%

50.00%
4
40.00%

30.00%

20.00%

10.00%

0.00%

-10.00%

Direct Touch Offset Cursor Shift Thumbspace TapTap MagStick

3/1/2013 Comp 4020 - HCI 2 (PPI) 40


Mean time
4000

3500
4
TapTap more than 2 times
3000
faster
MagStick more than 1.5
times faster
2500

2000

1500

1000

500

Direct Touch Offset Cursor Shift Thumbspace TapTap MagStick

3/1/2013 Comp 4020 - HCI 2 (PPI) 41


Mean time
4000

3500
4
3000

2500

2000

1500 2 taps of Direct Touch >


1000 the 2 taps of TapTap
500

Direct Touch Offset Cursor Shift Thumbspace TapTap MagStick

3/1/2013 Comp 4020 - HCI 2 (PPI) 42


Zones
(Grayed zones = less efficient)
4
Same
Occlusion of the Less efficient in
performance
thumb in these areas the center
everywhere

Direct Touch Offset Cursor Shift Thumbspace TapTap MagStick

3/1/2013 Comp 4020 - HCI 2 (PPI) 43


Summary

TapTap and MagStick


4
- Faster
- Lower error rate
- Efficient everywhere on the screen

TapTap is better than MagStick

Trails of MagStick the most


concentrated in the center

3/1/2013 Comp 4020 - HCI 2 (PPI)


MagStick trails 44
Dual-surface input
5

3/1/2013 Comp 4020 - HCI 2 (PPI) 45


Dual-surface model
Direct input
5
Move cursor with absolute input on front

Indirect input
Adjust with relative on back

Key point: coordinated

3/1/2013 Comp 4020 - HCI 2 (PPI) 46


Selection
5
18 pxs
27 pxs

3/1/2013 Comp 4020 - HCI 2 (PPI) 47


3/1/2013 Comp 4020 - HCI 2 (PPI) 48
Design principles
Ideally, we want to place targets in hot-spot
regions

Ensure users can reach most crucial targets in an


application by placing
objects in configurable corners
away from border

Consider an augmentation that provides some


form of cursor control !

3/1/2013 Comp 4020 - HCI 2 (PPI) 49


Solutions for one-hand use challenges
Design challenge:
Reflect on the myriad of challenges that come along with
one-hand use of mobile devices. Considering the issues of
reach apply the 10 plus 10 technique to brainstorm 10+10
novel ways to assist users with improved target acquisition and
interaction. Generate 10 very different design concepts.

Assumptions:
You can make any sort of assumption on the type (s) of sensory input you
wish to have your mobile device handle

3/1/2013 Comp 4020 - HCI 2 (PPI) 50