/ Directory / Playground / Apple-Hig-Designer
● Community axiaoge2 ⚡ Instant

Apple-Hig-Designer

by axiaoge2 · axiaoge2/Apple-Hig-Designer

Design screens that actually follow Apple's Human Interface Guidelines — Claude checks your layout, typography, and interactions against HIG.

Apple-Hig-Designer is an Agent Skill that loads Apple's HIG into Claude's working memory for design tasks: producing SwiftUI/UIKit mockups, critiquing existing layouts, picking the right system components, and following the platform's typography, spacing, and color tokens. Works whether you're sketching a new iPhone app or auditing an existing one.

Why use it

Key features

Live Demo

What it looks like in practice

apple-hig-designer-skill.replay ▶ ready
0/0

Install

Author repository · Claude Skills documentation

Use Cases

Real-world ways to use Apple-Hig-Designer

How to sketch an iOS screen that follows HIG

👤 iOS developers and designers on cross-functional teams ⏱ ~25 min intermediate

When to use: You need a first-pass layout for a new screen and don't want to re-learn HIG from scratch.

Flow
  1. Describe the screen
    Sketch a Settings > Notifications screen for iPhone — standard iOS 18 patterns.✓ Copied
    → Grouped List, right-detail rows, correct section headers — HIG citations inline
  2. Produce the SwiftUI
    Generate the SwiftUI code using Form/List and system colors.✓ Copied
    → Idiomatic SwiftUI with .listStyle(.insetGrouped), Toggle, NavigationLink
  3. Check dark mode
    Adapt for dark mode — confirm you're using .primary / .secondary, not hardcoded hex.✓ Copied
    → Semantic-color confirmation

Outcome: A screen that feels native on the first preview and won't get rejected in review.

Pitfalls
  • Custom styling that fights the system — Ask Claude 'what's the standard HIG way?' before any custom styling
Combine with: ios-simulator-skill

Audit an existing screen against HIG

👤 Design reviewers and tech leads ⏱ ~20 min beginner

When to use: Before shipping, you want a second opinion on HIG compliance.

Flow
  1. Share a screenshot or code
    Here's a screenshot of our Profile screen. Flag HIG deviations.✓ Copied
    → Specific callouts with HIG references
  2. Prioritize
    Rank the findings by impact — what would a reviewer actually care about?✓ Copied
    → Ranked list, not flat dump
  3. Suggest fixes
    For the top 3, show me concrete SwiftUI changes.✓ Copied
    → Code diffs

Outcome: A focused fix list that matters, not nits.

Pitfalls
  • Audit is too nitpicky — 1px spacing issues — Ask for impact-weighted findings only
Combine with: filesystem

Decide between iOS, iPadOS, and macOS patterns for a shared app

👤 Teams building a multi-platform SwiftUI app ⏱ ~30 min advanced

When to use: Same feature needs different treatment on phone vs iPad vs Mac.

Flow
  1. State the feature
    We have a Library feature. What's the right navigation shape per platform?✓ Copied
    → Tab bar / Sidebar / NavigationSplitView mapped to platforms with reasoning
  2. Pick primitives
    Which SwiftUI primitives should we use per platform to avoid hacks?✓ Copied
    → Platform-specific primitive choices

Outcome: A design split that matches HIG per platform and is cheap to implement.

Pitfalls
  • iPad as 'big iPhone' — misses pointer and multi-column patterns — Ask Claude to enumerate iPadOS-specific affordances before copying iPhone UX

Combinations

Pair with other MCPs for X10 leverage

apple-hig-designer-skill + ios-simulator-skill

Render the generated SwiftUI and inspect it in the simulator

Render this SwiftUI in the iPhone 16 simulator and confirm it matches the HIG brief.✓ Copied
apple-hig-designer-skill + filesystem

Apply the suggested patches across the app's codebase

Apply the audit fixes to Views/Profile/.✓ Copied

Tools

What this MCP exposes

ToolInputsWhen to callCost
hig-layout-design screen intent + platform New screens or features 0
hig-audit screenshot or SwiftUI code Pre-ship review 0
swiftui-snippet pattern name Implementation step 0

Cost & Limits

What this costs to run

API quota
none
Tokens per call
3–8k tokens per screen
Monetary
free
Tip
Scope to one screen at a time; HIG is long — don't bait Claude into citing the whole thing

Security

Permissions, secrets, blast radius

Credential storage: none
Data egress: none

Troubleshooting

Common errors and fixes

Suggestions feel dated

Tell Claude the iOS version you're targeting; HIG differs across releases.

SwiftUI uses deprecated modifiers

Specify the minimum iOS version explicitly.

Alternatives

Apple-Hig-Designer vs others

AlternativeWhen to use it insteadTradeoff
the-unofficial-swift-programming-language-skillYou need language-level help, not HIG designLanguage, not UX
cupertinoYou want an MCP connected to live Apple docsLive MCP vs cached skill

More

Resources

📖 Read the official README on GitHub

🐙 Browse open issues

🔍 Browse all 400+ MCP servers and Skills

Continue exploring

Related tools and workflows

Choose another guide for your workflow, or explore a collection.

Explore more Skills

Contentful Skills

Use Contentful’s official guidance for API selection, Next.js integration, content migrations, custom apps, and personalization.

Skill

Explore more Skills

SigNoz Agent Skills

Use SigNoz’s agent skills for documentation search, ClickHouse queries, telemetry analysis, and observability workflows.

Skill

Explore more Skills

LangChain Skills

Build agents with LangChain, LangGraph, and Deep Agents using the framework publisher’s setup, architecture, persistence, RAG, and evaluation guidance.

Skill

Explore more Skills

Dodo Payments Agent Plugin

Combine Dodo Payments integration skills with its API and documentation MCP connectors.

Skill

Browse all topic collections → · See 29 new official additions →