Designing for the Watch

Transcript

1. Designing for the Watch @anabangueses
2. Personal Holistic Lightweight
3. ‘ “
4. Basics
5. Screen sizes 38 mm Watch 42 mm Watch 340 px 390 px 272 px 312 px
6. Color Background color App’s key color Contrast
7. Typography San Francisco
8. Heart rate sensor Wifi and GPS Accelerometer Sensors & Location
9. Interaction with the Watch
10. Buttons Digital Crown Scroll Zoom Home button Siri Quick access to friends
11. Screen Vertical swipe Horizontal swipe Tap Force touch Swipe from left edge
12. Vertical swipe Horizontal swipe Tap Force touch Swipe from left edge Screen
13. Vertical swipe Horizontal swipe Tap Force touch Swipe from left edge Screen
14. Vertical swipe Horizontal swipe Tap Force touch Swipe from left edge Screen
15. Vertical swipe Horizontal swipe Tap Force touch Swipe from left edge Screen
16. What can we design for the Watch?
17. Glances
18. Glances
19. ✱ Avoid irrelevant information ✱ Do not use it to facilitate the launching of your app Glances
20. Notifications
21. Short look Notifications
22. Long look Notifications
23. ✱ Don’t annoy the user with too many notifications ✱ Focused and short title ✱ Add buttons for immediate actions Notifications
24. Full apps
25. Full apps Hierarchical structure Tap Tap
26. Full apps Page based Swipe Swipe
27. UI Elements
28. Labels
29. Images
30. Groups Horizontal Vertical Nested
31. Tables
32. Buttons
33. Switches
34. Sliders
35. Text input
36. Modal
37. Maps
38. Icon and Image Design
39. Icons
40. Menu images
41. @anabangueses Thanks!