build
Execute an approved design plan through gated phases (BUILD → REVIEW → commit) with subagent dispatch. Produces JOURNEY.md,…
Turn a design brief into a phased design plan: clarify gaps, classify complexity, decompose into lifecycle stages (Discover/Design), assign doctrine per phase, and set design done-when items (contrast ratios, token coverage, heuristic pass). Use after research, or standalone
$ npx -y skills add ryanthedev/design-for-ai --agent claude-codeHow it fires
How this command gets triggered: by you, by Claude, or both.
/planContext preview
What this command does when you run it.
Turn a design brief into a phased design plan: clarify gaps, classify complexity, decompose into lifecycle stages (Discover/Design), assign doctrine per phase, and set design done-when items (contrast ratios, token coverage, heuristic pass). Use after research, or standalone
description: "Turn a design brief into a phased design plan: clarify gaps, classify complexity, decompose into lifecycle stages (Discover/Design), assign doctrine per phase, and set design done-when items (contrast ratios, token coverage, heuristic pass). Use after research, or standalone when the brief is already known." argument-hint: "[research doc path or brief description]"
The plan is a contract between `plan` and `build`. It specifies WHAT to design and WHY at the strategic level, with explicit artifact seams between phases. It **references and sequences** doctrine by name — it never copies doctrine content.
This command obeys the shared contract in `docs/workflow-conventions.md` (the lifecycle, the artifact gates, the done-when vocabulary) and cites it rather than restating it.
---
`$ARGUMENTS` is either a **research-doc path** or a **brief description**:
A research doc carries confirmed intent. **Do not re-derive the brief from scratch** — read it, then fill only the gaps. A research doc's `## Taste signals` section, when present, carries dealer pins — copy them into the DNA phase's `**Constraints:**` verbatim rather than re-eliciting them.
---
Before classifying, detect which design artifacts already exist. This decides where the plan *enters* the lifecycle — you do not re-plan work that is already done.
ls DESIGN.md JOURNEY.md 2>/dev/null
| Artifacts present | Entry stage | What the plan covers | |---|---|---| | Neither | **Discover** | Full lifecycle: Discover → Design | | JOURNEY.md only | **Design — DNA** | Skip Discover; plan the Design stages from DNA onward | | DESIGN.md locked (token block present + user-confirmed) | **Design — continue** | Skip Discover and DNA; plan the remaining Design stages (tokens, system, words, data) | | Both | **Design — compose** | Plan only the unfinished Design stages |
State the entry stage explicitly: "DESIGN.md is locked — resuming at the Design stage; Discover is already done." **Never redo a stage whose gating artifact already exists.** This is the mid-lifecycle resume contract (workflow-conventions.md §5).
---
Read the brief and make an instant complexity call before any other work — the track determines everything downstream.
| Signal in the brief | Track | |---|---| | One surface, focused ask. "make this landing page feel premium." User knows the target even if not the execution. | **Quick** | | A product with several surfaces, multiple audiences, "how should this flow", needs a journey + a design system | **Standard** | | A redesign, a multi-surface product, a new brand from nothing, high uncertainty across both Discover and Design | **Full** |
**Default to Quick.** Under-planning a simple design is cheap to fix; over-planning a one-surface polish wastes the user's time. Only upgrade when the signals clearly demand it. A mid-lifecycle resume (DESIGN.md already locked) almost always shrinks the track — there is less left to plan.
---
These steps produce the confirmed problem statement that anchors all downstream phases.
Load `Skill(clarify)`. A research doc usually answers most of this — clarify **only its open questions**. Route each gap by shape: a genuinely decisive pick with self-contained 2-4 options (e.g., "which device class — phone, TV, or in-car?") → `AskUserQuestion`. An open-ended content gap (missing brand context, vague mood words, undefined audience, scope faults) → ask in conversation as end-turn markdown; the answer is prose the user has to elaborate, not a button they can tap, and a dialog can't hold it any better than the problem statement below can. Keep asking, in whichever channel fits each gap, until the answers are decisive and no new gaps remain.
**Cap: 5 rounds.** If still unclear at the cap, state your remaining assumptions explicitly and ask the user to object.
Write:
Render the statement as markdown in conversation and end the turn asking "Does this capture what you want to design?" — the user replies in their own words. Content confirmations happen in conversation, not in a dialog: the conversation is the only surface that renders the full statement (dialog previews truncate, and the user can't correct nuance through option buttons). Corrections → update and re-confirm. New gaps → re-enter clarify on those gaps. This becomes the plan's `## Context`. **No plan writing begins until the problem statement is confirmed.**
---
Every phase maps to one lifecycle stage. The stage fixes the doctrine and the gating artifact (workflow-conventions.md §1, §4).
| Stage | Concern | Doctrine | Gating artifact (Produces) | |-------|---------|----------|----------------------------| | **Discover — JTBD + IA** | how the user moves through time | `journey` | JOURNEY.md (Job + Journey + IA) | | **Discover — flows + page specs** | the route + page structure | `journey` | JOURNEY.md (Flows + Page specs) | | **Design — DNA + tokens** | the visual identity | `design-dna` (+ `archetypes`, `foundations`) | DESIGN.md
Claude builds interfaces that look like Claude built them. Cyan-on-dark hero sections. Cards in a grid, all the same size. Glassmorphism on everything. Bounce easing. Inter at 16px. You've seen it. You've shipped it. Your users noticed.
Execute an approved design plan through gated phases (BUILD → REVIEW → commit) with subagent dispatch. Produces JOURNEY.md,…
Produce a cheap mock from the design plan and gate on user sign-off before committing to the full build. Dispatches the…
Figure out what the user wants to design — even when they don't know yet. Extracts the design brief: purpose, audience, brand…