make-deck
Make a Deck
Build an HTML slide deck that looks designed, not AI-generated. Uses starters/deck_stage.js for keyboard nav, scaling, speaker notes, and print-to-PDF.
Phase 0 — Context pre-flight (auto-detect, ONE question max)
Before asking design questions, detect context silently via auto-checks. Only ask the user if nothing is found.
Auto-detect (no user input)
Read .claude/design-tokens.json— project tokens, if exist → loadBash(ls ~/.claude/design-systems/ 2>/dev/null)— org-level registry. If the brief mentions a brand name matching a folder → auto-apply it (e.g. brief "Acme deck" +~/.claude/design-systems/acme/→ use Acme)Glob **/tailwind.config.* **/theme.{ts,js,json} **/tokens.{css,scss} **/_variables.*at project root — if found, note "codebase detected" andReadthem- Scan user message/attachments for:
- GitHub URL → invoke
Skill: ingest-githubfirst - Figma URL → invoke
Skill: ingest-figmafirst - Image attachment → invoke
Skill: ingest-screenshotfirst .md/.txt/.pdffile attached →Readit (may contain brand refs or content)
- GitHub URL → invoke
More from bluzir/claude-code-design
export-pptx
Export an HTML deck to PPTX via per-slide screenshots. Requires Node + pptxgenjs + puppeteer (run /doctor first).
11doctor
First-run setup + health check. Verifies Chrome DevTools MCP, installs optional deps (monolith, pptxgenjs, puppeteer), creates working dirs, runs smoke test. Use on fresh clone or when things feel broken.
10wireframe
Explore 3+ design variations in low-fi/greyscale on a labeled canvas for comparison. Use when user asks for wireframes, lo-fi, ideas, variants, sketches, many options.
10animated-video
Build animated motion design (explainer, transition reel, product intro). Uses Stage/Sprite timeline from animations.jsx for in-browser compositions or Remotion for full video/MP4 workflows.
10make-tweakable
Add an in-artifact floating Tweaks panel that lets the user adjust colors, fonts, spacing, layout variants live in the preview. Persists via claude-pipe pattern (pending.yaml + apply-tweaks skill).
10interactive-prototype
Build a hi-fi clickable React prototype with realistic device chrome. Triggered by "prototype", "clickable", "app mockup", "interactive demo".
10