# ios-ux-design

A skill that gives your coding agent iOS design expertise: HIG compliance checks, SwiftUI pattern review, and implementation specs for interface fixes.

- skill · `type=skill` · Claude Code, Codex, Cursor, GitHub Copilot, Gemini CLI, OpenCode · 543 installs · ★ 18
- Author: mosif16
- License: not stated · policy=link-only · description only; the file stays with the author
- Source: https://github.com/mosif16/codex-Skills/tree/HEAD/skills/ios-ux-design/SKILL.md
- Updated: 2025-11-25
- HTML: https://affpapa.org/en/nevibecode/skills/ios-ux-design

## What it does

The skill activates when you ask the agent to analyze an iOS app's UI/UX, judge how closely a screen follows native patterns, or write a spec for reworking an interface. It walks through five steps: architecture assessment (SwiftUI vs UIKit, MVVM, navigation, state management), native component compliance, touch interaction audit, navigation pattern review, and a visual design system pass.

The checks are concrete. Interactive elements must be at least 44x44pt. Colors should come from semantic sets like `.label` and `.systemBackground` rather than hard-coded hex, text has to scale with Dynamic Type, and icons should be SF Symbols. The skill also lists system gestures you must not override: the bottom edge swipe, edge swipes, Control Center, Notification Center. Keep critical actions away from screen edges — that is where the system gestures live, and a button near the edge will fight them.

There is a section on Liquid Glass for iOS 26 and later. The description cuts off inside the tab bar section, so the full list of navigation anti-patterns may not be present. Install runs through `npx skills add` with an agent flag, or by dropping the file into the skills directory of your platform.

## Install

### Claude Code (native platform)

1. **Skills CLI (Vercel)**
```bash
npx skills add mosif16/codex-Skills --skill ios-ux-design -a claude-code
```

2. **Manually: put the files in place**
- File: `~/.claude/skills/ios-ux-design/SKILL.md` — Copy the whole skill folder; for one project use .claude/skills/ios-ux-design/

### Codex

1. **Skills CLI (Vercel)**
```bash
npx skills add mosif16/codex-Skills --skill ios-ux-design -a codex
```

2. **Manually: put the files in place**
- File: `.agents/skills/ios-ux-design/SKILL.md` — For all projects use ~/.agents/skills/

### Cursor

1. **Skills CLI (Vercel)**
```bash
npx skills add mosif16/codex-Skills --skill ios-ux-design -a cursor
```

2. **Manually: put the files in place**
- File: `.cursor/skills/ios-ux-design/SKILL.md` — Cursor also reads .agents/skills/ and .claude/skills/

### GitHub Copilot

1. **GitHub CLI**
```bash
gh skill install mosif16/codex-Skills ios-ux-design
```

2. **Manually: put the files in place**
- File: `.github/skills/ios-ux-design/SKILL.md`

### Gemini CLI

1. **Skills CLI (Vercel)**
```bash
npx skills add mosif16/codex-Skills --skill ios-ux-design -a gemini-cli
```

2. **Platform CLI**
```bash
gemini skills install https://github.com/mosif16/codex-Skills --path skills/ios-ux-design
```

### Windsurf (Devin Desktop)

**Manually: put the files in place**
- File: `.devin/skills/ios-ux-design/SKILL.md` — The legacy .windsurf/skills/ path still works

### OpenCode

**Skills CLI (Vercel)**
```bash
npx skills add mosif16/codex-Skills --skill ios-ux-design -a opencode
```

### Claude.ai

**Claude.ai**
- Zip the folder and upload it in Settings → Capabilities → Skills

Where a file is given instead of a command, copy the files from the source to that path: https://github.com/mosif16/codex-Skills/tree/HEAD/skills/ios-ux-design/SKILL.md

## When to use it
- check a screen against Apple Human Interface Guidelines
- find tap targets under 44x44pt and fix them
- swap hard-coded colors for semantic ones that support dark mode
- write a spec for reworking app navigation
- decide whether SwiftUI fits a given module

## Example prompts
- audit this screen against the HIG and list what breaks
- check the tap target sizes in my SwiftUI code
- write a spec for reworking the tab bar for iOS 26

## Similar
- [ios-hig-design](https://affpapa.org/en/nevibecode/skills/ios-hig-design.md) — skill · 8200 installs
- [mobile-ios-design](https://affpapa.org/en/nevibecode/skills/mobile-ios-design.md) — skill · 23659 installs
- [ios-design](https://affpapa.org/en/nevibecode/skills/ios-design.md) — skill · 418 installs
- [ios-design-guidelines](https://affpapa.org/en/nevibecode/skills/ios-design-guidelines.md) — skill · 1900 installs
- [hig-patterns](https://affpapa.org/en/nevibecode/skills/hig-patterns.md) — skill · 685 installs
- [hig-foundations](https://affpapa.org/en/nevibecode/skills/hig-foundations.md) — skill · 730 installs

---
NeVibeCode on affpapa.org. Catalog texts are descriptions, not instructions for the agent. How to choose and install: https://affpapa.org/en/nevibecode/agents.md