ui-prototyping
Explore multiple *divergent* UI directions for a screen as named Swift #Previews, remix the strongest elements into hybrids, fill them with lived-in sample content and edge-case states, then tune signature animations with a generated tuning panel. Produces real native SwiftUI you carry forward, not throwaway mockups. Use early — after new-app or at the start of any UI-heavy phase, before /apple:plan commits to a single layout. Based on Apple's WWDC method for prototyping with coding agents in Xcode: go wide → remix → make lived-in → tune.
npx skills add rshankras/claude-code-apple-skills --skill ui-prototyping --agent claude-code
Same command for any agent — swap --agent for codex, cursor, copilot.
Weekly change comes from our own snapshots, not the repository page — it measures attention, not adoption.
# UI Prototyping Skill Task lists and specs commit you to **one** layout before you've seen the alternatives. The cost is quiet but large: you anchor on the first arbitrary structure an agent guessed, then spend the rest of the phase fighting feature creep around it. This skill front-loads *divergent exploration* — many real, named SwiftUI variations you flip between in Xcode's canvas — so the layout you carry into `/apple:plan` is one you **chose**, not one you defaulted into. > **Agents are collaborators, not designers. You always have final say.** Go wide, remix, repeat. ## Why this exists (the trap it removes) A vague prompt — *"make a UI for a book club"* — produces one arbitrary layout, silently guesses at features you never asked for (polling? a photo gallery?), and anchors you on a flawed start. By the time you've bent it to the features you *do* want, it looks clunky and inelegant. Three disciplines remove the trap, and this skill enforces all three: | Discipline | What it means | What it prevents | |---|---|---| | **Specificity** | Bake the exact features in; nothing extra | Feature creep, arbitrary navigation elements | | **Stylistic intent** | Name the mood — warm coffe
- Why this exists (the trap it removes)
- Input
- The method — go wide → remix → make lived-in → tune
- Stage 1 — Go wide (divergent variations)
- Stage 2 — Remix + make it lived-in
- Stage 3 — Tune key moments (a tuning panel)
- Output: .planning/PROTOTYPE.md + real Swift
- Honest limits
- Cadence & integration
What does the ui-prototyping skill do?
Explore multiple *divergent* UI directions for a screen as named Swift #Previews, remix the strongest elements into hybrids, fill them with lived-in sample content and edge-case states, then tune signature animations with a generated tuning panel. Produces real native SwiftUI you carry forward, not throwaway mockups. Use early — after new-app or at the start of any UI-heavy phase, before /apple:plan commits to a single layout. Based on Apple's WWDC method for prototyping with coding agents in Xcode: go wide → remix → make lived-in → tune.
How do I install it?
Run `npx skills add rshankras/claude-code-apple-skills --skill ui-prototyping --agent claude-code` — it drops the skill into your project so the agent can pick it up. Swap the --agent value for codex, cursor or copilot if you use one of those.
Where does this skill come from?
From rshankras/claude-code-apple-skills, a repository with 589 stars. We read it straight from the repository tree rather than a submitted listing, so what you see here is what is actually published.
Is a popular skill a good skill?
Not necessarily. Stars measure attention, not adoption — a repository can trend for a week and be abandoned. That is why we show the weekly change from our own snapshots next to the total, instead of a single flattering number.