mobile-ios-design

Design native iOS interfaces following Apple's Human Interface Guidelines and SwiftUI conventions.

Updated Apr 4, 2026
One-click install
npx skills add https://github.com/mrodrigues1/akachan --skill mobile-ios-design-mrodrigues1
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: mobile-ios-design
Source: https://github.com/mrodrigues1/akachan/tree/main/.junie/skills/mobile-ios-design
Command: npx skills add https://github.com/mrodrigues1/akachan --skill mobile-ios-design-mrodrigues1

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Provides practical guidance and patterns to design native iOS interfaces that feel consistent with Apple's Human Interface Guidelines, helping teams avoid common UI/UX mistakes, accessibility regressions, and inconsistent platform behavior.

Core Features & Use Cases

  • Human Interface Guidelines: Principles for clarity, deference, and depth to inform visual hierarchy and motion.
  • SwiftUI Patterns: Concrete layout, navigation, grid, and component recommendations for building responsive views (NavigationStack, TabView, sheets).
  • System Integration & Accessibility: Guidance on SF Symbols, semantic colors, Dynamic Type, Dark Mode, accessibility labels, and state restoration for production-ready apps.
  • Use Case: Design a cross-device SwiftUI onboarding and main tabbed experience for an iPhone/iPad app that supports Dynamic Type, system colors, and accessible controls.

Quick Start

Create a SwiftUI FeatureCard that uses SF Symbols, semantic colors, Dynamic Type, safe area insets, and accessibility labels to validate a small HIG-compliant component.

Frequently Asked Questions about mobile-ios-design

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I build SwiftUI views that follow Apple's Human Interface Guidelines?

Build SwiftUI views that follow Apple's Human Interface Guidelines by applying principles of clarity, deference, and depth to inform visual hierarchy and motion. Use NavigationStack, TabView, and sheets for responsive layouts.

What's the best way to implement adaptive layouts for iPhone and iPad in SwiftUI?

Implement adaptive layouts for iPhone and iPad in SwiftUI by using NavigationStack and grid components that respond to different device sizes. This ensures your interface scales correctly across different screen dimensions.

How do I add Dynamic Type and dark mode support to my iOS app?

Add Dynamic Type and dark mode support to your iOS app by using semantic colors and system typography. These built-in SwiftUI features automatically adapt to user accessibility settings and system appearance modes.

Can I use SF Symbols with semantic colors for accessible iOS interfaces?

Yes, you can use SF Symbols with semantic colors to create accessible iOS interfaces. Apply accessibility labels to your SwiftUI components to ensure VoiceOver users can navigate and understand your app's content.

Does this approach to iOS design work for both prototypes and production apps?

This approach to iOS design works for both prototypes and production apps. It provides guidance on state restoration, accessibility labels, and system integrations required to satisfy production-ready app requirements.

How do I handle navigation state persistence in SwiftUI across iPhone and iPad?

Handle navigation state persistence in SwiftUI across iPhone and iPad by using NavigationStack to manage your view hierarchy. This ensures users return to their previous screen state when switching contexts or restarting the app.