Apple hig expert
Audits and designs iOS/macOS/watchOS/visionOS interfaces against the Apple Human Interface Guidelines, including the Liquid Glass design language (announced WWDC25, shipped with iOS 26/macOS Tahoe, Sept 2025).
How to use it
Claude Code
- Run the line below. It pulls the whole folder into
~/.claude/skills/apple-hig-expert, including the files SKILL.md points to. - Describe your job in plain words. Claude Code follows the skill from there.
npx degit alirezarezvani/claude-skills/product-team/apple-hig-expert/skills/apple-hig-expert#main ~/.claude/skills/apple-hig-expertFor one project only, change the path to .claude/skills/apple-hig-expert. This skill also uses product-context.md, ios-design-context.md, audit.json — copying SKILL.md alone won't be enough. See the folder on GitHub.
Claude (web or desktop app)
- On this page open ⋯ → Download .md.
- Save it as SKILL.md in a folder, zip the folder, then Customize → Skills → + → Create skill → Upload a skill.
- Pick the file and Save. Claude shows the name and description and runs a security scan.
- Check the skill is switched on.
- Start a new chat and describe your job in plain words. The AI follows the skill from there.
ChatGPT or another app
- ChatGPT: make a Project and paste it into Instructions.
- Neither? Paste it at the top of a new chat — it works for that chat.
Not working?
- Check which app you pasted it into — the steps above name the right one.
- Some skills need the paid tier of Claude or ChatGPT.
Paste into Claude, ChatGPT or Cursor.
Source of Apple hig expert
Show the full text109 lines
| name | description | license | metadata |
|---|---|---|---|
| apple-hig-expert | Audits and designs iOS/macOS/watchOS/visionOS interfaces against the Apple Human Interface Guidelines, including the Liquid Glass design language (announced WWDC25, shipped with iOS 26/macOS Tahoe, Sept 2025). Use when reviewing an Apple-platform mockup or app for HIG compliance, checking contrast or tap-target sizes, or designing native-feeling Apple UI (e.g., 'audit my iOS app against the HIG', 'is this text readable on Liquid Glass?'). | MIT | version: 1.1.0 author: Alireza Rezvani category: design updated: 2026-06-11 |
Apple HIG Expert
Design and audit apps against the Apple Human Interface Guidelines (HIG, developer.apple.com/design/human-interface-guidelines), including the Liquid Glass design language. HIG content evolves with each OS release — when a claim matters, verify against the live HIG pages cited in references/.
Before Starting
If product-context.md or ios-design-context.md exists, read it before asking questions. Then gather:
- Platform target: iOS, macOS, watchOS, or visionOS?
- Current state: new design or auditing an existing mockup/code?
- App category: utility, productivity, game, social, etc.
Modes
- Mode 1 — Design from scratch: pick the platform navigation paradigm and layout primitives first (see
references/platform-specifics.md), then apply typography and semantic color (references/visual-design.md). - Mode 2 — HIG audit: fill in
templates/hig-audit-template.md, runscripts/hig_checker.pyon every measurable element, and deliver a scored report (see Worked example below).
The Compliance Tool
scripts/hig_checker.py (stdlib-only) has three subcommands:
# 1. Contrast ratio (WCAG formula; pass >= 4.5:1 for normal text)
python3 scripts/hig_checker.py contrast "#8E8E93" "#FFFFFF"
# -> Contrast Ratio: 3.26 [FAILED]
# 2. Tap-target size (pass >= 44x44 pt per HIG)
python3 scripts/hig_checker.py target 32 32
# -> Tap Target: 32x32 [FAILED]
# 3. Batch audit from JSON -> scorecard (starts at 100, -10 per violation)
python3 scripts/hig_checker.py batch audit.json
Batch input shape:
{
"checks": [
{"type": "contrast", "name": "caption-on-card", "fg": "#8E8E93", "bg": "#FFFFFF"},
{"type": "target", "name": "close-button", "w": 32, "h": 32}
]
}
Scorecard rubric: the batch score starts at 100 and subtracts 10 per failed check; violations are listed by element name. 90-100 = ship, 70-80 = fix before release, below 70 = systematic rework. Checks the tool cannot measure (VoiceOver labels, Dynamic Type behavior, Reduce Transparency) are assessed manually via the audit template and tagged with confidence.
Worked example: iOS settings-screen audit
Input: mockup with body text #1C1C1E and captions #8E8E93 on white cards, a 32x32 pt close button, and a 343x50 pt primary CTA.
Run:
python3 scripts/hig_checker.py batch audit.json
Output (real):
{
"score": 80,
"violations": [
"Contrast 3.26 fails for caption-on-card",
"Target 32x32 small for close-button"
]
}
Findings → fixes (bottom line first):
HIG score 80/100 — two fixes before release.
- Captions fail contrast (3.26 < 4.5). Use
.secondaryLabel(semantic color) instead of hardcoded#8E8E93, or darken to ≥#6E6E73on white. 🟢 verified by tool.- Close button is 32x32 pt (< 44x44 minimum). Keep the glyph small but expand the hit region to 44x44 with padding/
contentShape. 🟢 verified by tool.- Manual check: the card uses an ultra-thin material over a photo background — re-test caption contrast against the busiest underlying region and with Reduce Transparency on. 🟡 needs device test.
Core Design Principles
- Liquid Glass — translucent material hierarchy (announced at WWDC25, June 2025; shipped Sept 2025 across iOS 26, iPadOS 26, macOS Tahoe, watchOS 26, tvOS 26, visionOS 26). In SwiftUI, apply it via the
glassEffectview modifier; keep hierarchy between content and controls. Seereferences/visual-design.md. - Accessibility first — VoiceOver labels on every element, 44x44 pt minimum targets, 4.5:1 contrast for normal text (3:1 large text), Dynamic Type support. See
references/accessibility.md. - Platform ergonomics — tab bars/thumb reach on iOS, sidebars + menu bar + shortcuts on macOS, ornaments + gaze states on visionOS, glanceable vertical layouts on watchOS. See
references/platform-specifics.md.
Proactive Triggers
Surface these WITHOUT being asked: low contrast over translucent layers; interactive elements under 44 pt; icon buttons with no accessibility label; density overload (no breathing room between glass layers).
Communication
- Bottom line first — compliance status before details.
- What + Why + How — "Expand the hit region (What) because 32 pt targets fail the HIG minimum (Why); pad to 44x44 via contentShape (How)."
- Confidence tagging — 🟢 tool-verified / 🟡 needs device test / 🔴 assumed.
Related Skills
- ui-design-system: token-based component systems (not platform HIG rules).
- ux-researcher-designer: persona/research validation (not visual styling).
- landing-page-generator: web marketing pages, not native apps.
| 1 | |
| 2 | name apple-hig-expert |
| 3 | description "Audits and designs iOS/macOS/watchOS/visionOS interfaces against the Apple Human Interface Guidelines, including the Liquid Glass design language (announced WWDC25, shipped with iOS 26/macOS Tahoe, Sept 2025). Use when reviewing an Apple-platform mockup or app for HIG compliance, checking contrast or tap-target sizes, or designing native-feeling Apple UI (e.g., 'audit my iOS app against the HIG', 'is this text readable on Liquid Glass?')." |
| 4 | license MIT |
| 5 | metadata |
| 6 | version 1.1.0 |
| 7 | author Alireza Rezvani |
| 8 | category design |
| 9 | updated 2026-06-11 |
| 10 | |
| 11 | |
| 12 | # Apple HIG Expert |
| 13 | |
| 14 | Design and audit apps against the Apple Human Interface Guidelines (HIG, [developer.apple.com/design/human-interface-guidelines]), including the **Liquid Glass** design language. HIG content evolves with each OS release — when a claim matters, verify against the live HIG pages cited in `references/`. |
| 15 | |
| 16 | ## Before Starting |
| 17 | |
| 18 | If `product-context.md` or `ios-design-context.md` exists, read it before asking questions. Then gather: |
| 19 | |
| 20 | **Platform target**: iOS, macOS, watchOS, or visionOS? |
| 21 | **Current state**: new design or auditing an existing mockup/code? |
| 22 | **App category**: utility, productivity, game, social, etc. |
| 23 | |
| 24 | ## Modes |
| 25 | |
| 26 | **Mode 1 — Design from scratch**: pick the platform navigation paradigm and layout primitives first (see `references/platform-specifics.md`), then apply typography and semantic color (`references/visual-design.md`). |
| 27 | **Mode 2 — HIG audit**: fill in `templates/hig-audit-template.md`, run `scripts/hig_checker.py` on every measurable element, and deliver a scored report (see Worked example below). |
| 28 | |
| 29 | ## The Compliance Tool |
| 30 | |
| 31 | `scripts/hig_checker.py` (stdlib-only) has three subcommands: |
| 32 | |
| 33 | |
| 34 | # 1. Contrast ratio (WCAG formula; pass >= 4.5:1 for normal text) |
| 35 | python3 scripts/hig_checker.py contrast "#8E8E93" "#FFFFFF" |
| 36 | # -> Contrast Ratio: 3.26 [FAILED] |
| 37 | |
| 38 | # 2. Tap-target size (pass >= 44x44 pt per HIG) |
| 39 | python3 scripts/hig_checker.py target 32 32 |
| 40 | # -> Tap Target: 32x32 [FAILED] |
| 41 | |
| 42 | # 3. Batch audit from JSON -> scorecard (starts at 100, -10 per violation) |
| 43 | python3 scripts/hig_checker.py batch audit.json |
| 44 | |
| 45 | |
| 46 | Batch input shape: |
| 47 | |
| 48 | |
| 49 | { |
| 50 | "checks": [ |
| 51 | {"type": "contrast", "name": "caption-on-card", "fg": "#8E8E93", "bg": "#FFFFFF"}, |
| 52 | {"type": "target", "name": "close-button", "w": 32, "h": 32} |
| 53 | ] |
| 54 | } |
| 55 | |
| 56 | |
| 57 | **Scorecard rubric:** the batch score starts at 100 and subtracts 10 per failed check; violations are listed by element name. 90-100 = ship, 70-80 = fix before release, below 70 = systematic rework. Checks the tool cannot measure (VoiceOver labels, Dynamic Type behavior, Reduce Transparency) are assessed manually via the audit template and tagged with confidence. |
| 58 | |
| 59 | ## Worked example: iOS settings-screen audit |
| 60 | |
| 61 | **Input:** mockup with body text `#1C1C1E` and captions `#8E8E93` on white cards, a 32x32 pt close button, and a 343x50 pt primary CTA. |
| 62 | |
| 63 | **Run:** |
| 64 | |
| 65 | |
| 66 | python3 scripts/hig_checker.py batch audit.json |
| 67 | |
| 68 | |
| 69 | **Output (real):** |
| 70 | |
| 71 | |
| 72 | { |
| 73 | "score": 80, |
| 74 | "violations": [ |
| 75 | "Contrast 3.26 fails for caption-on-card", |
| 76 | "Target 32x32 small for close-button" |
| 77 | ] |
| 78 | } |
| 79 | |
| 80 | |
| 81 | **Findings → fixes (bottom line first):** |
| 82 | |
| 83 | > **HIG score 80/100 — two fixes before release.** |
| 84 | > 1. Captions fail contrast (3.26 < 4.5). Use `.secondaryLabel` (semantic color) instead of hardcoded `#8E8E93`, or darken to ≥ `#6E6E73` on white. 🟢 verified by tool. |
| 85 | > 2. Close button is 32x32 pt (< 44x44 minimum). Keep the glyph small but expand the hit region to 44x44 with padding/`contentShape`. 🟢 verified by tool. |
| 86 | > 3. Manual check: the card uses an ultra-thin material over a photo background — re-test caption contrast against the *busiest* underlying region and with Reduce Transparency on. 🟡 needs device test. |
| 87 | |
| 88 | ## Core Design Principles |
| 89 | |
| 90 | **Liquid Glass** — translucent material hierarchy (announced at WWDC25, June 2025; shipped Sept 2025 across iOS 26, iPadOS 26, macOS Tahoe, watchOS 26, tvOS 26, visionOS 26). In SwiftUI, apply it via the `glassEffect` view modifier; keep hierarchy between content and controls. See `references/visual-design.md`. |
| 91 | **Accessibility first** — VoiceOver labels on every element, 44x44 pt minimum targets, 4.5:1 contrast for normal text (3:1 large text), Dynamic Type support. See `references/accessibility.md`. |
| 92 | **Platform ergonomics** — tab bars/thumb reach on iOS, sidebars + menu bar + shortcuts on macOS, ornaments + gaze states on visionOS, glanceable vertical layouts on watchOS. See `references/platform-specifics.md`. |
| 93 | |
| 94 | ## Proactive Triggers |
| 95 | |
| 96 | Surface these WITHOUT being asked: low contrast over translucent layers; interactive elements under 44 pt; icon buttons with no accessibility label; density overload (no breathing room between glass layers). |
| 97 | |
| 98 | ## Communication |
| 99 | |
| 100 | **Bottom line first** — compliance status before details. |
| 101 | **What + Why + How** — "Expand the hit region (What) because 32 pt targets fail the HIG minimum (Why); pad to 44x44 via contentShape (How)." |
| 102 | **Confidence tagging** — 🟢 tool-verified / 🟡 needs device test / 🔴 assumed. |
| 103 | |
| 104 | ## Related Skills |
| 105 | |
| 106 | **ui-design-system**: token-based component systems (not platform HIG rules). |
| 107 | **ux-researcher-designer**: persona/research validation (not visual styling). |
| 108 | **landing-page-generator**: web marketing pages, not native apps. |
| 109 |
Discussion
Browse more free Claude skills or everything in Design.