home / skills / pproenca / dot-skills / ios-hig

This skill helps you design iOS experiences following Apple HIG, ensuring navigation, accessibility, feedback, and visual consistency across apps.

npx playbooks add skill pproenca/dot-skills --skill ios-hig

Review the files below or copy the command above to add this skill to your agents.

Files (38)
SKILL.md
5.7 KB
---
name: ios-hig
description: Apple Human Interface Guidelines for iOS. Covers navigation (tab bars, NavigationStack, toolbars), interaction design (touch targets, gestures, haptics), accessibility (VoiceOver, Dynamic Type, color contrast), user feedback (loading, errors, empty states), UX patterns (onboarding, permissions, modality, confirmation dialogs), and visual design (dark mode, SF Symbols, layout margins). This skill should be used when designing iOS user experiences, implementing HIG-compliant interactions, ensuring accessibility compliance, building navigation hierarchies, or reviewing apps for Apple design guideline compliance.
---

# Apple iOS HIG Best Practices

Comprehensive guide for Apple Human Interface Guidelines compliance in iOS apps built with SwiftUI. Contains 34 rules across 6 categories covering navigation, interaction design, accessibility, user feedback, UX patterns, and visual design.

## When to Apply

Reference these guidelines when:
- Building navigation hierarchies with tab bars, NavigationStack, or split views
- Designing touch interactions, gestures, and haptic feedback
- Ensuring accessibility with VoiceOver, Dynamic Type, and color contrast
- Implementing loading states, error handling, and empty states
- Building onboarding flows, permission requests, and confirmation dialogs
- Supporting dark mode, SF Symbols, and standard layout margins
- Reviewing apps for HIG compliance

## Rule Categories by Priority

| Priority | Category | Impact | Prefix |
|----------|----------|--------|--------|
| 1 | Navigation | CRITICAL | `nav-` |
| 2 | Interaction Design | CRITICAL | `inter-` |
| 3 | Accessibility | CRITICAL | `acc-` |
| 4 | User Feedback | HIGH | `feed-` |
| 5 | UX Patterns | HIGH | `ux-` |
| 6 | Visual Design | HIGH | `vis-` |

## Quick Reference

### 1. Navigation (CRITICAL)

- [`nav-tab-bar`](references/nav-tab-bar.md) - Design tab bars for top-level navigation
- [`nav-navigation-stack`](references/nav-navigation-stack.md) - Use NavigationStack for hierarchical navigation
- [`nav-toolbar-placement`](references/nav-toolbar-placement.md) - Place actions in toolbars using standard placements

### 2. Interaction Design (CRITICAL)

- [`inter-touch-targets`](references/inter-touch-targets.md) - Maintain 44pt minimum touch targets
- [`inter-gesture-patterns`](references/inter-gesture-patterns.md) - Use standard gesture patterns
- [`inter-haptic-feedback`](references/inter-haptic-feedback.md) - Add haptic feedback for meaningful events
- [`inter-keyboard-handling`](references/inter-keyboard-handling.md) - Handle keyboard appearance gracefully
- [`inter-drag-drop`](references/inter-drag-drop.md) - Support drag and drop for content transfer
- [`inter-pull-to-refresh`](references/inter-pull-to-refresh.md) - Support pull to refresh for lists
- [`inter-swipe-actions`](references/inter-swipe-actions.md) - Add swipe actions for contextual operations
- [`inter-list-search`](references/inter-list-search.md) - Use searchable for built-in search

### 3. Accessibility (CRITICAL)

- [`acc-labels`](references/acc-labels.md) - Provide meaningful accessibility labels
- [`acc-dynamic-type`](references/acc-dynamic-type.md) - Support Dynamic Type for all text
- [`acc-color-contrast`](references/acc-color-contrast.md) - Maintain sufficient color contrast
- [`acc-reduce-motion`](references/acc-reduce-motion.md) - Respect reduce motion preference
- [`acc-color-independent`](references/acc-color-independent.md) - Never rely on color alone
- [`acc-focus-management`](references/acc-focus-management.md) - Manage focus for assistive technologies
- [`acc-scaled-metric`](references/acc-scaled-metric.md) - Use ScaledMetric for adaptive sizing
- [`acc-view-that-fits`](references/acc-view-that-fits.md) - Use ViewThatFits for adaptive layouts

### 4. User Feedback (HIGH)

- [`feed-loading-states`](references/feed-loading-states.md) - Show appropriate loading indicators
- [`feed-error-states`](references/feed-error-states.md) - Handle errors with clear recovery actions
- [`feed-notifications`](references/feed-notifications.md) - Use notifications judiciously
- [`feed-success-confirmation`](references/feed-success-confirmation.md) - Confirm successful actions appropriately
- [`feed-empty-states`](references/feed-empty-states.md) - Design helpful empty states

### 5. UX Patterns (HIGH)

- [`ux-onboarding`](references/ux-onboarding.md) - Design minimal onboarding
- [`ux-permissions`](references/ux-permissions.md) - Request permissions in context
- [`ux-modality`](references/ux-modality.md) - Use modality appropriately
- [`ux-confirmation-dialog`](references/ux-confirmation-dialog.md) - Use confirmation dialogs for destructive actions
- [`ux-data-entry`](references/ux-data-entry.md) - Minimize data entry friction
- [`ux-undo`](references/ux-undo.md) - Support undo for destructive actions
- [`ux-settings`](references/ux-settings.md) - Organize settings logically

### 6. Visual Design (HIGH)

- [`vis-dark-mode`](references/vis-dark-mode.md) - Support dark mode with semantic colors
- [`vis-sf-symbols`](references/vis-sf-symbols.md) - Use SF Symbols with correct rendering mode and weight
- [`vis-layout-margins`](references/vis-layout-margins.md) - Use standard layout margins and safe areas

## How to Use

Read individual reference files for detailed explanations and code examples:

- [Section definitions](references/_sections.md) - Category structure and impact levels
- [Rule template](assets/templates/_template.md) - Template for adding new rules

## Reference Files

| File | Description |
|------|-------------|
| [references/_sections.md](references/_sections.md) | Category definitions and ordering |
| [assets/templates/_template.md](assets/templates/_template.md) | Template for new rules |

Overview

This skill codifies Apple Human Interface Guidelines for iOS into a concise, actionable reference for designers and developers. It covers navigation, interaction design, accessibility, user feedback, UX patterns, and visual design with prioritized rules and clear naming. Use it to align iOS apps with HIG principles and reduce review friction. The guidance is practical and focused on common implementation scenarios in SwiftUI and UIKit.

How this skill works

The skill organizes 34 rules across six categories by priority and impact, with stable rule prefixes for quick identification (e.g., nav-, inter-, acc-). Each rule points to focused guidance—touch targets, NavigationStack usage, Dynamic Type support, error states, onboarding, dark mode, and more—plus examples and recommended placements. Designers and engineers consult the relevant rule when designing features, reviewing screens, or implementing components to ensure HIG compliance.

When to use it

  • When building or reviewing navigation hierarchies (tab bars, NavigationStack, split views).
  • When defining touch interactions, gesture behaviors, and haptic feedback.
  • When implementing accessibility (VoiceOver labels, Dynamic Type, contrast).
  • When designing loading indicators, error handling, and empty states.
  • When creating onboarding flows, permission requests, or confirmation dialogs.
  • When preparing visual styling for dark mode, SF Symbols, and layout margins.

Best practices

  • Prioritize critical categories: navigation, interaction, and accessibility first.
  • Use standard components and placements (tab bars, toolbars, NavigationStack) to match platform expectations.
  • Enforce 44 pt minimum touch targets and respect system gesture patterns.
  • Support Dynamic Type, sufficient color contrast, and assistive preferences like Reduce Motion.
  • Design clear recovery paths for errors and helpful empty states rather than vague alerts.
  • Request permissions in-context and keep onboarding minimal and optional.

Example use cases

  • Designing a tabbed app: define top-level tabs, item order, and proper toolbar actions.
  • Implementing accessible lists: searchable lists with Dynamic Type and VoiceOver labels.
  • Adding swipe actions and pull-to-refresh to collection and table views.
  • Creating onboarding that explains core value, defers optional permissions, and supports quick skip.
  • Auditing an app for HIG compliance before App Store submission or design review.

FAQ

Does this guidance apply to both SwiftUI and UIKit?

Yes. The rules focus on platform conventions and are applicable in SwiftUI and UIKit implementations; examples may reference SwiftUI patterns like NavigationStack.

Which rules are highest priority for App Store review?

Navigation, interaction design, and accessibility are critical. Ensure correct navigation structure, minimum touch targets, and full accessibility support first.