new-presentation

name	new-presentation
description	Full guided workflow for creating a LazySlides presentation from scratch — gathers requirements, builds an outline, maps templates, and generates index.md.
when_to_use	Use when the user wants to create a new presentation or start a new deck from scratch.
allowed-tools	["Read","Write","Edit","Bash"]
user-invocable	true
effort	high

Create New Presentation

You are helping the user create a new presentation in this Eleventy + Reveal.js presentation system.

Step 1: Gather Basic Information

Ask the user for:

1. Presentation name (required) - will be used for folder name (kebab-case)
2. Presentation date (optional) - format: MMYYYY (e.g., 032026 for March 2026)

Create the folder at presentations/{name}-{date}/ or presentations/{name}/ if no date provided.

Step 2: Check for Outline

Ask the user if they have an outline.md file to supply.

If NO outline exists:

Help them create one by gathering:

1. Audience - Who will be watching this presentation?
2. Purpose - What's the goal? (inform, persuade, teach, pitch, etc.)
3. Speaker background - What gives the speaker credibility on this topic?
4. Key points - What are the 3-5 main messages they want to convey?
5. Desired structure - Do they have a mental model? (problem/solution, journey, comparison, etc.)
6. Time constraint - How long is the presentation? (affects slide count)

Use this information to draft an outline.md in the presentation folder with this structure:

# [Presentation Title]

## Metadata
- **Audience:** [description]
- **Purpose:** [goal]
- **Speaker:** [name and background]
- **Duration:** [estimated time]

## Key Messages
1. [message 1]
2. [message 2]
3. [message 3]

## Outline

### Section 1: [Section Name]
Purpose: [why this section exists]

#### Slide 1.1: [Slide Title]
- **Key point:** [main takeaway]
- **Notes:** [what to say]
- **Visual idea:** [optional visualization concept]

#### Slide 1.2: [Slide Title]
...

### Section 2: [Section Name]
...

If outline IS supplied:

Review it and confirm:

• Does it have clear sections?
• Does each slide have a key point?
• Is there enough detail to select templates?

If not, iterate with the user to fill in gaps.

Step 3: Map Slides to Templates

Review each slide in the outline and propose a template. The available templates are in _includes/slides/:

Template	Best For
title	Opening slide with logo, title, subtitle, author
section	Section dividers within the presentation
agenda	Table of contents with clickable section links
content	Standard bullet points with optional lead text
center	Image or statement centered inside the slide — correct choice for image-only slides
hero	Full-browser-background image (bleeds outside slide) with headline text — NOT for image-only slides
metrics	2-4 key statistics with colored cards
comparison	Before/after or two-column comparison table
columns	Side-by-side content columns
split	1/3 image + 2/3 content layout
split-wide	1/3 content + 2/3 image layout
quote	Testimonial or quotation with attribution
timeline	Horizontal timeline with events
funnel	Sales/conversion funnel visualization
table	Data table with headers
code	Code snippet with syntax highlighting
image-overlay	Full-browser-background image (bleeds outside slide) with positioned text box — NOT for image-only slides
diagram	D2 diagram compiled to inline SVG

Read each template file's docblock comment for exact YAML structure and options.

Present your template recommendations to the user in a table:

| Slide | Title | Proposed Template | Rationale |
|-------|-------|-------------------|-----------|
| 1.1   | ...   | title             | Opening   |

Iterate until the user approves. Then update outline.md with a template: field for each slide.

Step 4: Research & Enrichment (Optional)

If the user wants, help enrich the outline with:

• Statistics and citations
• Industry data
• Competitor analysis
• Supporting examples

Add references to the outline as you find them.

Step 5: Create index.md

Once the outline is finalized, create presentations/{folder}/index.md with the full YAML frontmatter.

Required frontmatter structure:

---
title: [Presentation Title]
description: [Subtitle or tagline]
author: [Speaker Name]
theme: default
transition: slide
progress: true
slideNumber: true
show_footer: true
slides:
# Slide 1: [Title]
- template: [template_name]
  title: [slide title]
  # ... template-specific fields from docblock
  notes: |
    [speaker notes from outline]
---

Note: Do NOT include layout: presentation — this is set automatically by the directory data file.

For each slide:

1. Read the template docblock in _includes/slides/{template}.njk
2. Map outline content to the template's required/optional fields
3. Add speaker notes from the outline
4. Add references if provided

Image handling:

Whenever a slide involves an image, work through these two decisions before writing any YAML.

Decision 1 — Image placement

Ask the user:

"Should this image fill the entire browser behind the slide (dramatic full-bleed effect), or display inside the slide as content?"

Intent	Template	How it works
Image inside the slide	center with image:	Renders as <img> constrained to slide dimensions
Image + text side by side	split or split-wide	<img> in a panel
Full-browser background with text on top	hero or image-overlay	Reveal.js data-background-image — fills the whole browser window, not just the slide area

Warning: hero and image-overlay set the image as a browser-wide background via Reveal.js data-background-image. In windowed or embedded mode the image bleeds outside the slide frame into white space. Only use these when you deliberately want that effect.

Decision 2 — Image sourcing

Ask the user:

"Will you supply the image file, or should I search for one?"

• User supplies: Leave a # TODO: add image comment in the YAML where the image: field goes. Do NOT create any placeholder file. Do not put anything in image: yet.
• Claude searches: Search Wikimedia Commons (or similar public domain sources) for a suitable photo. Download the actual file directly into images/ inside the presentation folder before writing the YAML. Confirm the file is a valid, non-zero-byte image before referencing it.

Dev server / passthrough copy rules

Never create placeholder image files with touch or any other method that produces 0-byte files. The Eleventy dev server passthrough-copies files at startup — empty files get written to _site and the watcher will not update them when real images arrive later.

Always download or copy real image files before starting the dev server, or restart the dev server after adding images.

After adding images, verify _site/presentations/{name}/images/ contains non-zero files (ls -lh). If files are 0 bytes, restart the dev server.

Step 6: Validate

After creating index.md, run the validation:

pnpm run validate

Fix any errors before finishing.

Step 7: Preview

Suggest the user run:

pnpm run dev

Then navigate to the presentation URL to preview.

---

Template Quick Reference

When creating slides, always read the full docblock in the template file. Here are the key patterns:

Nested lists (content, split, split-wide templates):

items:
  - "Regular item"
  - "Parent with children:":
      - "Child 1"
      - "Child 2"

References:

reference: "Source Name 2025"
reference_link: "https://..."
# OR for multiple:
references:
  - name: "Source 1"
    link: "https://..."
  - name: "Source 2"
    link: "https://..."

Metrics colors:

mint, coral, icy, amber (or omit for default mauve)

Comparison highlight:

highlight: left | highlight: right (default) | highlight: none

Hero backgrounds:

image: images/background.jpg
# OR
color: "#1a1a2e"