STORYBOARD.md schema: the workflow translates the plan into the smaller machine-readable shape the build consumes.
Prompt the plan, not the scenes
A storyboard is a short, structured document that sits above the individual frames: one arc, one direction block that every frame inherits, and a light per-frame spec (not a full description) for each key moment. The workflow reads the plan and builds each frame’s HTML sub-composition against it — so a plan that’s precise about the shape of the film produces frames that already agree with each other on pacing, palette, and payoff, without you re-stating any of that per frame. The trigger is naming the arc and asking for a storyboard rather than a single scene:Storyboard a 3-frame piece: hook → substance → landing, silent, ~15 seconds, with a callback that pays off the opening motif.Everything below is the vocabulary that turns “storyboard” from a loose word into a plan the build can execute in one pass.
State the film’s shape once
Before any frame, fix four things that every frame will be judged against:- Message — the one-sentence thesis the whole film has to prove. If a frame doesn’t serve it, cut the frame, not the message.
- Arc — the beat sequence, named plainly:
Hook → Substance → Landing, orHook → Problem → Solution → Proof → CTA, or a shape word like “listicle” if the frames are parallel entries rather than a rising sequence. - Audience — who it’s for, in a phrase. It calibrates tone and jargon for every frame at once.
- Mood — one music/energy descriptor (e.g. “tense synth pulse, resolving to warm”) that every frame’s pacing should agree with, even in a silent piece.
Set the direction once, apply it to every frame
A storyboard’s direction block is the rules every frame obeys without restating them. Four are worth naming explicitly: Two-color discipline. Name a ground color and one ink color, and say the rule out loud: nothing ever gets a second hue for emphasis — a bigger moment is bigger through inversion, weight, scale, or density, not a new color.- ❌
use the brand colors, plus a highlight color for the important bits - ✅
ground: deep navy; ink: warm white. Emphasis = invert, scale up, or go denser — never a third color.
Give each frame a job
With the direction block covering everything shared, each frame’s own prompt only needs to say what’s different about it:persuasion and beat are the two worth never skipping — they’re what stops a frame from being “a scene that shows the stat” and turns it into “a scene that proves the stat, and here’s how it feels to land.” A frame with a named persuasion device and beat gives the build a reason for every choice; a frame with only a visual description gives it none.
The callback
Introduce a motif early — a shape, a mark, a phrase, a piece of color — and have it return later, denser or fuller, as a deliberate payoff. Say both halves in the plan: where the motif is planted, and how it changes when it returns.A single thin accent dot appears top-right in frame 1 at low weight. In the landing frame, that same dot expands and fills into the full logo lockup — same motif, now complete.Without stating the return explicitly, a rebuild is free to treat the early motif as throwaway texture — the callback only works if the plan says the second appearance is the same element, not a new one that resembles it.
Worked example: a silent 3-frame storyboard
Storyboard a 3-frame, ~15-second, 1920x1080 piece. Silent — no narration, no VO track. Message: “Fernwell gives you back the hours other tools take.” Arc: Hook → Substance → Landing. Audience: small-team operators evaluating a new tool. Mood: tense synth pulse resolving to warm. Direction for every frame: ground color deep navyRendered from the prompt above, unedited — no audio track, exactly as asked.#0b1220, ink color warm off-white#f4efe6— nothing else gets a hue; emphasis is inversion, scale, or density only. Reveals stage on internal timestamps (the piece is silent, so no spoken cue) — at each frame’s t=0 only its first element is on screen, the rest arrive on the timestamps below. Holds stay fully still, no drift or breathing. No purple-blue AI gradients, no bokeh, no browser chrome, no drop-shadow cards, no infinite loops or randomness. Frame 1 — Hook (0.0–4.0s), type: hook, persuasion: counterexample, beat: recognition + tension, focal: the headline. At 0.0s: bold ink headline “Most tools slow you down.” slams in, centered. At 1.5s: a single thin accent dot (ink color, small, low weight) fades in top-right — the motif, planted quietly. Hold from 3.0–4.0s. Frame 2 — Substance, the breather (4.0–10.0s), type: benefit_highlight, persuasion: numbered enumeration, beat: aha, focal: the stat. This is the one deliberately calmer, more static frame in the piece — everything else develops continuously, this one mostly holds. At 4.0s: the accent dot from frame 1 carries over, now larger, sitting quietly left-of-center. At 5.0s: a big stat “3.2 hrs / week” fades in beside it, no motion after it lands. Static hold 6.0–10.0s. Frame 3 — Landing (10.0–15.0s), type: cta, persuasion: callback + distillation, beat: resolve + inevitability, focal: the completed motif. At 10.0s: the accent dot from frames 1–2 expands and fills into the full Fernwell wordmark lockup — same motif, now complete, denser and larger. At 12.0s: tagline “Fernwell. Built for flow.” stamps in below it. Hold 13.5–15.0s.
Related
Anatomy of a one-shot prompt
The six-part skeleton a single beat uses — the same discipline, one frame at a time.
Recreating something you saw
Transcribing motion frame by frame — the same rigor a storyboard’s per-frame timestamps need.
Design systems and brand
The two-color discipline and brand tokens a storyboard’s direction block draws from.
The HyperFrames pipeline
STORYBOARD.md as a production artifact — the file format this chapter’s prompts turn into.Capstone thread — the Level 7 film stretches this chapter’s callback device across its whole runtime: the
<div class="clip"> chip typed in the opening rides the wire through every region and finally snaps into the render slot as the payoff (cut from the film, below).
The clip card — the <div class="clip"> 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 paying off, rendered — the protagonist chip arriving at the render slot after a full minute on the wire.
Next: Editing existing videos — the editor verbs that turn a first render, storyboard or not, into the twenty edits after it.