Agent skill · design visual · ehmo

watchos-design-guidelines

Apple Human Interface Guidelines for Apple Watch. Use when building watchOS apps, complications, or workout features. Triggers on tasks involving Watch UI, Digital Crown, glanceable interfaces, or wrist-based interactions.

Why this skill is useful

Provides specific design principles and guidelines for creating effective watchOS interfaces that the AI wouldn't reliably generate on its own.

What it needs

About 10k tokens when loaded. Last updated 2026-03-19. 481 stars on the source repository.

What this skill does

watchOS Design Guidelines Apple Watch is a personal, glanceable device worn on the wrist. Interactions are measured in seconds, not minutes. Every design decision must prioritize speed of comprehension and brevity of interaction. --- 1. Glanceable Design (CRITICAL) The defining constraint of watchOS. If a user cannot extract the key information within 2 seconds of raising their wrist, the design has failed. Rules W-GL-01: Primary information must be visible without scrolling. The first screen is the only guaranteed screen. W-GL-02: Target interaction sessions of 5 seconds or less. Design for raise-glance-lower. W-GL-03: Use large, high-contrast text. Minimum effective body text is 16pt (system font). Titles should be 18pt or larger. W-GL-04: Limit text to essential content. Truncate or abbreviate aggressively. Use SF Symbols instead of text labels where meaning is unambiguous. W-GL-05: Respect wrist-down time. When the wrist lowers, the app enters an inactive state. Do not assume continuous user attention. W-GL-06: Prioritize a single piece of information per screen. If showing multiple data points, establish clear visual hierarchy with size, weight, and color. Screen Dimensions Reference Device Screen Width Screen Height Corner Radius -------- ------------- --------------- --------------- 41mm (Series 9) 176px 215px 36px 45mm (Series 9) 198px 242px 39px 42mm (Series 10) 180px 220px 37px 46mm (Series 10) 205px 251px 40px 49mm (Ultra 2) 205px 251px 40px Anti-Patterns Walls of text requiring scroll to understand context Small, dense data tables Requiring multiple taps before showing useful information Replicating an iPhone screen layout on Watch --- 2. Digital Crown (HIGH) The Digital Crown is the primary physical input for scrolling and precise value selection. It provides haptic feedback and should feel purposeful. Rules W-DC-01: Use the Digital Crown as the primary scroll mechanism for vertical content. Do not rely solely on swipe gestures for scrolling. …

How to use it

Reference it in AdaL, Claude Code, Cursor or any coding agent — nothing to install:

@skills ehmo/watchos

View the source on GitHub

Browse the @skills marketplace