ktg-plugin-marketplace/plugins/claude-design/README.md

Claude Design Facilitator

End-to-end facilitator for prompting Claude Design (claude.ai/design). Walks the operator from raw idea through intent-preset selection, audience and destination clarification, DESIGN.md anchor, five-layer prompt drafting, copy-paste delivery, iteration coaching, and ship-readiness handoff. Cites Anthropic primary sources inline. Recommends Anthropic's official knowledge-work-plugins/design as the downstream post-design tool.

Solo-maintained, fork-and-own. This plugin is a starting point, not a vendor product. Issues are welcome as signals; pull requests are not accepted. See GOVERNANCE.md for the full model and what upstream provides.

AI-generated: all content produced by Claude Code through dialog-driven development. Full disclosure →

A Claude Code plugin that ships one skill (claude-design-facilitator) plus a reference tree for prompting Anthropic's claude.ai/design workspace. The skill auto-fires on natural-language triggers, walks the operator through an eight-phase facilitation flow, and produces a copy-paste-ready prompt grounded in Anthropic's verbatim Goal / Layout / Content / Audience framework and the four published per-preset prompt patterns. Output is the prompt — the artifact gets built in Claude Design.

---

Why this exists

Claude Design has a strong gravitational pull toward convergent middle-ground output. A one-line prompt like "make me a slide deck for Q1 results" reliably produces what Anthropic's own cookbook for prompting frontend aesthetics names as the failure mode: Inter or Roboto typography, white-to-purple gradients, evenly-spaced cards, cramped layouts that read as AI-generated. The convergence is not random — it is what the model defaults to when prompts are underspecified.

The fix is in the prompt itself, not in the artifact. Anthropic publishes a five-layer prompt scaffold across three primary sources — the Goal / Layout / Content / Audience framework in the Claude Design launch post and Get started article, the DESIGN.md anchor in the design system article, and the AI-slop avoid-list plus cultural-reference anchoring in the aesthetics cookbook. Assembling a prompt that actually uses all five layers, with the right per-preset pattern, in the right order, takes deliberate scaffolding most operators do not do unprompted.

This plugin does the scaffolding interactively. The claude-design-facilitator skill walks the operator through eight phases, surfaces the questions that produce a workable Goal / Layout / Content / Audience answer, anchors on DESIGN.md if one exists or extracts one if not, composes the five layers in the right order, and outputs a copy-paste prompt the operator pastes into claude.ai/design. The artifact gets built in Claude Design; this plugin produces the prompt.

The output is honest about what it is. Every authoritative claim cites an Anthropic primary source inline. Community patterns are labelled and attributed. The frontier-design preset is flagged Experimental rather than dressed up as canonical. The plugin recommends Anthropic's official knowledge-work-plugins/design for everything that happens after the artifact is generated — there is zero command overlap by design.

---

Scope and complementarity

This plugin covers the pre-design and during-design lifecycle for claude.ai/design: idea → intent-preset selection → prompt engineering → copy-paste delivery → iteration coaching → ship-readiness check.

For post-design work — critique, accessibility audit, UX copy review, research synthesis, design-system audit, engineering handoff guidance — install Anthropic's official plugin:

claude plugins add knowledge-work-plugins/design

Anthropic's plugin operates on existing artifacts (Figma URLs, screenshots, copy snippets) and ships six slash-commands: /critique, /accessibility, /ux-copy, /research-synthesis, /design-system, /handoff. There is zero command overlap with this plugin and complementary lifecycle coverage — the two plugins are designed to be installed together. See skills/claude-design-facilitator/references/04-handoff-and-scope.md for the full coverage map.

---

What this plugin is NOT

By design, this plugin does not:

• Drive the browser. No automation of claude.ai/design itself; you copy and paste the prompts the skill produces.
• Generate the artifact code. Claude Design is the artifact generator. This plugin produces prompts that go into Claude Design.
• Store artifact history or version artifacts. Claude Design has no version-tree primitive and this plugin does not invent one.
• Cover adjacent Anthropic surfaces. Classic Artifacts at claude.ai, Live Artifacts in Claude Cowork, custom visuals embedded in a chat reply are out of scope — see skills/claude-design-facilitator/references/00-what-claude-design-is-and-isnt.md for the disambiguation reference.
• Duplicate Anthropic's knowledge-work-plugins/design plugin. No /critique, no /accessibility, no /ux-copy, no /research-synthesis, no /design-system, no /handoff. The post-design lane belongs to Anthropic's plugin.

tests/validate-plugin.sh enforces the forbidden-command-name list mechanically.

---

Installation

Add the marketplace once, then install the plugin:

claude plugins marketplace add ktg-plugin-marketplace https://git.fromaitochitta.com/open/ktg-plugin-marketplace

In Claude Code:

/plugin install claude-design@ktg-plugin-marketplace

Or enable directly in ~/.claude/settings.json:

{
  "enabledPlugins": {
    "claude-design@ktg-plugin-marketplace": true
  }
}

The skill auto-discovers; no further configuration needed.

---

What you can do with it

The skill claude-design-facilitator walks the operator through eight phases. The phases are scoping + grounding (1–4), drafting + delivery (5–6), and iteration + ship-readiness (7–8).

Phase	What happens
1. Disambiguate the surface	Confirm claude.ai/design is the intended surface, not classic Artifacts, Live Artifacts, custom chat visuals, or knowledge-work-plugins/design. Read references/00 when signals are mixed.
2. Name the intent preset	Pick one of eight Claude Design presets: designs, prototypes, slides, one-pagers, wireframes-mockups, pitch-decks, marketing-collateral, frontier-design. The per-preset reference file shapes the prompt pattern. Evidence-grade labels are surfaced.
3. Audience and destination	Capture audience (internal team / external stakeholder / investor / customer) and destination (PDF / PPTX / HTML / Canva / Code-handoff / share-link). Flag PPTX-export traps for pitch-decks early.
4. Anchor on DESIGN.md	Read references/02. If the operator has no DESIGN.md, point at the copy-paste brand-to-DESIGN.md extractor prompt.
5. Draft the prompt	Compose layers 1–5 from references/01: Anthropic's verbatim Goal / Layout / Content / Audience framework + start-simple-layer-complexity + concrete-alternative-spec + propose-options-before-building + AI-slop negative constraints + four design dimensions + four grading criteria + the per-preset pattern.
6. Deliver	Output a single copy-paste-ready fenced markdown code block. Add a one-line caption and three to five expected follow-up turns.
7. Iteration coaching	Read references/03. Coach which surface to use next — Tweak panel (zero-token, surgical), inline comments (component-scoped), or chat (full regen). Session-break heuristics + recovery prompt library when iteration gets stuck.
8. Ship-readiness	Run the export validation checklist. If shipping to engineering, confirm the Design → Code handoff bundle is complete. Recommend installing knowledge-work-plugins/design for downstream critique / accessibility / handoff.

The skill auto-fires on natural-language triggers like "I want to build a dashboard in Claude Design", "help me prompt claude.ai/design", "iterate on my Claude Design artifact". The full trigger list is in skills/claude-design-facilitator/.triggers.txt and tests/test-skill-triggers.sh validates each phrase appears in the skill description.

Explicit invocation works too: the skill registers as the slash command /claude-design-facilitator for when the operator wants to start a clean facilitation session.

---

Workflow example: from idea to prompt

A realistic session against the slides preset — Q1 results deck for an internal engineering all-hands.

Operator: "I want to build a Q1 results slide deck for the engineering team in Claude Design."

The skill auto-fires (the phrase matches .triggers.txt). It walks the eight phases:

Phase 1 — Disambiguate the surface. The skill confirms claude.ai/design is the intended surface, not classic Artifacts or Live Artifacts. The operator confirms.

Phase 2 — Name the intent preset. Slide deck → slides preset. The skill notes this is one of three Anthropic-documented presets (evidence-grade label surfaced from .coverage.md). It opens references/presets/slides.md and surfaces the five canonical Anthropic patterns (Q1 results, executive roadmap, customer-prep briefing, partner proposal, all-hands announcement). The operator picks pattern 1.

Phase 3 — Audience and destination. Internal engineering team; deck stays in HTML preview during the meeting, optional PPTX export to share with adjacent leads afterward. The skill flags the PPTX-export trap from references/presets/slides.md section (e): fonts substitute, master slides drop, charts may flatten to images. If a brand-compliant PPTX template exists, upload it to Claude Design as a project asset before prompting — Claude reads the slide master, layouts, fonts, and colour scheme and respects them (PowerPoint-mode article).

Phase 4 — Anchor on DESIGN.md. The operator has no DESIGN.md yet. The skill points at the brand-to-DESIGN.md extractor prompt in references/02-design-md.md: paste a brand-guidelines URL or PDF into Claude.ai, get back a DESIGN.md filling the nine canonical sections (typography, colour, spacing, layout primitives, motion, voice, imagery, density, accessibility). The operator runs the extractor against the company's brand site, gets a DESIGN.md, drops it into the Claude Design project assets.

Phase 5 — Draft the prompt. The skill composes the five layers from references/01-prompt-fundamentals.md: Goal / Layout / Content / Audience (Layer 1) → start-simple-layer-complexity (Layer 2) → concrete-alternative-spec (Layer 3) → AI-slop negative constraints (Layer 4) → per-preset pattern from presets/slides.md (Layer 5). The skill produces a single copy-paste fenced block. The operator inspects it, optionally edits the Goal sentence, then proceeds.

Phase 6 — Deliver. The skill outputs the prompt block. The structure of a realistic delivery for this scenario looks like:

**Goal:** Communicate Q1 engineering results to the all-hands —
where we started, what changed, what we shipped, what we learned,
what's next for Q2. The deck should land as confident but honest:
real numbers, named risks, no victory-lap framing. Audience is
~80 engineers across three teams. Density should be high enough
to skim later, low enough to follow live.

**Layout:** 10–12 slides, slide-by-slide:
1. Title + Q1 in one sentence
2. The three things we shipped (one per row, screenshot + metric)
3. The two things that slipped (named honestly, with the why)
4. Hiring update (count + retention)
5. Reliability (incident count, MTTR trend)
6. Customer signal (NPS + 2 verbatim quotes)
7. Engineering health (PR throughput, review latency)
8. The big bet for Q2 (one slide, named)
9. Risks for Q2 (3 bullets, ranked)
10. Asks from the all-hands (1–3 specific asks)
11. Q&A placeholder

**Content:** Use the metrics in DESIGN.md's `tone` section — direct,
specific, no marketing voice. Numbers are placeholder; I'll edit
before the meeting.

**Audience:** Internal engineering all-hands, 80 people, ICs through
EM/Director level. They want to know: did we ship what we said, what
broke, what's next, can I help.

**Avoid:** Inter or Roboto, white-to-purple gradients, evenly-spaced
generic card layouts, "exciting Q1!" framing, congratulatory tone,
stock-photo gradients, generic icon library defaults.

**Anchor:** Match the DESIGN.md uploaded as a project asset. If our
brand voice reads as understated technical, push the deck that way —
not the convergent SaaS-marketing deck aesthetic.

**Reference:** Treat this as the Q1 results pattern from
https://claude.com/resources/tutorials/using-claude-design-for-presentations-and-slide-decks
(pattern 1), with the Layout above overriding the tutorial's slide count.

That block is what gets pasted into claude.ai/design. The skill also surfaces three to five expected follow-up turns (e.g., "the headline slide is too marketing, push it more technical", "slide 5 reliability — show the MTTR trend as a sparkline, not a bar chart") so the operator knows what iteration looks like before starting.

Phase 7 — Iteration coaching. Once Claude Design produces the first version, the skill points the operator at the Tweak → Comment → Chat cascade in references/03-iteration-and-session.md: Tweak panel for surgical zero-token edits (spacing, font size, colour), inline comments for component-scoped changes (rewrite slide 5), full chat regeneration as a last resort. Plus the session-break heuristic (after 4 substantive screens, start a fresh session with a verbal save-pattern carrying state forward) and the recovery prompt library when iteration gets stuck.

Phase 8 — Ship-readiness. Before the all-hands, the skill runs the export validation checklist for the chosen destination (HTML preview → keep in Claude Design; PPTX → check fonts and master, charts may flatten). If the deck is being handed off to engineering for any reason, it recommends installing knowledge-work-plugins/design for /critique, /accessibility, and /handoff — the post-design lane.

The full output of the session is a single fenced markdown block (Phase 6) plus a short follow-up-turns list and an iteration-coaching pointer. That is the entire user-facing deliverable.

---

Skill surface

Skill	Triggers	Output
claude-design-facilitator	12 natural-language phrases (full list in .triggers.txt); also explicit /claude-design-facilitator slash command	A copy-paste-ready Claude Design prompt block composed from the five-layer stack and the per-preset pattern, with follow-up-turn expectations

No commands, no agents, no hooks, no MCP servers at v0.1. The single skill is the entire user-facing surface.

---

Reference content map

The plugin ships 13 reference files in skills/claude-design-facilitator/references/:

Foundation references (5):

• 00-what-claude-design-is-and-isnt.md — Surface disambiguation against Artifacts, Live Artifacts, custom chat visuals, and Anthropic's knowledge-work-plugins/design.
• 01-prompt-fundamentals.md — The five-layer prompt stack: GLCA framework + start-simple-layer-complexity + concrete-alternative-spec + propose-options + AI-slop negative constraints + four design dimensions + four grading criteria. Anchored on four Anthropic primary sources.
• 02-design-md.md — DESIGN.md 9-section canonical structure + brand-to-DESIGN.md extractor prompt + failure modes.
• 03-iteration-and-session.md — Tweak / Comment / Chat cascade, session economics, 4-screen inflection, recovery prompt library (break-default-aesthetic, fix-the-system, edit-previous-message, 3-failed-comment escalation, model downshift, verbal save-pattern).
• 04-handoff-and-scope.md — Design → Code one-way handoff, bundle contents, lifecycle-stage coverage map vs Anthropic's knowledge-work-plugins/design, downstream tool recommendation.

Per-preset references (8):

• presets/designs.md — Anthropic-documented + community-validated
• presets/prototypes.md — Anthropic-documented + community-validated
• presets/slides.md — Anthropic-documented + community-validated
• presets/one-pagers.md — Community-only
• presets/wireframes-mockups.md — Community-only
• presets/pitch-decks.md — Community-only (with explicit PPTX-export caveat)
• presets/marketing-collateral.md — Community-only
• presets/frontier-design.md — Experimental — no validated practitioner pattern as of 2026-05-16

---

Per-preset coverage

The canonical coverage manifest is .coverage.md. Below mirrors that file.

Preset	Evidence grade	Anthropic anchor
designs	Anthropic-documented + community-validated	launch post
prototypes	Anthropic-documented + community-validated	prototypes tutorial
slides	Anthropic-documented + community-validated	slides tutorial
one-pagers	Community-only	launch post
wireframes-mockups	Community-only	launch post
pitch-decks	Community-only (with PPTX-export caveat)	launch post
marketing-collateral	Community-only	launch post
frontier-design	Experimental — no validated practitioner pattern	launch post

When Anthropic publishes per-preset guidance for a Community-only or Experimental preset, .coverage.md and the affected preset file refresh — re-research triggers are documented inline.

---

Verification

bash plugins/claude-design/verify.sh

Runs five test scripts under tests/ in dependency order:

Script	Verifies
validate-plugin.sh	plugin.json + SKILL.md frontmatter + LICENSE + GOVERNANCE.md + README.md + CLAUDE.md + .coverage.md presence; forbidden-command-name scope-fence check; operator-private-context grep; Norwegian-leakage advisory
test-skill-triggers.sh	SKILL.md description >=400 chars; every phrase in .triggers.txt appears in SKILL.md
test-sc2-artifact-coverage.sh	Each preset in .coverage.md has >=1 file hit in plugin content
test-sc3-citations.sh	No unsourced-attribution placeholders (citation-stub markers, verification-flag markers, vague second-hand phrasing); each Authoritative-claims file has >=1 Anthropic-domain URL. The script enforces the exact patterns it bans — see the script source for the regex.
test-sc1-dogfood-log.sh	Format-check the operator dogfood log in REMEMBER.md (gitignored) — 5 fields well-formed

Flags:

• --strict — pass-through to test-sc1-dogfood-log.sh. Without --strict, missing dogfood block is advisory. With --strict, it is the release gate.
• --quick — skip test-skill-triggers.sh for fast incremental runs.

Exit codes: 0 = all pass; non-zero = at least one sub-test failed.

---

Compatibility

Requirement	Version
Claude Code	Recent versions with plugin support
Anthropic surface	claude.ai/design (Labs research preview launched 2026-04-17)
Platform	macOS, Linux, Windows
Network	None for the skill itself; the artifact-generation lives in claude.ai/design
Dependencies	None — no npm packages, no Python, no external tools. Bash 3.2 compatible for test scripts.

---

Re-research triggers

The reference tree carries Anthropic citations that may decay. Re-research is triggered by:

• Anthropic publishing per-preset guidance for a Community-only or Experimental preset
• Anthropic announcing material changes to the Goal / Layout / Content / Audience framework, the AI-slop avoid-list, or the design grading criteria
• Anthropic adding or removing an intent preset from the launch enumeration
• A first verified frontier-design practitioner artifact shipping publicly
• Anthropic's knowledge-work-plugins/design plugin adding or removing slash-commands (scope-fence implications)
• Labs → GA URL rename for claude.ai/design

When a trigger fires, run bash verify.sh --strict after the update to confirm SC2 and SC3 still pass.

---

Recent versions

v0.1.0 — 2026-05-17. Initial public release. Single skill (claude-design-facilitator) with eight-phase facilitation flow, 12 natural-language trigger phrases, 13 reference files (5 foundation + 8 per-preset with evidence-grade labels), .coverage.md preset manifest plus Authoritative-claims registry, five verification scripts under tests/ enforcing structural integrity / scope fence / skill description quality / per-preset coverage / Anthropic-domain citation discipline / operator dogfood log format, top-level verify.sh roll-up with --strict and --quick flags, MIT license, GOVERNANCE.md fork-and-own model.

Full release history: CHANGELOG.md. The plugin follows Semantic Versioning. The path from v0.1 to v1.0 is dogfood-driven — see the plugin's REMEMBER.md for the v1.0 readiness criteria (multi-preset breadth, auto-fire validation in real natural-language requests, two consecutive dogfood sessions with zero critical patches).

---

License

MIT. Fork it, modify it, ship your own version under your own name.