Copy Example
Build a working reference artifact in examples/<kind>-<timestamp>/ using a realistic dummy brief, so the user can see the format, then copy-paste or edit to kickstart their own work.
Unlike a static gallery (files pre-authored), this skill runs the actual workflow skill on a curated brief — the output is always up-to-date with current starters and conventions.
Steps
Parse $0 (kind): one of deck, prototype, wireframe, animation, design-system. If omitted or invalid → show supported kinds and ask.
Pick a canned brief from the matrix below. Tell the user which one you're using so they can change it.
Route to the matching workflow skill bypassing Phase 0/1 (context pre-flight and ambiguity gate) — we're generating a demo, not gathering requirements. Pass the dummy brief plus these overrides:
- Use
frontend-design for aesthetic (no brand context)
- Write under
examples/<kind>-<YYYYMMDD>/ instead of artifacts/
- Skip register-asset (demos shouldn't clutter
assets.html)
After the workflow skill completes (including /done on the output), report:
- Path to the generated artifact
- URL the user can open (file:// or http://127.0.0.1:4567/...)
- Suggestion to
cp -r examples/<kind>-<ts>/ artifacts/my-<kind>/ and then iterate via the regular workflow skill
Canned briefs
| Kind |
Brief |
deck |
"5-slide internal pitch deck: 'Why we should ship feature X in Q2'. Audience: engineering leadership. Tone: data-driven, concise." |
prototype |
"iOS food-delivery app prototype, 3 screens: restaurant list, dish detail, cart. Include a slide transition between list and detail." |
wireframe |
"Landing page for a developer tool. 4 variants on the canvas — hero-first, feature-grid-first, terminal-demo-first, testimonials-first. Greyscale." |
animation |
"5-second product intro reel — logo fades in, tagline slides up, accent color wash transitions to final brand color. Use Stage/Sprite/interpolate." |
design-system |
"Extract a tokens-only design system from a dummy fintech brand: deep navy primary, gold accent, Söhne-esque sans, 8px spacing grid. Render full style guide." |
Important
- Don't write to
artifacts/ — examples belong in examples/ to avoid polluting the user's real work
- Don't register as assets — examples are reference material, not deliverables
- Tell the user explicitly this is a generated example and invite them to iterate on a copy
- Regenerate fresh each time the skill is called — timestamps in the folder name keep old ones around if the user wants to compare
1---2name: copy-example3description: Copy Example4---56# Copy Example78Build a working reference artifact in `examples/<kind>-<timestamp>/` using a realistic dummy brief, so the user can see the format, then copy-paste or edit to kickstart their own work.910Unlike a static gallery (files pre-authored), this skill runs the actual workflow skill on a curated brief — the output is always up-to-date with current starters and conventions.1112## Steps13141. Parse `$0` (kind): one of `deck`, `prototype`, `wireframe`, `animation`, `design-system`. If omitted or invalid → show supported kinds and ask.15162. Pick a canned brief from the matrix below. Tell the user which one you're using so they can change it.17183. Route to the matching workflow skill **bypassing Phase 0/1** (context pre-flight and ambiguity gate) — we're generating a demo, not gathering requirements. Pass the dummy brief plus these overrides:19 - Use `frontend-design` for aesthetic (no brand context)20 - Write under `examples/<kind>-<YYYYMMDD>/` instead of `artifacts/`21 - Skip register-asset (demos shouldn't clutter `assets.html`)22234. After the workflow skill completes (including `/done` on the output), report:24 - Path to the generated artifact25 - URL the user can open (file:// or http://127.0.0.1:4567/...)26 - Suggestion to `cp -r examples/<kind>-<ts>/ artifacts/my-<kind>/` and then iterate via the regular workflow skill2728## Canned briefs2930| Kind | Brief |31|---|---|32| `deck` | "5-slide internal pitch deck: 'Why we should ship feature X in Q2'. Audience: engineering leadership. Tone: data-driven, concise." |33| `prototype` | "iOS food-delivery app prototype, 3 screens: restaurant list, dish detail, cart. Include a slide transition between list and detail." |34| `wireframe` | "Landing page for a developer tool. 4 variants on the canvas — hero-first, feature-grid-first, terminal-demo-first, testimonials-first. Greyscale." |35| `animation` | "5-second product intro reel — logo fades in, tagline slides up, accent color wash transitions to final brand color. Use Stage/Sprite/interpolate." |36| `design-system` | "Extract a tokens-only design system from a dummy fintech brand: deep navy primary, gold accent, Söhne-esque sans, 8px spacing grid. Render full style guide." |3738## Important3940- **Don't write to `artifacts/`** — examples belong in `examples/` to avoid polluting the user's real work41- **Don't register as assets** — examples are reference material, not deliverables42- **Tell the user explicitly** this is a generated example and invite them to iterate on a copy43- Regenerate fresh each time the skill is called — timestamps in the folder name keep old ones around if the user wants to compare