/ Diretório / Playground / Apple-Hig-Designer
← Todos os servidores ↗ GitHub
● Comunidade axiaoge2 ⚡ Instantâneo

Apple-Hig-Designer

por 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.

▶ Ver demo 📦 Instalar 💡 Casos de uso

Por que usar

Principais recursos

Demo ao vivo

Como fica na prática

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

Instalação

Repositório do autor · Documentação oficial de Skills do Claude

Casos de uso

Usos do mundo real: Apple-Hig-Designer

How to sketch an iOS screen that follows HIG

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

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

Fluxo
  1. Describe the screen
    Sketch a Settings > Notifications screen for iPhone — standard iOS 18 patterns.✓ Copiado
    → 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.✓ Copiado
    → Idiomatic SwiftUI with .listStyle(.insetGrouped), Toggle, NavigationLink
  3. Check dark mode
    Adapt for dark mode — confirm you're using .primary / .secondary, not hardcoded hex.✓ Copiado
    → Semantic-color confirmation

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

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

Audit an existing screen against HIG

👤 Design reviewers and tech leads ⏱ ~20 min beginner

Quando usar: Before shipping, you want a second opinion on HIG compliance.

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

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

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

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

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

Quando usar: Same feature needs different treatment on phone vs iPad vs Mac.

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

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

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

Combinações

Combine com outros MCPs para 10× de alavancagem

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.✓ Copiado
apple-hig-designer-skill + filesystem

Apply the suggested patches across the app's codebase

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

Ferramentas

O que este MCP expõe

FerramentaEntradasQuando chamarCusto
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

Custo e limites

O que custa rodar

Cota de API
none
Tokens por chamada
3–8k tokens per screen
Monetário
free
Dica
Scope to one screen at a time; HIG is long — don't bait Claude into citing the whole thing

Segurança

Permissões, segredos, alcance

Armazenamento de credenciais: none
Saída de dados: none

Solução de problemas

Erros comuns e correções

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.

Alternativas

Apple-Hig-Designer vs. outros

AlternativaQuando usarTroca
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

Mais

Recursos

📖 Leia o README oficial no GitHub

🐙 Ver issues abertas

🔍 Ver todos os 400+ servidores MCP e Skills