1 How People Really Hold & Touch (their
2 What do we know?
3 iPhone is sized for one hand
4 What do we know? iPhone is sized for one hand The width of fingers varies
5 What do we know? iPhone is sized for one hand The width of fingers varies 44 points is the ideal target size
6 What do we know? iPhone is sized for one hand The width of fingers varies 44 points is the ideal target size
7
8
9
10
11
12 Visual targets Touch targets Interference
13 Visual targets must: Attract the user's eye. Look like actionable elements. Afford the specific action. Be trustworthy.
14
15
16 (3438)(l ) Visual Angle (minutes of arc) = (3438)(length of the object perpendicular to the line of sight)/distance from the front of the eye to the object d = V
inch Phone 3.5–5-inch Phone 9–10-inch Tablet Text 4 pt 1.4 mm 6 pt 2.1 mm 8 pt 2.8 mm Icons F 6 pt 2.1 mm 8 pt 2.8 mm 10 pt 3.5 mm Minimum Visual Targets:
18 Capacitive Touch Screen
19 Proximity Accelerometer Gryosensor Light color Gesture Cover sensor Light level Capacitive Touch Screen
20
21
22 44 points
23 44 points
24 (1 pt = 1/72”)
25
26 Centroid?
27 Touch Targets: Minimum 17 pt / 6 mm Preferred 23 pt / 8 mm Maximum 43 pt / 15 mm
28 Interference: Measured on center Minimum 23 pt / 8 mm Preferred 28 pt / 10 mm
29
30
31
inch Phone 3.5–5-inch Phone 9–10-inch Tablet Text4 pt / 1.4 mm6 pt / 2.1 mm8 pt / 2.8 mm Icons F 6 pt / 2.1 mm8 pt / 2.8 mm10 pt / 3.5 mm Minimum Visual Targets: Minimum17 pt / 6mm Preferred23 pt / 8 mm Maximum 43 pt / 15 mm Touch Targets: Minimum23 pt / 8 mm Preferred 28 pt / 10 mm Interference: Measured on center
33 Tablets?
34
35
36
37
38
39
40
41 Design for Touch Follow IA, information, hierarchies Ergonomically feasible Don’t obscure information Consistency Platform conventions
42 Contact me for consulting, design, to follow up on this deck, or just to talk: Steven Hoober shoobe01 on: