From 8f2e0541da81e971c33f41a40804f6235a238d40 Mon Sep 17 00:00:00 2001 From: Vance Ingalls Date: Mon, 27 Jul 2026 14:54:51 -0700 Subject: [PATCH] docs(prompting): capstone threads quote the verbatim prompt clause that buys each region --- docs/prompting/anatomy.mdx | 4 ++++ docs/prompting/captions-catalog.mdx | 5 +++++ docs/prompting/code-blocks.mdx | 5 +++++ docs/prompting/data-and-maps.mdx | 7 +++++++ docs/prompting/design-systems.mdx | 5 +++++ docs/prompting/generated-artwork.mdx | 5 +++++ docs/prompting/iterating.mdx | 4 ++++ docs/prompting/media-and-audio.mdx | 5 +++++ docs/prompting/motion.mdx | 4 ++++ docs/prompting/music-and-slideshows.mdx | 5 +++++ docs/prompting/overlays-and-lower-thirds.mdx | 5 +++++ docs/prompting/rendering-and-output.mdx | 5 +++++ docs/prompting/runtimes-and-3d.mdx | 5 +++++ docs/prompting/storyboards.mdx | 5 +++++ docs/prompting/transitions.mdx | 5 +++++ docs/prompting/variables-and-templating.mdx | 6 ++++++ docs/prompting/vfx-and-liquid-glass.mdx | 5 +++++ 17 files changed, 85 insertions(+) diff --git a/docs/prompting/anatomy.mdx b/docs/prompting/anatomy.mdx index a8a4eb605..c440472d2 100644 --- a/docs/prompting/anatomy.mdx +++ b/docs/prompting/anatomy.mdx @@ -80,4 +80,8 @@ The fixes that come up most, as before/after pairs — each exists because of ho **Capstone thread** — the [Level 7 capstone](/prompting/capstone) prompt is this skeleton at maximum scale — route, spec, beats (its nine regions), copy quoted exactly, technique pinned per region, and a hard negative list. The chapters between here and there each teach one clause of it; the capstone is where they compose. +This is the clause in the [full capstone prompt](/prompting/capstone#the-full-prompt-verbatim) that buys the piece — prompt language you can lift for your own video: + +> **Message, stated once:** "Write HTML. Render video." — opening hook and closing lockup. Arc: Type → Mount → Measure → Everywhere → Material → Surface → Rhythm → Depth → Render. Audience: developers evaluating a programmable video tool. Mood: focused build-up that keeps accelerating, resolving confident and warm at the render. + *Next: [The specification dial](/prompting/specification-dial) — how much of the skeleton to fill in, and when density stops being optional.* diff --git a/docs/prompting/captions-catalog.mdx b/docs/prompting/captions-catalog.mdx index 48c00e21c..45d8d71e1 100644 --- a/docs/prompting/captions-catalog.mdx +++ b/docs/prompting/captions-catalog.mdx @@ -96,6 +96,11 @@ Three [Text Effects](/catalog/components/morph-text) components do one focused j **Capstone thread** — in the [Level 7 film](/prompting/capstone)'s Material region, word-synced keywords from the clip's own transcription slam in as display type behind the matted-out speaker — captions as scenography, on real word timings (0:28–0:36 below, cut from the film). +This is the clause in the [full capstone prompt](/prompting/capstone#the-full-prompt-verbatim) that buys the piece — prompt language you can lift for your own video: + +> THEN they speak, and the main **keywords of their own line — derived from the clip's transcription — land word-synced as huge display text BEHIND the cutout**, each keyword slamming in on its spoken moment with the subject's silhouette occluding it (the two-layer text-behind-subject plate); style the keyword type by adapting a bold **catalog caption component** (`caption-kinetic-slam` or similar) at display scale. + +*That clause, rendered — the region cut from the finished film.* *Next: [When to generate artwork](/prompting/generated-artwork) — where hand-drawn HTML/CSS/SVG wins, and where a generated image beats it.* diff --git a/docs/prompting/code-blocks.mdx b/docs/prompting/code-blocks.mdx index cc3ff721a..7c0a79ca5 100644 --- a/docs/prompting/code-blocks.mdx +++ b/docs/prompting/code-blocks.mdx @@ -140,6 +140,11 @@ When the code you're animating comes from a real PR, don't hand-write the beats **Capstone thread** — the [Level 7 film](/prompting/capstone) opens with this chapter's technique: real HyperFrames markup typed character by character, and the typed line's baseline literally grows into the timeline wire the rest of the film travels (0:00–0:07 below, cut from the film). +This is the clause in the [full capstone prompt](/prompting/capstone#the-full-prompt-verbatim) that buys the piece — prompt language you can lift for your own video: + +> **Type (0–7s).** Black-on-charcoal close-up: a cursor types real HyperFrames markup character by character — `
` and a `gsap.timeline({ paused: true })` line. As the typed line completes, the text's baseline extends and becomes **the wire** — the underline literally grows into the timeline and the camera begins its dolly along it. The typed div folds into a compact clip chip (persistent element 3) that drops onto the wire. Kinetic display type states "WRITE HTML." as the travel begins. + +*That clause, rendered — the region cut from the finished film.* *Next: [Data and maps](/prompting/data-and-maps) — the same named-block, quoted-copy pattern, for charts, stats, and maps instead of code.* diff --git a/docs/prompting/data-and-maps.mdx b/docs/prompting/data-and-maps.mdx index 3996f5d7b..b4b37398c 100644 --- a/docs/prompting/data-and-maps.mdx +++ b/docs/prompting/data-and-maps.mdx @@ -92,6 +92,13 @@ For a point-to-point journey — a route drawing across a map with a landing bea **Capstone thread** — the [Level 7 film](/prompting/capstone)'s Measure and Everywhere regions are this chapter end to end: `data-chart` bars rise from the timeline wire while the hero count lands, then the same wire becomes a great-circle arc over the `world-map` block's real cloud render regions (0:14–0:28 below, cut from the film). +This is the clause in the [full capstone prompt](/prompting/capstone#the-full-prompt-verbatim) that buys the piece — prompt language you can lift for your own video: + +> **Measure (14–21s).** The wire becomes a chart baseline (same line, same thickness — no cut): adapt the **`data-chart` registry block** — six labeled bars rise from the wire itself on spoken cues while a hero numeral counts up beside them in huge tabular mono: **50+ CATALOG BLOCKS** (the real registry count) […] +> +> **Everywhere (21–28s).** The wire arcs and the ground falls away: adapt the **`world-map` registry block** — the dotted world map scrolls beneath while the wire becomes a great-circle route arcing across it. Real render infrastructure, truthfully labeled: pulses light up at AWS and Google Cloud regions (US-EAST-1 · EU-WEST-1 · AP-SOUTH-1) with a "CLOUD RENDER · LAMBDA + CLOUD RUN" kicker […] + +*That clause, rendered — the region cut from the finished film.* *Next: [Overlays and lower thirds](/prompting/overlays-and-lower-thirds) — naming timed blocks that sit above your footage or scene, instead of ones that render the scene itself.* diff --git a/docs/prompting/design-systems.mdx b/docs/prompting/design-systems.mdx index d58e4f395..6fc19c2be 100644 --- a/docs/prompting/design-systems.mdx +++ b/docs/prompting/design-systems.mdx @@ -93,6 +93,11 @@ The engine rationale: a workflow's preset is a coherent, tested system — color **Capstone thread** — the entire [Level 7 film](/prompting/capstone) obeys a supplied `frame.md` — the real HyperFrames brand. The closing lockup is where the system shows most: ABC Solar Display for the display type and the mint→cyan CTA gradient in its single sanctioned appearance (0:56–1:02 below, cut from the film). +This is the clause in the [full capstone prompt](/prompting/capstone#the-full-prompt-verbatim) that buys the piece — prompt language you can lift for your own video: + +> **Design system: the provided `frame.md` is the single source of brand truth — read it first and obey it exactly.** It is the real HyperFrames brand (by HeyGen), dark-first: flat near-black ground […] **mint `#3CE6AC` used sparingly as the single accent — mint means go / primary / active**. The mint→cyan gradient (`#3CE6AC → #00E3FF`) appears in exactly one place in the whole film: the final CTA lockup. + +*That clause, rendered — the region cut from the finished film.* *Next: [Variables and templating](/prompting/variables-and-templating) — turn the brand tokens that repeat across a series into named slots you fill per render.* diff --git a/docs/prompting/generated-artwork.mdx b/docs/prompting/generated-artwork.mdx index 61501024c..152e51137 100644 --- a/docs/prompting/generated-artwork.mdx +++ b/docs/prompting/generated-artwork.mdx @@ -29,6 +29,11 @@ The same brief — four people arm in arm, warm gradient sweaters, flat-illustra **Capstone thread** — the [Level 7 film](/prompting/capstone)'s Surface region rides on generated artwork: a palette-neutral mural duotoned live by CSS from the composition's two variables, so even the raster re-skins on a `--variables` render (0:38–0:45 below, cut from the film). +This is the clause in the [full capstone prompt](/prompting/capstone#the-full-prompt-verbatim) that buys the piece — prompt language you can lift for your own video: + +> […] over a **generated-artwork backdrop** — a flat abstract mural evoking motion trails, generated **palette-neutral (grayscale) and duotoned live by CSS** from the two variables so it re-skins with everything else. **The mural is a full-frame, screen-fixed backdrop: it never moves on screen — the widening iris circle alone reveals it already in place at full frame […] and it exits by fading out.** + +*That clause, rendered — the region cut from the finished film.* *Next: [VFX and liquid glass](/prompting/vfx-and-liquid-glass) — device mockups, frosted glass, and cinematic effects for when the layer on top needs its own spectacle.* diff --git a/docs/prompting/iterating.mdx b/docs/prompting/iterating.mdx index 839d425ee..91c469edd 100644 --- a/docs/prompting/iterating.mdx +++ b/docs/prompting/iterating.mdx @@ -41,4 +41,8 @@ And freeze what already works: "the framing and motion are right — don't touch **Capstone thread** — several clauses in the [Level 7 film](/prompting/capstone)'s prompt exist only because frame review caught the builder drifting — the chip's hard bind to the wire, the pinned mural, the Depth region's occlusion contract. Each catch was folded back into the prompt so the next run can't regress: this chapter's loop, applied to the prompt itself. +This is the clause in the [full capstone prompt](/prompting/capstone#the-full-prompt-verbatim) that buys the piece — prompt language you can lift for your own video: + +> **The chip sits ON the wire at every moment: bind its position to the wire's actual path geometry (sample the drawn path, seek-safe), never keyframe it independently — through every bend, arc, waveform, and dive, the chip visibly hugs the line. A chip floating off-path breaks the story.** + *Next: [Recreating something you saw](/prompting/recreating-references) — the same absolute-target discipline, applied to matching a specific reference frame by frame.* diff --git a/docs/prompting/media-and-audio.mdx b/docs/prompting/media-and-audio.mdx index 752f60484..03367e364 100644 --- a/docs/prompting/media-and-audio.mdx +++ b/docs/prompting/media-and-audio.mdx @@ -120,6 +120,11 @@ This mirrors the negatives discipline in [Anatomy](/prompting/anatomy): close th **Capstone thread** — the [Level 7 film](/prompting/capstone)'s Material region runs this chapter's entire pipeline on one clip: generated footage → HEVC auto-proxy → background removal mid-scene → word-synced captions from the clip's own transcription, with the clip's audio ducking the BGM (0:28–0:36 below, cut from the film). +This is the clause in the [full capstone prompt](/prompting/capstone#the-full-prompt-verbatim) that buys the piece — prompt language you can lift for your own video: + +> […] a real talking-head clip (generate a short clip of a person speaking one neutral line via the media pipeline's avatar video generation […] **transcode it to HEVC `hvc1`** so the automatic proxy subsystem carries preview) sits as a clip on the wire. The order of operations IS the story: as the camera arrives and BEFORE the person speaks, the framework mattes the footage — **the background peels away via background removal** […] THEN they speak, and the main **keywords of their own line — derived from the clip's transcription — land word-synced** […] The clip's own audio ducks the BGM briefly; the VO resumes as the camera pulls away. + +*That clause, rendered — the region cut from the finished film.* *Next: [Design systems and brand](/prompting/design-systems) — pointing the agent at a source of brand truth instead of describing a vibe.* diff --git a/docs/prompting/motion.mdx b/docs/prompting/motion.mdx index fe9f596e6..a6229e899 100644 --- a/docs/prompting/motion.mdx +++ b/docs/prompting/motion.mdx @@ -17,6 +17,10 @@ By now you can specify a frame precisely — exact copy, exact colors, exact lay **Capstone thread** — rule 2 taken to its logical end is the spine of the [Level 7 film](/prompting/capstone): one continuous camera journey with full dwells at the hero moments. This is that camera mid-flight — accelerating out of one region, arriving and stopping in the next (0:11–0:21 of the film, cut in isolation). Rule 7 shows up there too: the film's closing confetti is seeded with a two-frame hold. +This is the clause in the [full capstone prompt](/prompting/capstone#the-full-prompt-verbatim) that buys the piece — prompt language you can lift for your own video: + +> ONE continuous camera journey with a dwell-and-sweep rhythm. The whole film is a single wide world (one large scene space) that the camera dollies across […] in one unbroken move with NO hard cuts anywhere except inside the two sanctioned seam moments named below. The rhythm: the camera SWEEPS between regions, then eases to a genuine REST at each region's hero moment — a full stop of roughly 1.5–2.5 seconds while the main point lands […] then accelerates away. The dwell is what gives the sweep meaning: without the rest, emphasis dies mid-motion. During a dwell the WORLD keeps resolving (counters tick, labels stamp, secondary motion continues) — the camera rests, the film never freezes. + *The capstone's camera: never cutting, easing through arrivals, stopping only to let a beat land.* diff --git a/docs/prompting/music-and-slideshows.mdx b/docs/prompting/music-and-slideshows.mdx index 02a66b5f9..068bb0e2f 100644 --- a/docs/prompting/music-and-slideshows.mdx +++ b/docs/prompting/music-and-slideshows.mdx @@ -84,6 +84,11 @@ What you can already steer from the prompt, before you've learned any technique. **Capstone thread** — the [Level 7 film](/prompting/capstone)'s Rhythm region cuts media cards onto a real analyzed beat grid from `hyperframes beats` — the film's only sanctioned hard cuts, every one on a detected beat while the camera keeps traveling (0:45–0:52 below, cut from the film). +This is the clause in the [full capstone prompt](/prompting/capstone#the-full-prompt-verbatim) that buys the piece — prompt language you can lift for your own video: + +> **Rhythm (45–52s).** The wire becomes a waveform: **resolve the BGM first, run `hyperframes beats` on it, and drive this region on the detected grid** — the waveform pulses and compact media cards (a lyric line, a photo card, a chart flash) snap onto the wire on real analyzed beats while the camera keeps traveling; each snap gets a tick SFX. At least six beat-hits. SANCTIONED SEAM #2: the beat-hits may hard-cut card content ON the beat — the sanctioned exception, because the camera itself never stops moving through them. + +*That clause, rendered — the region cut from the finished film.* *Next: [Motion graphics](/prompting/motion-graphics) — the shortest one yet, a single motion graphic where motion alone is the message.* diff --git a/docs/prompting/overlays-and-lower-thirds.mdx b/docs/prompting/overlays-and-lower-thirds.mdx index 1924db5c3..22eaa89d9 100644 --- a/docs/prompting/overlays-and-lower-thirds.mdx +++ b/docs/prompting/overlays-and-lower-thirds.mdx @@ -108,6 +108,11 @@ Quote the exact copy — unquoted names and titles get paraphrased (see [anatomy **Capstone thread** — the [Level 7 film](/prompting/capstone)'s Material region docks a designed lower-third chip that renders *behind* the matted-out subject (0:28–0:36 below, cut from the film). +This is the clause in the [full capstone prompt](/prompting/capstone#the-full-prompt-verbatim) that buys the piece — prompt language you can lift for your own video: + +> […] the main **keywords of their own line — derived from the clip's transcription — land word-synced as huge display text BEHIND the cutout**, each keyword slamming in on its spoken moment with the subject's silhouette occluding it (the two-layer text-behind-subject plate) […] A designed lower-third chip renders behind the subject. + +*That clause, rendered — the region cut from the finished film.* *Next: [Caption styles](/prompting/captions-catalog) — the same timed-block pattern, tuned to on-screen text instead of name cards and social replicas.* diff --git a/docs/prompting/rendering-and-output.mdx b/docs/prompting/rendering-and-output.mdx index 4d49929ab..58373c236 100644 --- a/docs/prompting/rendering-and-output.mdx +++ b/docs/prompting/rendering-and-output.mdx @@ -118,6 +118,11 @@ The cheapest way to avoid a wasted `high`/4K/HDR render is to judge the frame fi **Capstone thread** — the [Level 7 film](/prompting/capstone) ends on this chapter's core promise: the protagonist chip snaps into a render slot and seeded confetti holds every piece for exactly two frames — deterministic, identical on every render (0:56–1:02 below, cut from the film). Its Everywhere region names the real cloud render targets: Lambda and Cloud Run. +This is the clause in the [full capstone prompt](/prompting/capstone#the-full-prompt-verbatim) that buys the piece — prompt language you can lift for your own video: + +> A **seeded confetti burst** fires — mulberry32, **seed 42, each piece holding position for exactly two frames before stepping** (stop-motion feel) — and the VO lands the honest punchline: identical on every render, because determinism is the whole point. + +*That clause, rendered — the region cut from the finished film.* *Next: [Porting from Remotion](/prompting/remotion-migration) — bringing an existing Remotion project into everything you now know.* diff --git a/docs/prompting/runtimes-and-3d.mdx b/docs/prompting/runtimes-and-3d.mdx index d167e5712..f79569c9e 100644 --- a/docs/prompting/runtimes-and-3d.mdx +++ b/docs/prompting/runtimes-and-3d.mdx @@ -90,6 +90,11 @@ The rule of thumb: anything the video needs to *know* must be present before ren **Capstone thread** — the [Level 7 film](/prompting/capstone)'s Depth region is real Three.js through the frame adapter: the timeline wire coils around a rim-lit faceted form, and the protagonist chip threads the coil's loops and passes behind the form with true depth occlusion (0:51–0:58 below, cut from the film). +This is the clause in the [full capstone prompt](/prompting/capstone#the-full-prompt-verbatim) that buys the piece — prompt language you can lift for your own video: + +> **Depth (52–56s).** The wire spirals off the flat plane into real 3D — a **Three.js scene via the frame adapter** (never CSS fake-3D): the camera descends following the wire as it coils around a rim-lit faceted form (ink material on charcoal), mono axis readouts landing on cue, then rises back to the plane with the wire leading the way out. The coil winds up out of the wire and collapses back onto it — its ends never float cut off in mid-air — and the protagonist chip joins the 3D scene for the crossing: it rides the wire straight through the coil's loops and passes behind the form with true depth occlusion, never floating over the geometry as a flat overlay. + +*That clause, rendered — the region cut from the finished film.* *Next: [Media and audio](/prompting/media-and-audio) — precise phrasing for voiceover, music, sound, and assets, instead of motion and rendering.* diff --git a/docs/prompting/storyboards.mdx b/docs/prompting/storyboards.mdx index a66ab2ff8..313a3f6e6 100644 --- a/docs/prompting/storyboards.mdx +++ b/docs/prompting/storyboards.mdx @@ -103,6 +103,11 @@ Without stating the return explicitly, a rebuild is free to treat the early moti **Capstone thread** — the [Level 7 film](/prompting/capstone) stretches this chapter's callback device across its whole runtime: the `
` chip typed in the opening rides the wire through every region and finally snaps into the render slot as the payoff (0:56–1:02 below, cut from the film). +This is the clause in the [full capstone prompt](/prompting/capstone#the-full-prompt-verbatim) that buys the piece — prompt language you can lift for your own video: + +> **The clip card** — the `
` typed in the opening travels the whole journey: it slides onto the wire as a clip chip after being typed, rides ahead of the camera between regions (handing itself off — visible leaving one region and arriving in the next), and is the thing that finally renders at the end. It is the protagonist. + +*That clause, rendered — the region cut from the finished film.* *Next: [Editing existing videos](/prompting/editing-existing-videos) — the editor verbs that turn a first render, storyboard or not, into the twenty edits after it.* diff --git a/docs/prompting/transitions.mdx b/docs/prompting/transitions.mdx index a48d185c3..f56ad2d84 100644 --- a/docs/prompting/transitions.mdx +++ b/docs/prompting/transitions.mdx @@ -94,6 +94,11 @@ Name the block and the seam — transitions are the one place where per-seam con **Capstone thread** — the [Level 7 film](/prompting/capstone) allows itself exactly one shader seam: the camera pushes through an `sdf-iris` lens into the Surface region (0:38–0:45 below, cut from the film) with the timeline wire visible through the iris the whole way — a lens the journey passes through, not a cut. +This is the clause in the [full capstone prompt](/prompting/capstone#the-full-prompt-verbatim) that buys the piece — prompt language you can lift for your own video: + +> SANCTIONED SEAM #1: the camera pushes through an **`sdf-iris` shader transition** — the iris opens ONTO the continuation of the same wire (the wire is visible through the iris throughout; this is a lens the journey passes through, not a cut). + +*That clause, rendered — the region cut from the finished film.* *Next: [Code animations](/prompting/code-blocks) — naming a block and pasting real code for walkthroughs, diffs, and terminal takes.* diff --git a/docs/prompting/variables-and-templating.mdx b/docs/prompting/variables-and-templating.mdx index bf00a04f7..b0b790b5f 100644 --- a/docs/prompting/variables-and-templating.mdx +++ b/docs/prompting/variables-and-templating.mdx @@ -90,4 +90,10 @@ If total length must differ per output, that's a different root `data-duration` **Capstone thread** — the [Level 7 film](/prompting/capstone) is a working template: one single-file composition, one variable scope, and its second render — navy ground, acid-green ink, every region re-skinned including the generated mural — is nothing but one `--variables` flag. Both full renders are embedded on the capstone page. +This is the clause in the [full capstone prompt](/prompting/capstone#the-full-prompt-verbatim) that buys the piece — prompt language you can lift for your own video: + +> **Variables:** expose `ground` (default `#0a0a0a`) and `ink` (default `#3CE6AC`) as composition variables on the single root file, bound via CSS custom properties everywhere (including the duotoned mural), so one `--variables` call re-skins the entire journey. It will be rendered twice: the default brand palette, and a second full render with `{"ground":"#0d1420","ink":"#c8ff3d"}`. +> +> **Architecture constraint (technical):** single composition file — one `index.html`, one variable scope. […] No `data-composition-src` sub-files. + *Next: [Storyboards](/prompting/storyboards) — for multi-scene work, prompt the plan a frame-by-frame build fills in, not the scenes one by one.* diff --git a/docs/prompting/vfx-and-liquid-glass.mdx b/docs/prompting/vfx-and-liquid-glass.mdx index 6d93dc245..28da01455 100644 --- a/docs/prompting/vfx-and-liquid-glass.mdx +++ b/docs/prompting/vfx-and-liquid-glass.mdx @@ -104,6 +104,11 @@ The Effects components above have none of this — they're plain CSS and animate **Capstone thread** — the [Level 7 film](/prompting/capstone)'s Surface region floats its inspector panels on the brand's glass tokens — translucent white over real backdrop blur, the mural visibly smearing through each panel (0:38–0:45 below, cut from the film). +This is the clause in the [full capstone prompt](/prompting/capstone#the-full-prompt-verbatim) that buys the piece — prompt language you can lift for your own video: + +> Inside: frosted-glass inspector panels (real translucency — blur over what's behind; the product's Studio design language) hover above the wire carrying live values (`ease: power3.out`, a color token, an fps readout) […] Glass surfaces use the file's `--glass-*` tokens with real backdrop blur. + +*That clause, rendered — the region cut from the finished film.* *Next: [Runtimes and 3D](/prompting/runtimes-and-3d) — picking GSAP, Three.js, or Lottie by what the moment actually needs, including the real depth these effects render on.*