Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Designing for the Watch

Avatar for Ana Bangueses Ana Bangueses
December 13, 2014
Design
4
310

Designing for the Watch

Avatar for Ana Bangueses

Ana Bangueses

December 13, 2014
Tweet

Other Decks in Design

See All in Design
新規AIプロダクトで、事前に知るべきだった3つの壁 〜医療AIを1年間作って、従来の開発が通用しなかった話〜 / Three Walls in Building AI Products
Avatar for Takuya Shikichi shikichee
2
3.3k
「稼ぐ」だけでなく 「還す」ためのデザイン / Designship2025
Avatar for インクルーシブデザインスタジオCULUMU culumu
1
570
AIスライドデザインを生成する仕組みを社内共有する
Avatar for 太田賢一 kenichiota0711
5
4.2k
kintone Style Book
Avatar for kintone kintone
6
10k
maki setoguchi
Avatar for Maki / Web Designer maki_setoguchi
0
660
第18回サイゼミ
Avatar for LW lw
1
3.3k
AIでデザインをつくる：基礎編
Avatar for 太田賢一 kenichiota0711
3
2.5k
【サイバーエージェント】Creative Switch 会社説明資料
Avatar for 【CyberAgent】クリエイター新卒採用 cyberagent_creators
0
5.1k
プラットフォームに馴染むモバイルアプリデザイン / Mobile App UI Design Lunch LT
Avatar for Hiroki Nagasawa pixyzehn
0
130
2026の目標「もっと定量的に事業、会社へ貢献する！」
Avatar for yuri ohashi yuri_ohashi
0
680
結びながら、ひらく - にじむ境界のデザイン
Avatar for Hiroki Tani hilokifigma
3
1.3k
アクセシビリティ推進を続けられるようにするヒント - Accessibility Conference CHIBA 2025
Avatar for uto usui uto
0
180

Featured

See All Featured
Docker and Python
Avatar for Tania Allard trallard
47
3.7k
How People are Using Generative and Agentic AI to Supercharge Their Products, Projects, Services and Value Streams Today
Avatar for Helen Beal helenjbeal
1
130
職位にかかわらず全員がリーダーシップを発揮するチーム作り / Building a team where everyone can demonstrate leadership regardless of position
Avatar for MADOX madoxten
57
50k
Crafting Experiences
Avatar for Bethany Jepchumba bethany
1
49
Winning Ecommerce Organic Search in an AI Era - #searchnstuff2025
Avatar for Aleyda Solis aleyda
1
1.9k
How to Align SEO within the Product Triangle To Get 
Buy-In & Support - #RIMC
Avatar for Aleyda Solis aleyda
1
1.4k
Fight the Zombie Pattern Library - RWD Summit 2016
Avatar for Marcelo Somers marcelosomers
234
17k
Building Better People: How to give real-time feedback that sticks.
Avatar for Will Jessup wjessup
370
20k
Statistics for Hackers
Avatar for Jake VanderPlas jakevdp
799
230k
Speed Design
Avatar for Sergey Chernyshev sergeychernyshev
33
1.5k
Optimising Largest Contentful Paint
Avatar for Harry Roberts csswizardry
37
3.6k
Designing for Performance
Avatar for Lara Hogan lara
610
70k

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!