ThePresentation^ru

Design for Fingers, Touch and PeopleHow people really hold and touch their mobile devices презентация

Содержание

1. Design for Fingers, Touch and PeopleHow people really hold and touch their mobile devices
2. We are outnumbered. OPTIONAL
3. More mobiles than computers. OPTIONAL
4. 80% growth in 2013. OPTIONAL
5. Users prefer mobile. OPTIONAL
6. Design for mobile. OPTIONAL
8. What we used to know: What we used to know: 44 px
9. But now we know for real.
11. 1,333 19 120,626,225 651
13. Touch is not about Finger size Reach No-go corners Pinpoint accuracy
14. @shoobe01 #ConveyUX @shoobe01 #mLearnCon
17. 62% 24% 9%
21. (3438)(l) d = V
22. 6 pt 8 pt
23. Make your targets work.
24. Attract the eye Afford action Readable The right size
26. Touch
29. CEP R95
31. Avoid the edges.
34. Design by zones.
36. Fingers Fingers get in the way.
39. Don’t obscure your information or functions.
40. Work at scale.
42. Check at scale.
46. 10 design guidelines for fingers, touch and people
47. 1 Your users are not like you. 49% 36%
48. 2 Move content and controls toward the middle.
49. 4 Don’t obscure information
50. 3 Make room for scrolling.
51. 5 Account for distance by adjusting size.
52. 6 Whole rows, larger touch targets.
53. 6 Whole rows, larger touch targets.
54. 7 Design by zones.
55. 8 Make taps affordable.
56. 9 Respect edges and bezels
57. 10 Design, test and demo at scale.
58. Steven Hoober steven@4ourth.com +1 816 210 0455 @shoobe01 shoobe01: www.4ourth.com
60. 4ourth.com/tppt 4ourth.com/tvid
61. Read more on design for touch, mobile and people: 4ourth.com/wrtg
62. Appendix: Touch technology, additonal data, and other stuff
63. 26% Orientation: 60% Landscape, 40% portrait, but…
69. Capacitive Touch Screen
70. Proximity Accelerometer Gryosensor Light color Gesture Cover sensor Light level Capacitive Touch Screen
72. Programming Touch Events
74. Contact me for consulting, design, to follow

We are outnumbered. OPTIONAL

Главная
Разное
Design for Fingers, Touch and PeopleHow people really hold and touch their mobile devices

Слайд 1Design for Fingers, Touch and People How people really hold and touch

their mobile devices

@shoobe01 #mLearnCon

?? MINUTES To read entire deck word for word.

TIMING/VIDEO
Remove auto-advancing after creating a video version:

Workaround:
In the menu bar: “Slide Show” > “Set Up Show…”
In the “Advance slides” section select “Manually”

Clear the timings completely:
Select all the slides
Right click a slide > “Slide Transition…”
In the “Advance slide” section uncheck “Automatically after”

Слайд 2We are outnumbered.
OPTIONAL

Слайд 3More mobiles than computers.
OPTIONAL

Слайд 480% growth in 2013.
OPTIONAL

Слайд 5Users prefer mobile.
OPTIONAL

Слайд 6Design for mobile.
OPTIONAL

Слайд 7

Слайд 8What we used to know:
What we used to know:
44 px

Слайд 9But now we know for real.

Слайд 10

Слайд 111,333
19
120,626,225
651

Слайд 12

Слайд 13Touch is not about
Finger size
Reach
No-go corners
Pinpoint accuracy

Слайд 14@shoobe01
#ConveyUX
@shoobe01
#mLearnCon

Слайд 15

Слайд 16

Слайд 1762%
24%
9%

Слайд 18

Слайд 19

Слайд 20

Слайд 21(3438)(l)
d
=
V

Слайд 226 pt
8 pt

Слайд 23Make your targets work.

Слайд 24Attract the eye
Afford action
Readable
The right size

Слайд 25

Слайд 26Touch

Слайд 27

Слайд 28

Слайд 29
CEP R95

Слайд 30

Слайд 31Avoid the edges.

Слайд 32

Слайд 33

Слайд 34Design by zones.

Слайд 35

Слайд 36Fingers
Fingers
get in the way.

Слайд 37

Слайд 38

Слайд 39Don’t obscure your
information or functions.

Слайд 40Work at scale.

Слайд 41

Слайд 42Check at scale.

Слайд 43

Слайд 44

Слайд 45

Слайд 46

10 design guidelines for fingers,
touch and people

Слайд 471 Your users are not like you.
49%
36%

Слайд 482 Move content and controls toward the middle.

Слайд 494 Don’t obscure
information

Слайд 503 Make room for scrolling.

Слайд 515 Account for distance by adjusting size.

Слайд 526 Whole rows, larger touch targets.

Слайд 536 Whole rows, larger touch targets.

Слайд 547 Design
by zones.

Слайд 558 Make taps affordable.

Слайд 56
9 Respect edges
and bezels

Слайд 5710 Design, test and
demo at scale.

Слайд 58Steven Hoober
steven@4ourth.com
+1 816 210 0455
@shoobe01
shoobe01:
www.4ourth.com

Слайд 59

Слайд 604ourth.com/tppt
4ourth.com/tvid

Слайд 61Read more on design for touch, mobile and people:

4ourth.com/wrtg

Слайд 62Appendix:

Touch technology, additonal data, and other stuff

Слайд 6326%
Orientation: 60% Landscape, 40% portrait, but… which device did you mean?
84%

touch with the right hand.
Age, sex, region? No perceptible changes but…

Слайд 64

Слайд 65

Слайд 66

Слайд 67

Слайд 68

Слайд 69Capacitive Touch Screen

Слайд 70Proximity
Accelerometer
Gryosensor
Light color
Gesture
Cover sensor
Light level
Capacitive Touch Screen

Слайд 71

Слайд 72Programming Touch Events

Слайд 73

Слайд 74Contact me for consulting, design, to follow up on this deck,

or just to talk:
Steven Hoober
steven@4ourth.com
+1 816 210 0455
@shoobe01
shoobe01 on:
www.4ourth.com

@shoobe01
#mLearnCon

Скачать презентацию

Обратная связь

Если не удалось найти и скачать презентацию, Вы можете заказать его на нашем сайте. Мы постараемся найти нужный Вам материал и отправим по электронной почте. Не стесняйтесь обращаться к нам, если у вас возникли вопросы или пожелания:

Email: Нажмите что бы посмотреть

Что такое ThePresentation.ru?

Это сайт презентаций, докладов, проектов, шаблонов в формате PowerPoint. Мы помогаем школьникам, студентам, учителям, преподавателям хранить и обмениваться учебными материалами с другими пользователями.

Для правообладателей