What is the mobile-ios-design skill?
The mobile-ios-design skill is a SKILL.md in the wshobson/agents repository, inside the ui-design plugin. It teaches an AI coding agent the Human Interface Guidelines principles and SwiftUI patterns, from NavigationStack and TabView to SF Symbols and Dynamic Type, so the native iOS views it writes follow Apple conventions.
The mobile-ios-design skill is one folder inside wshobson/agents, under plugins/ui-design/skills. Its SKILL.md covers Apple's Human Interface Guidelines and SwiftUI patterns, and three reference files in the folder go deeper on HIG patterns, iOS navigation and SwiftUI components.
The description scopes it to designing iOS interfaces, implementing SwiftUI views and following Apple's design principles. The file opens with three HIG principles, clarity, deference and depth, then moves straight into code samples the agent can adapt.
What changes in your agent's output
- Layouts start from VStack, HStack and LazyVGrid with adaptive grid items instead of fixed frames.
- Navigation uses NavigationStack with a NavigationPath and navigationDestination, and TabView with the newer Tab type for iOS 18 and up.
- Fonts are semantic, such as .headline and .body, so text scales with Dynamic Type.
- Colors are semantic, such as .primary and .secondary, so light and dark mode work without extra code.
- Icons come from SF Symbols, with rendering modes and symbol effects where the iOS version allows.
Who the iOS design skill is for
Best for
- Building SwiftUI screens that should look native instead of ported from the web.
- Adaptive layouts across iPhone and iPad, including split view and slide over.
- Teams that want accessibility labels, hints and safe area handling added by default.
- SwiftUI references. Related: swiftui-expert-skill.
Not for
- Android or web interfaces. The skill is iOS specific. Related: design-mobile-apps.
- UIKit first codebases. Every code sample in the file is SwiftUI.
- Producing mockups. It guides code and does not draw design files.
Use it with UiChemy
This skill targets native iOS, so it does not touch WordPress. If the same product also needs a marketing site, UiChemy Figma to WordPress turns a Figma design into an editable page. Click Get Started on uichemy.com. Related: apple-design.
How to install iOS Design Skill: SwiftUI and Apple HIG Patterns
gh skill install wshobson/agents mobile-ios-designThe skill folder includes hig-patterns.md, ios-navigation.md and swiftui-components.md under references.Check GitHub CLI
The repo README says the gh skill command needs GitHub CLI 2.90 or later. It installs a single skill without the plugin's agents, commands or hooks.
Run the installer
Run
gh skill install wshobson/agents mobile-ios-designand select your coding tool when prompted. The README shows this form with a different skill name.Or copy the folder
Run
git clone https://github.com/wshobson/agents.git, then copy plugins/ui-design/skills/mobile-ios-design, including its references folder, to where your agent loads skills.Use the plugin route instead
The README also documents a plugin marketplace route for Claude Code, Codex CLI and Cursor. This skill ships in the ui-design plugin folder.
Check that it loaded
Ask your agent to build a small SwiftUI list screen with a detail view. It should reach for NavigationStack, semantic fonts and colors, and an accessibility label.
Key features
- Three HIG principlesThe skill states clarity, deference and depth as the guiding ideas, then lists iOS, iPadOS and visionOS considerations so the agent frames each screen for its platform.
- Stack and grid layoutsVStack with alignment and spacing, HStack with Spacer, and LazyVGrid with an adaptive GridItem or fixed flexible columns are shown as the default layout building blocks.
- NavigationStackThe iOS 16 and up navigation pattern is shown with a NavigationPath, NavigationLink values and a navigationDestination for the item type.
- TabView with TabFor iOS 18 and up, tabs are declared with Tab, a title, a systemImage and a selection value bound to state.
- SF SymbolsCovers basic symbols, the multicolor rendering mode, variable symbols from iOS 16 and symbolEffect from iOS 17, so icons stay consistent and accessible.
- Dynamic TypePrefers semantic fonts like headline and body, and shows a custom font declared relative to body so it still scales with user text size.
- Colors and materialsUses semantic foreground styles and system materials such as ultraThinMaterial and regularMaterial for blur and overlay effects that adapt to light and dark.
- Shadows and depthGives standard card shadow values and a layered variation with two shadows, tied back to the depth principle.
- Best practices and common issuesLists eight practices, including safe areas, @SceneStorage for state restoration, iPad multitasking and testing on a device, plus fixes for layout, lazy list, navigation and VoiceOver problems.
Frequently asked questions
What is the mobile-ios-design skill?
It is a skill in the wshobson/agents repository that teaches an AI coding agent Apple's Human Interface Guidelines and SwiftUI patterns. It covers layout, navigation, SF Symbols, Dynamic Type, colors, accessibility and common mistakes, with reference files for deeper detail.
How do I install mobile-ios-design?
The repo README documents gh skill install wshobson/agents <skill name> for single skills, so use mobile-ios-design as the name. You need GitHub CLI 2.90 or later. You can also clone the repo and copy the skill folder from plugins/ui-design/skills.
Which AI coding agents can use the mobile-ios-design skill?
The repository README lists Claude Code, Codex CLI, Cursor, OpenCode, Antigravity CLI, GitHub Copilot and Pi as supported harnesses, each with its own install route. The skills only installer asks you to pick your coding tool when you run it.
Which iOS versions does the skill assume?
The samples label their versions. NavigationStack and variable symbols are marked iOS 16 and up, symbolEffect iOS 17 and up, and the Tab based TabView iOS 18 and up. Check your deployment target before accepting generated code that uses the newest APIs.
Does it cover iPad layouts?
Yes in outline. The skill lists adaptive layouts for iPhone and iPad as a use case and advises designing for split view and slide over. It names iPadOS as having a larger canvas, multitasking and pointer support, but the main samples are general SwiftUI.
How is it different from the swiftui expert skill?
This skill pairs Apple HIG principles with ready SwiftUI snippets, so it works as a design primer. It covers SwiftUI layout, Dynamic Type and Dark Mode as part of native iOS interface design. Related: swiftui-expert-skill and building-native-ui.
What license does it use?
The wshobson/agents repository is MIT licensed, and the README notes that external plugins listed in the catalog carry their own licenses. This skill sits in the repository's own ui-design plugin, so the MIT license of the repo applies to it.



