# Spacex Ppt Skill

> Create minimalist, cinematic presentation decks in the style of the SpaceX IPO roadshow — pure-black slides, full-bleed photography faded into black with gradient scrims, uppercase light-weight headlines, and big white stat numbers. Use whenever the user wants a presentation/slide deck/pitch deck in a "SpaceX style", "minimalist black", "cinematic", "roadshow", or "Apple-keynote-like" aesthetic, or asks to turn an outline, topic, or content into such slides. The skill fetches and color-grades cohesive theme photography from Pexels and renders the deck to PDF + PNGs via headless Chrome.

- Skill: `zhanlincui/spacex-ppt-skill` (Agent Skill, multi-file: 18 files)
- Install (CLI): `npx skillmds@latest add zhanlincui/spacex-ppt-skill`
- Raw SKILL.md: https://api.skillmd.com/api/skills/zhanlincui/spacex-ppt-skill/raw
- Safety review: pending
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Docs & Writing
- Author: ZhanlinCui (https://skillmd.com/u/zhanlincui)
- Updated: 2026-09-17
- Page: https://skillmd.com/skills/zhanlincui/spacex-ppt-skill

---


# SpaceX-Style Deck

Turn a topic or outline into a cinematic, minimalist black deck. The output is an
HTML deck rendered to **PDF + per-slide PNGs** (not an editable .pptx — by design,
for pixel-perfect fidelity).

## How the look works (read this first)
The aesthetic is **restraint + consistency**: pure-black slides, one full-bleed
photo per slide faded into black with a **gradient scrim**, **UPPERCASE light
headlines** with wide tracking, white stat numbers, thin 1px rules, lots of
negative space, and **no accent color** (all color comes from the photos). Full
rules, the scrim technique, and the layout catalog are in
**`references/design_system.md`** — read it before authoring slides.

## Workflow

### 0. Check runtime dependencies
If this is the first run in a fresh Python environment, install the bundled
requirements from the skill folder:
```
python -m pip install -r requirements.txt
```
The render path also needs Chrome or Edge; set `CHROME_PATH` only if auto-detect
fails.

### 1. Establish content + ONE visual theme
Get the deck's content (topic, outline, or raw notes) and pick a **single photo
theme** that runs through the whole deck. **Default to dramatic natural-world
photography** — ocean/coastline, desert, mountains, glaciers, fog, night sky,
aerial earth — which is what produces the cinematic look. Avoid generic
corporate/office and abstract 3D stock (it breaks the aesthetic); even for an
abstract topic, wrap it in a natural theme. One theme + one color family is what
makes it cohere. If the theme isn't obvious, propose one (ocean is a safe pick)
and confirm.

### 2. Outline the slides and assign layouts
Draft the slide sequence. For each slide, choose a layout from the catalog in
`references/design_system.md` (cover, section divider, split text/photo, stat
stack, metric columns, **product cards**, table, numbered list, full-bleed
bullets, image grid, bar chart, chart+photo, closing). For a "matrix" of items
with multi-word specs, use **product cards** (not metric columns — long values
wrap badly there). Alternate dense and airy slides; keep words few.

### 3. Fetch cohesive imagery
Count how many photos the deck needs, then fetch them in one theme. The script
darkens + desaturates and prefers darker frames so white text reads:
```
python scripts/fetch_images.py --query "<theme + mood words>" --count <n> \
    --orientation landscape --out <deckdir>/images
```
Use `--orientation portrait` for split/numbered layouts, and `--duotone "#0c1622"`
(same hex deck-wide) if a mixed set needs stronger unification. See the
"Image strategy" section of the reference for query and treatment tips.

**API key (first run):** the script needs a Pexels key. If none is configured it
exits with instructions. When that happens, tell the user to create a **free**
key at **https://www.pexels.com/api/** (instant, ~1 min) and paste it into
`scripts/pexels_key.txt` (or set the `PEXELS_API_KEY` env var). The key is a
secret — never commit it or share a packaged `.skill` that contains a real key;
distribute with the placeholder `pexels_key.txt` and let each user add their own.

### 4. Assemble the deck
Copy `assets/template.html` to `<deckdir>/deck.html` and adjust the stylesheet
link so it resolves (e.g. point `<link>` at this skill's `assets/css/deck.css`,
or copy the `assets/` folder next to the deck). Keep `images/` and `logo.svg`
paths resolvable. Then, for each planned slide, copy the matching
`<section class="slide">` from the template and swap in real text and image
paths. Delete unused layouts; duplicate the ones you reuse. **Never nest
`<section>` inside a slide.** Obey the non-negotiable rules — if tempted to add a
color, a box, or a third paragraph, don't.

### 5. Render
```
python scripts/render_deck.py <deckdir>/deck.html --out <deckdir>/out --scale 2
```
Produces `out/slide_*.png` and `out/deck.pdf`. The renderer auto-detects clipped
content and prints `⚠ CONTENT OVERFLOW` for any slide whose text/elements run
past the edge — **you must resolve every overflow warning before delivering**
(cut words, add columns, switch to cards, or split the slide). Then inspect the
PNGs and fix any muddy-text issues (strengthen the scrim, re-crop the photo) —
see the troubleshooting section of the reference.

### 6. Deliver
Give the user the PDF and PNG folder. Keep `images/CREDITS.txt` with the output
(Pexels attribution).

## Bundled resources
- `assets/css/deck.css` — the complete design system (compose with its classes; don't fight it).
- `assets/template.html` — renderable gallery of all 12 layouts; the copy-paste source.
- `assets/fonts/`, `assets/logo.svg` — bundled fonts (offline) and corner mark.
- `requirements.txt` — Python dependencies for image fetching and PDF assembly.
- `scripts/fetch_images.py` — Pexels fetch + color-grade for cohesion.
- `scripts/render_deck.py` — HTML → PNG/PDF via headless Chrome.
- `references/design_system.md` — rules, scrim guide, layout catalog, troubleshooting.