Platform Design Skills

13hrs agorelease 8 0 0
Collect 0

450+ platform-specific UI/UX design rules distilling Apple HIG, Material Design 3, and WCAG 2.2 for AI coding agents.

Country:
Global
Added On:
2026-09-23
Open siteMobile view
Platform Design SkillsPlatform Design Skills
Platform Design SkillsOpen site

What is Platform Design Skills?

Platform Design Skills is an exhaustive rule pack containing 450+ platform-specific UI/UX engineering guidelines curated for AI coding assistants. By systematically scraping and distilling the official Apple Human Interface Guidelines (HIG), Google’s Material Design 3, and the W3C WCAG 2.2 accessibility standards, this pack transforms AI agents into design-system experts. Whether prompting Claude Code to build a native macOS menu bar or asking Cursor to optimize an Android Jetpack Compose layout, Platform Design Skills enforces native idioms, platform conventions, and strict accessibility guardrails.

Platform Coverage & Design Rule Packs

  • iOS & iPadOS: 67+ rules covering SwiftUI/UIKit navigation patterns, tab bars, sheets, Dynamic Island integration, Stage Manager, Split View, and pointer support.
  • macOS: Rules for native menu bars, window management, toolbar hierarchies, keyboard shortcuts, and power-user desktop affordances.
  • watchOS & visionOS: Specialized spatial UI conventions, eye/hand tracking ornaments, RealityKit spaces, Digital Crown navigation, and glanceable complications.
  • tvOS: Focus-engine navigation, Siri Remote gestures, Top Shelf integration, and 10-foot viewing distance constraints.
  • Android (Material Design 3): Material You dynamic color tokenization, predictive back gestures, bottom app bars, and responsive window size classes.
  • Web & WCAG 2.2: Contrast ratios, keyboard focus rings, touch target minimums (44×44pt / 48×48dp), screen-reader semantics, and ARIA patterns.

How to Install & Apply in Coding Agents

Add the platform design pack to your project using the skills CLI:

# Install all platform design skills
npx skills add ehmo/platform-design-skills

# Install a specific platform skill (e.g. iOS)
npx skills add ehmo/platform-design-skills --skill ios

Invoke specific platform checks during agent pairing:

# Example Agent Prompts
"Review my SwiftUI navigation stack against the Apple HIG iOS rules."
"Refactor this Android Compose screen to follow Material Design 3 dynamic color tokens."
"Audit this Web component for WCAG 2.2 touch target and contrast compliance."
"Design a native macOS preferences window with toolbar tabs in SwiftUI."

Technical Specifications

Design Standards Apple HIG, Google Material Design 3, W3C WCAG 2.2
Rule Count 450+ distilled actionable engineering rules
Supported Platforms iOS, iPadOS, macOS, watchOS, visionOS, tvOS, Android, Web
Format Agent Skills Markdown (SKILL.md)
Compatible Tools Claude Code, Cursor, Windsurf, Codex, Antigravity
Official Repository github.com/ehmo/platform-design-skills

Frequently Asked Questions

How does this differ from generic LLM design advice?

Standard LLMs frequently blend web habits into mobile code (e.g., using non-standard web hamburgers on iOS). Platform Design Skills provides explicit, verified constraint rules directly extracted from Apple and Google specification documents.

Does the pack include Vision Pro (visionOS) guidelines?

Yes. The visionos skill contains dedicated rules for window depth, volume placement, ornament positioning, and eye-tracking target sizes.

Can I use this for automated PR design reviews?

Yes. When mounted in CI agent workflows, the skills can inspect incoming pull request diffs and flag accessibility violations or unidiomatic navigation patterns.

Is there an offline reference included?

Yes, the repository includes a compiled reference PDF of the Apple Human Interface Guidelines for offline review.

data statistics

Relevant Navigation

No comments

none
No comments...