data-viz
Applies data visualization and information design principles to encode data truthfully and efficiently. Use when the question is…
Decomposes underspecified design requests by classifying gaps (missing brand context, visual ambiguity, false premises, scope faults) and generating targeted clarifying questions. Produces a confirmed design brief before any design work begins. For sharpening a design request
$ npx -y skills add ryanthedev/design-for-ai --skill clarify --agent claude-codeHow it fires
How this skill gets triggered: by you, by Claude, or both.
/clarifyContext preview
The summary Claude sees to decide when to auto-load this skill.
Decomposes underspecified design requests by classifying gaps (missing brand context, visual ambiguity, false premises, scope faults) and generating targeted clarifying questions. Produces a confirmed design brief before any design work begins. For sharpening a design request
name: clarify description: "Decomposes underspecified design requests by classifying gaps (missing brand context, visual ambiguity, false premises, scope faults) and generating targeted clarifying questions. Produces a confirmed design brief before any design work begins. For sharpening a design request that already exists; not for open-ended design brief discovery from a vague idea (use /design-for-ai:research)." user-invocable: false
Understand what the user needs before committing to design work.
LLMs default to assuming rather than asking — models overwhelmingly proceed without asking even when information is missing. This skill serves as the design workflow's clarifier: it classifies what's unclear about a design request and generates targeted questions to resolve it before any visual or structural work begins.
`adaptive-questioning.md` at `${CLAUDE_SKILL_DIR}/references/adaptive-questioning.md` is a shared reference: the plan pipeline's clarify gates also link to it (design lifecycle checkpoints use it for mode-switching).
Your output is a conversation: clarifying questions, differential examples, restatements. Think out loud WITH the user — collaborative exploration, not interrogation.
---
Not all gaps are the same. Classifying the type determines what kind of question to ask.
**Intention faults** — The real design goal isn't recoverable from the request.
**Premise faults** — An assumption in the request is wrong or unresolvable.
**Parameter faults** — Required design details are missing or conflicting.
**Expression faults** — The language prevents unique design interpretation.
Once you've identified a gap, classify which direction it pulls — this shapes your question:
| Direction | Signal | Clarification Action | |-----------|--------|---------------------| | **Semantic** | Design term has multiple valid meanings | Disambiguate: "do you mean X or Y?" | | **Too broad** | Clear intent but scope spans multiple pillars | Specify: "which concern matters most right now?" | | **Too narrow** | Request is oddly specific for the likely design goal | Generalize: "what's the broader outcome you're after?" |
Three concrete ways a design request becomes ambiguous:
Inconsistencies between design requirements are easy to miss. Explicitly check whether parts of the request conflict (e.g., "bold and vibrant" + "calm and trustworthy" pull in opposite directions).
---
Don't start with "what should I ask?" Start with "what are the plausible design directions?" Then find the question whose answer eliminates the most of them.
1. Generate 2–4 competing design interpretations of the request 2. Identify what distinguishes them — the axis of disagreement 3. Ask about that axis
**Example:**
One question targeting the axis of disagreement beats three questions about visual details.
Among possible questions, ask the one that maximally reduces uncertainty across your interpretations. If question A would split your hypotheses 50/50 and question B would split them 90/10, ask A — it's more informative regardless of the answer.
Target convergence in 3–5 rounds. Beyond that, returns diminish sharply.
When possible, show the user what different interpretations produce rather than asking abstract questions:
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.
Applies data visualization and information design principles to encode data truthfully and efficiently. Use when the question is…
Produces self-contained HTML/CSS mockups and wireframes from design tokens and page specs — the output is always a viewable .html…
Adjudicate whether users can operate an interface, and run heuristic evaluation. Use when the question is operability rather than…