| name | slides-grab |
| description | End-to-end presentation workflow usable in Codex and Claude Code. Use when making a full presentation from scratch — planning, designing slides, editing, and exporting. PDF and per-slide PNG are preferred; PPTX/Figma export is experimental / unstable. |
| metadata | {"short-description":"Full pipeline from topic to PDF/PNG + experimental / unstable PPTX/Figma export"} |
slides-grab Skill - Full Workflow Orchestrator
Guides you through the complete presentation pipeline from topic to exported file.
Workflow
Stage 1 — Plan
Use the installed slides-grab-plan skill.
- Take user's topic, audience, and tone.
- Style selection (mandatory before outline): Run
slides-grab list-styles, analyze the topic/tone, and shortlist 2–3 bundled styles that fit. Present the shortlist with reasons. Optionally offer slides-grab preview-styles for visual preview. If none of the 35 bundled styles fit, propose a fully custom visual direction. Get explicit style approval before writing the outline.
- Create
slide-outline.md with the chosen style ID in the meta section (style: <id>).
- Present outline to user.
- Revise until user explicitly approves.
Do not proceed to Stage 2 without approval of both style and outline.
Stage 2 — Design
Use the installed slides-grab-design skill.
- Read approved
slide-outline.md and apply the style specified in its meta section (style: <id>). Do not re-open style selection — the style was already approved in Stage 1.
- Generate
slide-*.html files in the slides workspace (default: slides/).
- Run validation:
slides-grab validate --slides-dir <path>
- If validation fails, automatically fix the slide HTML/CSS until validation passes.
- For bespoke slide imagery, use
slides-grab image --prompt "<prompt>" --slides-dir <path> so the default god-tibo-imagen provider (reuses local Codex ChatGPT login — no API key required) saves a local asset under <slides-dir>/assets/.
- For complex diagrams (architecture, workflows, relationship maps, multi-node concepts), prefer
tldraw over hand-built HTML/CSS diagrams. Render the asset with slides-grab tldraw, store it under <slides-dir>/assets/, and place it in the slide with a normal <img>.
- For quantitative slides, use Chart.js as the default charting library. Start from
templates/chart.html when useful, keep chart scripts inside each slide-*.html, set animation: false, responsive: true, and maintainAspectRatio: false, and size every <canvas> with a stable wrapper so validation can inspect real painted pixels.
- Keep local videos under
<slides-dir>/assets/, prefer poster="./assets/<file>" thumbnails, and use slides-grab fetch-video --url <youtube-url> --slides-dir <path> (or yt-dlp directly) when the source starts on a supported web page.
- The default provider, god-tibo-imagen, reuses the local Codex ChatGPT login (
~/.codex/auth.json) — run codex login once; no API key required. ⚠️ god-tibo-imagen uses an unsupported private Codex backend that may break without notice. Optional alternatives: --provider codex (Codex/OpenAI gpt-image-2 via OPENAI_API_KEY; maps --aspect-ratio to the nearest supported OpenAI image size; --image-size 2K|4K is Nano Banana-only) or --provider nano-banana (Google gemini-3-pro-image-preview via GOOGLE_API_KEY or GEMINI_API_KEY; supports --image-size 2K|4K). If credentials are unavailable, fall back to web search/download into <slides-dir>/assets/.
- Run the design gate as an adversarial quality loop before presenting the deck (
skills/slides-grab-design/references/design-gate.md): capture render evidence (slides-grab png … --output-dir <path>/gate-preview), dispatch two parallel read-only reviewer passes when the current runtime supports subagents/tasks (A: System Contract / Constraint Integrity, B: Audience Impact / Expressive Readability), and synthesize contract coherence against audience impact into one Design Gate Report with a verdict. If subagents are unavailable, run the same two passes sequentially from the bundled reference. Review Litmus is the shared audience-success tie-breaker, not a third pass. Resolve every Critical finding (unreadable text, palette violation, AI slop trope as a slide's primary treatment, key slide with no visual anchor, invented data), re-run validate, capture fresh PNGs, and re-run both adversarial passes until the latest rendered state reaches Proceed or requires Rethink approach. For Proceed, the Pass A/B reports must follow the CLI-enforced structure in slides-grab-design/references/design-gate.md (role title, VERDICT: PASS, confidence, rendered PNG evidence filenames, current slide-*.html: <sha256> fingerprints, Unresolved Critical: 0, Blocking findings: None, findings table, and required checks marked PASS). When the verdict is Proceed, record the export-unlocking receipt with slides-grab design-gate --slides-dir <path> --verdict proceed --pass-a-report <pass-a.md> --pass-b-report <pass-b.md>. If the CLI rejects the reports, continue the fix → validate → render → A/B review loop. Track deferred Minor/Note in <slides-dir>/design-debt.md.
- Launch the interactive editor for review:
slides-grab edit --slides-dir <path>
- For decks with Chart.js or other
<canvas> charts, also build the viewer (slides-grab build-viewer --slides-dir <path>) and visually confirm the charts render in viewer.html; validation reports empty-canvas when a visible canvas has no painted pixels.
- Revise slides based on user feedback via the editor, then re-run validation and the design gate after each edit round that changes layout, color, typography, imagery, or content density.
- When the user confirms editing is complete, suggest next steps: build the viewer (
slides-grab build-viewer --slides-dir <path>) for a final preview, or proceed directly to Stage 3 for PDF/PPTX export.
Do not proceed to Stage 3 without approval, and never while any Critical design-gate finding is unresolved.
Stage 3 — Export
Use the installed slides-grab-export skill.
- Confirm user wants conversion.
- Pick the primary target:
- Card-news / Instagram-style decks →
slides-grab png --slides-dir <path> --slide-mode card-news --resolution 2160p (see slides-grab-card-news).
- Widescreen decks →
slides-grab pdf --slides-dir <path> --output <name>.pdf.
- Per-slide PNG (any mode):
slides-grab png --slides-dir <path> --output-dir <path>/out-png --resolution 2160p.
- PPTX (optional, experimental / unstable):
slides-grab convert --slides-dir <path> --output <name>.pptx.
- Figma-importable PPTX (optional, experimental / unstable):
slides-grab figma --slides-dir <path> --output <name>-figma.pptx.
- Report results.
Rules
- Always follow the stage order: Plan → Design → Export.
- Get explicit user approval before advancing to the next stage.
- Pass the design gate before export: Stage 2 must end with a Design Gate Report whose verdict is
Proceed (zero unresolved Critical findings) on the latest rendered state before the deck advances to Stage 3. The gate (skills/slides-grab-design/references/design-gate.md) runs after slides-grab validate; use runtime-native subagents/tasks for Pass A/B when available, or run the same bundled procedure sequentially. Record the latest Proceed verdict with slides-grab design-gate; slides-grab pdf, slides-grab convert, and slides-grab figma block if that receipt is missing, stale, or backed by Pass A/B reports that fail the CLI-enforced report contract. Any fix requires fresh PNG evidence and another Pass A/B challenge. Critical hard-blocks export; Major findings are listed for user acceptance; Minor/Note findings may be tracked in the design-debt log.
- Read each stage's SKILL.md for detailed rules — this skill only orchestrates.
- Use
decks/<deck-name>/ as the slides workspace for multi-deck projects.
- Call out export risk clearly: PPTX and Figma export are experimental / unstable and must be described as best-effort output.
- Use the stage skills as the source of truth for plan, design, and export rules.
- When a slide needs a complex diagram, default to a
tldraw-generated asset unless the user explicitly asks for a different approach.
- When a slide needs bespoke imagery, prefer the default god-tibo-imagen provider via
slides-grab image (reuses local Codex ChatGPT login — no API key required) and keep the saved asset local under <slides-dir>/assets/.
- When a slide needs a chart, default to Chart.js in-slide canvas rendering and require
slides-grab validate plus slides-grab build-viewer review so blank canvases are caught before export.
Reference
references/presentation-workflow-reference.md — archived end-to-end workflow guidance from the legacy skill set