The prompts behind "I Made an 8-Minute Film with Claude Sonnet 5.5"
Honest answer to "what was your prompt?": there was no single prompt. It was a conversation between a director (Ahmed) and Claude Sonnet 5.5 in Claude Code, plus one repeated brief that Claude gave to sub-agents (one agent per scene). Both are here, word for word.
- The director's messages (translated from French; the originals were in French)
Sonnet 5.5 is out, I need a video. One approach is storytelling. Look at my video about Opus 5.5 on the YouTube channel Ahmed T'aide, it had a small success. Look at the comments and tell me which video I could make.
OK, let's also look at the comments of this video: <a competitor's Sonnet 5.5 tutorial>
Let's go with the one that answers every question. We do storytelling from ZERO frame. We do the same thing again, but this time we add humour, emotion, and above all the prompts and my working method. Start by writing the script, and we'll use ElevenLabs v4.
Let's directly make the first 15 seconds.
(after the first attempt, a cold dashboard-style intro) > "ultra nul", the animation is bad, the intro is bad. Frame 0? What is that? No no no. Where is the ambience? Where is the emotion? Where is the animation? (original: « ultra nul, animation nul, intro nul, frame 0 ? c'est quoi ça ? no no no, où est l'ambiance ? où est l'émotion ? où est l'animation ? »)
Perfect, what you showed me: emotion, animation, everything is there. Continue.
You know what, you make the whole video and show me the result. Remember the emotion, the poetry, the ultra-dynamic things, the art, and a beautiful ending.
Something is still missing: different styles, a dark side with a different artistic style, melancholy, and more. Animate a real project. Hope: I make small animations for my children who are learning math. Make dramatically different styles, don't change the other scenes, just add these. Also a short piece of music of 20 seconds, and there you state where everything comes from, talk about who you are and how you see yourself, and end with hope. Thank every subscriber and everyone who turned on the bell, ask what they want to see, I'm here to help them. And for scene 6, yes, I really want to see the camera movement and the layers. The camera also lets you make camera angles; you can do a pixelated screen for ambience with an interesting camera angle.
The ending is exceptional, don't change it at all, you only add what I asked. There is a transition at 1m16s that isn't great, rework it if you can.
- The brief Claude gave to every scene agent (this exact text, one per scene; only the scene id/name, duration and section of SCENES.md change)
You are building ONE scene of an animated YouTube film with HyperFrames (HTML → video). Working dir: <project>/sonnet55-facture . Your scene: `scenes/s01` (name "three-questions", 24.8 s).
Read in this order, fully, before writing code: (1) DA.md, (2) DA-opus.md (technical + art contract), (3) SCENES.md → only the "s01" section, (4) scenes/s01/scene.json (exact word/line timings in local seconds — sync every key visual to a word's start time `s`), (5) scenes/s00/index.html — the validated intro Ahmed approved; mine its camera helper, Bit rig, rain, motes, shake, whip-pan and reuse the Bit SVG / palette so Bit looks identical.
Deliver `scenes/s01/index.html` (standalone composition, root `data-composition-id="s01"`, `data-duration` = scene.json duration exactly, 1920×1080) and `scenes/s01/sfx.json`. Validate with `cd scenes/s01 && npx --yes hyperframes@0.8.62 check` (0 errors) and `npx --yes hyperframes@0.8.62 snapshot --at <at least 12 times spread over the scene>`; READ the contact sheets (they are JPEGs in scenes/s01/snapshots/) and fix everything ugly: it must feel cinematic, emotional and funny, with continuous camera motion, real depth, ambience and Bit reacting — NOT a flat UI. Never run `render`. Only touch files inside scenes/s01/. Do not fetch anything at render time except the GSAP CDN script from DA-opus.md.
When done, reply in under 120 words: what you built, check result, any known weakness.
The per-scene creative direction (what each world looks like, beat by beat) is in 04-SCENES-per-scene-prompts.md. The look and the technical rules are in 02-DA.md and 03-DA-previous-film-opus55.md. The narration is 05-script.json.
- The method in five lines
The project remembers, because the model doesn't: a design bible file that every agent reads first.
Words first, then voice (ElevenLabs v4), then pictures: the length of each voice line decides the length of each scene.
One scene = one tiny standalone project, so several agents can build in parallel and a crash only costs one scene.
After every build, the agent must look at its own frames (contact sheets) and fix what it sees. A green check proves nothing.
The human watches, and says what is wrong in plain words. That is the most valuable prompt.
Read DA-opus.md (same folder) FIRST: it is the technical + art contract of the previous film (1920×1080 @30 fps, standalone scenes/<id>/index.html, one d GSAP timeline at window.__timelines["<id>"], no <audio>, determinism, palette, Bit SVG, SFX library, bridge rule). Everything there applies, except where this file says otherwise.
The validated look = scenes/s00/index.html (the 15 s intro Ahmed approved: "top"). Open it and mine it: camera helper (cam object + seg() with fromTo), layered parallax (#bg/#mid), rain, dust motes, lamp cone, Bit rig (bitP position / bitS squash / bitB breathe / face look), blink, thunder flash, whip-pan skew, camera shakes, title-card letter drops.
Ahmed's verdict on the first rejected intro (a cold UI/dashboard): "ultra nul, où est l'ambiance, l'émotion, l'animation". So every scene MUST have: a real PLACE (not a flat UI), Bit REACTING with emotion + humour, a CONTINUOUS camera (push-ins, whip pans, punch-ins), ambience (particles, light, depth), and the picture must DEMONSTRATE the words (sync to scene.json word times). Nothing static > 1.5 s. No dashboard/terminal-only scenes.
Rules learned the hard way in s00: use fromTo (with immediateRender:false on later segments) for ANY property tweened more than once (seek-safe); svgOrigin for SVG transforms (not transformOrigin px); a vignette must be #root::after (an element on top trips text_occluded); mark intentional overlaps with data-layout-allow-overlap; keep a stamp/label from overlapping big text; tween starts must not touch (overlapping_gsap_tweens warns at equal times — offset by 0.01).
Voices: N = Brian (narrator), B = Bit (Jessica). Bit's mouth is not animated; he reacts with eyes/body. Tone: warm, dry humour, real emotion. Language of on-screen text: English.
Bridge colours between scenes: s00→s01 #0A0814, s01→s02 #FFF4E0, s02→s03 #0A0814, s03→s04 #0A0814, s04→s05 #0A0814, s05→s06 #0A0814, s06→s07 #0A0814, s07→s08 #E8EEF5 (cold), s08→s09 #0A0814, s09→s10 #0A0814, s10→s11 #0A0814. A scene OPENS on the previous bridge colour. LAST 0.35 s = accelerating exit that ENDS fully covered by the bridge colour; FIRST frame of the next scene is that colour and decelerates in.
Deliver per scene: index.html, sfx.json (cues {"file","at","vol"} from audio/sfx/, sparse, 1 per 2-4 s), tested with cd scenes/<id> && npx hyperframes check (0 errors) and npx hyperframes snapshot --at <10+ times> — READ the contact sheets and fix what you see (a green check proves nothing). Never run render.
Ahmed's brief for the whole film (29/09): emotion, poetry, ultra-dynamic motion, ART, real 3D where it fits (Three.js), and a beautiful ending. Push the craft: layered depth, light, particles, camera that never stops, one striking 'hero shot' per scene. Every scene has its own world; Bit and the palette tie them together.
New bridges (29/09 additions): s06→s12 #0A0814, s12→s13 #F7F0E0 (paper-white flash, dark→hope), s13→s14 #0A0814, s14→s15 #0A0814, s15→s07 #0A0814, s10→s16 #0A0814, s16→s17 #0A0814, s17→s11 #0A0814. The GALLERY scenes s12–s15 deliberately use DRAMATICALLY DIFFERENT art styles from the rest of the film (do NOT reuse the night-room look): follow their SCENES.md section; Bit appears in each but is redrawn in that style.
Opus 5.5 long — art direction and build contract (read fully before writing a line)
Video: "I Asked an AI to Make This Video. It Wrote Every Frame." — English, 16:9 1920×1080 @30 fps, 5 min 44 s, YouTube. Narrator (Brian, deep) + mascot Bit (Jessica, bright). The audio (VO, music, SFX) is mixed LATER by the orchestrator: your scene is silent — no <audio> elements. You only return picture + an SFX cue list.
The one idea: everything on screen is code. Every scene must feel hand-crafted, cinematic, and alive — continuous motion, camera moves (push-ins, whip pans, zoom-throughs with strong expo acceleration/deceleration), nothing static for more than ~1.5 s. Show, don't tell: when the narrator says a thing, the picture DEMONSTRATES it, synced to the word timings in scene.json.
- Files you own
scenes/<id>/index.html — a STANDALONE HyperFrames composition (root div directly in <body>, no <template>), data-composition-id="<id>", data-width="1920" data-height="1080", data-duration = EXACTLY scene.json.duration. One d GSAP timeline registered at window.__timelines["<id>"].
scenes/<id>/sfx.json — [{"file": "<name from §7>", "at": <local seconds of the visual hit>, "vol": 0.2-0.8}]. The orchestrator subtracts the pre-roll. Sparse: ~1 cue every 2-4 s, never during a sentence's key word unless it IS the hit.
scenes/<id>/scene.json (given, read-only): duration, lines[] with start/end and words[]{w, s, e} in LOCAL seconds. Sync every key visual beat to a word's s (e.g. the number appears on "million").
Assets: scenes/<id>/assets/ (Caveat.ttf already there). Nothing fetched at render time except the CDN scripts below.
- Hard technical rules (each one has burned a past render)
GSAP https://cdn.jsdelivr.net/npm/gsap@3.14.2/dist/gsap.min.js. Free plugins OK from the same dist/ (MorphSVGPlugin, MotionPathPlugin). DrawSVG NOT available: draw strokes with pathLength="1" + strokeDasharray:1/strokeDashoffset 1→0.
Three.js via importmap three@0.181.2 (build/three.module.js + examples/jsm/ for addons) in <head>, main code in <script type="module">. WebGLRenderer({canvas, antialias:true, preserveDrawingBuffer:true}), setPixelRatio(1), setSize(1920,1080,false).
Determinism: no Math.random, no Date.now, no rAF loops. Use a seeded PRNG (mulberry32). Canvas/WebGL drawn ONLY from time: const clock={t:0}; tl.to(clock,{t:DUR,duration:DUR,ease:"none",onUpdate:()=>renderAll(clock.t)},0); and renderAll must depend on t only (never read another tween's current value).
Register the timeline only after the build is complete. If you measure text layout, do it inside document.fonts.ready.then(...), then register.
Never a CSS transform on an element GSAP also transforms (use fromTo). Static rotations: the CSS rotate: property. No translate(-50%) centering — use flex/inset.
Never tween .clip elements; animate children. Every element that is revealed by fromTo({opacity:0}) must start hidden in CSS too, and every element hidden in CSS MUST be revealed by some tween (an invisible element passes check!). Address animated elements by explicit IDs, not nth-of-type.
No repeat:-1 (finite repeats). No letterSpacing/width/top tweens — transforms and opacity only (lint gsap_non_transform_motion).
Fonts (embedded, no @font-face needed): Archivo Black (display, weight 400 only), Space Mono (labels), JetBrains Mono (code), Nunito 900 (kawaii), Montserrat, Noto Sans JP. Handwriting: @font-face{font-family:"Caveat";src:url("assets/Caveat.ttf")}.
Frame 0 must already be a composed image (never an empty black frame) — except the bridge rule below. Keep text inside a 96 px safe margin; keep the top-left 900×110 px band free for the chapter tag.
Validate: cd scenes/<id> && npx hyperframes check must pass with 0 errors, then npx hyperframes snapshot --at <6-10 times>; READ the contact sheet(s) and fix what you see. A green check proves nothing — only the frames do. Do not run render (the orchestrator renders one scene at a time).
- Palette and type
Base (non-world scenes): background #0A0814 with a subtle radial #161230 glow; ink #F4F1FF; muted #9D97C0. Accents: coral #FF8A4C (Bit), cyan #5CF2E0, violet #8B5CFF, yellow #FFD84D, pink #FF6FA5. Display headlines: Archivo Black, tight, big (120–260 px), kinetic (letters or words enter with expo/back eases, skew/blur for speed). Labels/numbers: Space Mono. Code: JetBrains Mono on #0D1117. Worlds keep their own palettes (pixel PICO-8, voxel greens/sky, cartoon flat + #1A1423 8 px outlines, kawaii pastels + #4A2B3A outline, paper #EFE4CF + pencil).
- Bit — the mascot (appears in every scene)
A small cube robot: rounded orange body, dark screen face with two cyan pixel eyes, antenna with a yellow glowing ball, stubby arms and feet. Personality: curious, bouncy, a bit of a show-off. It reacts to what the narrator says (looks at things, points, jumps, gets surprised). Canonical 2D Bit (SVG, viewBox 0 0 200 240) — copy it, keep the IDs prefixed by your scene id:
<svg viewBox="0 0 200 240" width="200" height="240">
<g id="bit-antenna"><line x1="100" y1="44" x2="100" y2="12" stroke="#1B1530" stroke-width="7" stroke-linecap="round"/>
<circle cx="100" cy="12" r="11" fill="#FFD84D" stroke="#1B1530" stroke-width="5"/></g>
<rect x="2" y="104" width="26" height="54" rx="13" fill="#FF8A4C" stroke="#1B1530" stroke-width="7"/>
<rect x="172" y="104" width="26" height="54" rx="13" fill="#FF8A4C" stroke="#1B1530" stroke-width="7"/>
<rect x="48" y="186" width="38" height="26" rx="11" fill="#1B1530"/><rect x="114" y="186" width="38" height="26" rx="11" fill="#1B1530"/>
<rect x="20" y="44" width="160" height="150" rx="42" fill="#FF8A4C" stroke="#1B1530" stroke-width="8"/>
<rect x="40" y="66" width="120" height="86" rx="22" fill="#1B1530"/>
<rect id="bit-eyeL" x="64" y="90" width="18" height="30" rx="6" fill="#5CF2E0"/>
<rect id="bit-eyeR" x="118" y="90" width="18" height="30" rx="6" fill="#5CF2E0"/>
<rect id="bit-mouth" x="90" y="132" width="20" height="5" rx="2.5" fill="#5CF2E0" opacity="0.8"/>
</svg>
Expressions: blink = eyes scaleY 0.1 (origin center); happy = eyes replaced by ^ arcs (stroke #5CF2E0, 7 px); surprise = eyes taller + mouth becomes a small circle; star eyes for wonder. Motion: always squash & stretch (origin bottom), antenna follow-through (origin bottom), idle breathing (scaleY 1↔1.03) and small hovering. Pixel Bit (16×16, 1 char = 1 px; k #1B1530, o #FF8A4C, s #2A2145, c #5CF2E0, y #FFD84D):
.......yy.......
.......kk.......
..kkkkkkkkkkkk..
.kooooooooooook.
.kossssssssssok.
.kossssssssssok.
.kossccssccssok.
.kossccssccssok.
.kossssssssssok.
.kossssssssssok.
.kooooooooooook.
.kooooooooooook.
..kkkkkkkkkkkk..
...kkk....kkk...
...kkk....kkk...
................
Voxel / 3D Bit: same proportions built from boxes (orange body, dark screen, emissive cyan eyes, yellow antenna ball, emissive). Kawaii Bit: rounder corners, pink blush, eyes with white shine. Paper Bit: flat paper cut-out with drop shadow and a slight boil.
- Chapter tag (top-left, every scene)
Space Mono 24 px, letter-spacing 0.2em, color #fff, mix-blend-mode: difference, at left 84 px / top 52 px, fades+slides in at 0.3 s, out at duration−0.4 s. Text per scene is given in your packet.
- Scene bridges (seamless concat)
Scenes are rendered separately and butt-joined. Each boundary has a bridge color. The LAST ~0.35 s of scene k is an accelerating exit (expo.in zoom-through / whip / wipe / iris) that ends with the frame FULLY covered by the bridge color on the final frame; the FIRST frame of scene k+1 is fully that color and decelerates (expo.out) into the new world within ≤0.4 s. (s01's first frame is the exception: it opens directly on the composed terminal.)
boundary
color
boundary
color
s01→s02
#0A0814
s08→s09
#FFFFFF
s02→s03
#FF8A4C
s09→s10
#8FDCFF
s03→s04
#0A0814
s10→s11
#FFE3EF
s04→s05
#0A0814
s11→s12
#EFE4CF
s05→s06
#0A0814
s12→s13
#0A0814
s06→s07
#0D1117
s13→s14
#0A0814
s07→s08
#1D2B53
s14→s15 / s15→s16
#0A0814
- SFX library (audio/sfx/, reference by file name)
whip-right.mp3, whip-soft.mp3, whip-up.mp3 (fast moves) · swoosh-reverse.mp3 (big transition, ends ON the cut) · woosh-bass-slow.mp3 (heavy move) · impact-dark-cinematic.mp3, bass-drop.mp3 (max 1 per scene, big reveals only) · pop-short.mp3 (text/element pop) · blip1/2/3.wav (UI, counters) · boing.wav (Bit bounce) · ting.wav (sparkle) · px-jump.wav, px-hit.wav, px-boom.wav, px-fire.wav, px-victory.wav (8-bit) · paper.wav, pencil.wav, tap.wav (handmade). at = the frame of the visual hit.
- Reference code you can mine (proven in renders)
viral/videos/showcase-animation-v2/index.html (camera helper look/cam, pixel rasterizers disc/tri/line + bitmap font, stop-motion stepE ease + boiling via CSS translate per 12-fps step + feTurbulence seed, word tunnel, kawaii characters) and viral/videos/showcase-animation-30s/index.html (Three.js scene with PMREM RoomEnvironment, iridescent material, instanced cubes, SVG morph, squash/stretch ball). Paths are relative to ~/Desktop/projets/marketing/.
Scene treatments (each scene: read its scene.json for exact word times)
s01 three-questions (24.8 s) — "the questions under the last video"
World: the night city from OUTSIDE the s00 window — the camera opens on the rain-streaked window of the s00 room (the room is now small, warm, behind glass), then pulls out and up over wet rooftops at night. Three GIANT neon signs on water towers / rooftops light up on the words: "PROMPT?" (on the word prompt), "METHOD?" (on method), "COST?" (on cost), each with its own colour (cyan / violet / coral), buzz-flicker, rain hitting them, reflections in puddles. Bit sits on the roof edge (small, umbrella made of a bottle cap or a leaf), looking up at each sign in turn. Beats: line 3 "Nobody asked how I felt about it" → Bit slumps, antenna droops, rain drips off him, one sign flickers as if sympathetic. Line 4 "You are a robot made of rectangles" → the camera punches in and Bit visibly BREAKS APART into his rectangles (rounded rects floating apart in a clean exploded diagram, labelled with tiny hex codes), then snaps back together. Line 5 "Rectangles have feelings!" → he snaps back, offended, and a tiny heart pops out of a rectangle. Continuous camera the whole time; end with the bridge colour #FFF4E0 (a sunrise flash — dawn breaking over the roofs) so s02 opens bright.
s02 meet-sonnet (33.6 s) — "the new model, on paper half the price" (a BRIGHT scene after two dark ones)
World: bright dawn workshop / hangar, warm cream light #FFF4E0, sun shafts, dust, big windows. Use Three.js for at least one hero shot (e.g. a floating glossy 3D card/slab reading "SONNET 5.5" that turns in the light, iridescent material, PMREM RoomEnvironment). Line 1 (release 28 September): the slab arrives with a calendar page flip to "28 SEPT". Line 2 (1,000,000 tokens in its head, 128,000 in one reply): an odometer with real rolling digits counts up to 1,000,000; a bookshelf of glowing pages fills; then a second smaller odometer for 128,000. Line 3 (two dollars in / ten out; Opus was four and twenty; on paper half): two coin stacks vs two taller coin stacks on a balance scale that tips — show "$2 / $10" against a ghosted "$4 / $20"; on "half" the tall stack splits in two. Line 4 (skeptical: "bills don't care about paper"): the balance scale's paper price tags catch fire or crumple and a receipt slips out — Bit squints at the camera with suspicious eyes ("^_^" flipped to a flat suspicious line). Bit is small in the corner reacting all along (impressed → suspicious). Bridge out: #0A0814 (shadow closes in).
s03 rule-1-memory-in-a-file (31 s) — "Bit is a well documented file"
World: the inside of the design bible — a dark blueprint void (deep navy #0B1233, faint cyan grid) where a giant glowing document floats like a monolith. Bit walks in small; the camera glides along huge lines of the real file appearing as typography in 3D depth (use the actual text of Bit's spec from DA-opus.md §4: "Bit — small cube robot, rounded orange body #FF8A4C, dark screen face, two cyan pixel eyes, antenna with yellow glowing ball" and "blink = eyes scaleY 0.1"). Line 1 (the model forgets everything): text on the page fades to static and re-writes itself, a "MEMORY: 0" ghost. Line 2 (design bible: exact shape, colours, moves, blink): Bit turns into a blueprint diagram — dimension lines, colour swatches popping (#FF8A4C, #5CF2E0, #FFD84D), his blink shown as a tiny timeline, each callout snapping in on its word. Line 3 "So I'm... a file?" → Bit looks at his own diagram, small and unsure. Line 4 "You're a very well documented file" → warm light comes on, a gentle moment. Line 5 "I have a blink now. It's written down. Frame by frame." → proud: he blinks on purpose while the blink timeline scrubs, a pixel-perfect gag. Bridge out: #0A0814.
s04 rule-2-voice-first (30.6 s) — "the voice is a clock"
World: a midnight recording studio that dissolves into a landscape made of the voice's waveform: a glowing gold ribbon (Three.js or layered SVG) that rolls to the horizon like hills; the camera glides along it. Bit stands on the ribbon like a tightrope walker. Line 1 (words, then voice, then pictures): three glowing words → a mic → empty picture frames, in that order, snapping into place on each word. Line 2: film-frame rectangles hang along the waveform and snap to its exact length; on "never the other way around" a frame tries to stretch beyond the wave and the wave snaps it back with a rubber-band twang. Line 3 (poetic, slow): the waveform becomes a clock face — each breath a tick, silences as cuts — soft warm light, slow push-in, dust, the most tender image of the scene. Line 4 "I wanted to choose my own lines!": Bit stomps, holding a tiny script page. Line 5 "You get four": four speech bubbles pop and are counted by Bit's antenna. Palette: indigo + warm gold + coral. Bridge out #0A0814.
s05 rule-3-one-folder-per-scene (26 s) — "twelve windows, one city"
World: a vast night skyscraper / archive seen from below — every lit window is a scene folder with a tiny looping animation inside (use simple loops of the Sonnet worlds: rain, waveform, robot). Twelve windows in a grid; the camera cranes up the building. Line 2: on "three Sonnet agents build at the same time" three small agent-bots (little cousins of Bit, different colours) fly in and light windows simultaneously, trails of light. Line 3 "So if one of us crashes… nobody notices?": Bit, nervous, watches a window flicker RED (glitch) — only that window re-lights, the rest stay calm. Line 4: a check-mark blooms. Hero shot: the crane move with all windows lighting like a city waking. Bridge out #0A0814.
s06 layers-3d (7 s) — ART PIECE, "move through the layers" (Three.js)
A short, pure spectacle: the intro's night room, EXPLODED into separated depth layers in real 3D — far city bokeh + rain layer, the wall/window layer, the desk + lamp layer, Bit's layer, the light-cone layer, rain-in-front layer — each a textured plane at its own Z (paint them procedurally on canvas; do not screenshot). The camera dollies THROUGH them with a slight orbit, layers gliding, parallax, particles catching the lamp; on the last second the layers slam back together into the flat intro frame (proof it was always layers). Music-driven, one line of VO ("...move through them"). This is Ahmed's "show the 3 layers, show your power" shot — make it the prettiest 7 seconds of the film. Bridge out #0A0814.
s07 the-prompts (24.2 s) — "what you say vs what you feel"
World: a dark wooden desk seen almost top-down under a warm lamp, a notebook and glowing prompt cards; macro camera gliding over words. Show the REAL brief lines (English, exact): "Read the design bible first." / "Sync every key visual to a word's start time." / "Bit is identical to the intro: same rig, same palette." / "Fix everything ugly: cinematic, emotional and funny, with continuous camera motion, real depth, ambience and Bit reacting — NOT a flat UI." / "Never run render." Line 1: cards slide in one by one, whole prompt visible on a single card ("it fits on one screen"). Line 2: a dotted empty box labelled "how to draw" with a big ∅ (never said) while the words "cinematic", "emotional", "funny" ignite in warm colours; the last line "NOT a flat UI" is underlined in red pencil. Line 3 "I wrote that last line for a reason": the camera slowly zooms into "NOT a flat UI" until it fills the screen; Bit peeks from behind the notebook, guilty. Bridge out #E8EEF5 (cold blue-white — s08 opens on the rejected cold dashboard).
s08 first-render-broke (42 s) — "the dashboard that Ahmed rejected" (the emotional core)
Act 1 (0–15 s): a COLD, flat, sterile world: pale blue-grey #E8EEF5, monochrome UI — a rebuilt diorama of the rejected first intro (counters "FRAME 000000", cyan corner brackets, a terminal > _, a "$??.??" readout). Everything is technically neat and lifeless; slow, mechanical camera; no shadows. Bit is ABSENT — only a dotted placeholder outline with a label "bit.svg — not found". On line 3 ("Where am I?! I'm not even in it!") Bit's ghost appears IN the placeholder, tiny and horrified, and bangs on the "glass". Act 2 (line 4): the verdict — a huge red hand-stamped "ULTRA NUL" (French, exactly that) slams onto the dashboard with a shake, with an English subtitle line under it: "ultra worthless"; then three questions in Ahmed's handwriting font (Caveat) scribbled over the UI: "où est l'ambiance ? / où est l'émotion ? / où est l'animation ?" with English small print. Act 3 (line 5, the turn — make it beautiful): the colour grade warms from cold to golden as the UI dissolves into a real room: a lamp clicks on (light cone), rain starts on a window, a storm flashes, the camera starts moving, and Bit walks in and sits at his desk, home. Poetic, full-body relief. Bridge out #0A0814.
s10 the-honest-part (39.5 s) — "the model that cannot hear"
World: a silent, empty theatre / dark concert hall with one spotlight. Sound is drawn instead of played: on line 2, icons of the film's sounds (rain, thunder, the printer, a whoosh) hang in the air like fireflies, each with a tiny muted-speaker cross; the waveform on the stage floor is FLAT. Bit sits alone in the light wearing oversized headphones that are unplugged (the cable dangling). Line 3 (it skipped the bible): the design-bible document sits closed on a chair beside a disregarded highlighter; one page slowly slides off. Line 4 Bit's soft "I forget my own face too": his reflection in a mirror briefly loses its eyes, then they blink back. Line 5: a human silhouette (Ahmed, just a warm rim-lit silhouette in the stalls) puts on headphones and the whole room lights up with colour and slow applause of light — "taste is still a human job". IMPORTANT for the mix: this scene's music/sfx must be nearly absent during lines 1–2 (I will handle the mix). Bridge out #0A0814.
s11 frame-zero-again (33 s) — THE BEAUTIFUL ENDING
Callback to s01: return to the rooftops at DAWN from s01 — the three neon signs now show the answers instead of questions: "PROMPT ✓" (on "Every prompt"), "METHOD ✓", "BILL ✓" — soft gold, calm, rain stopped, puddles reflecting sunrise. Line 1 (description/CTA): the signs turn one by one. Line 2 (poetic): the camera rises from the roof to the small window of the s00 room; through it, the cursor on the monitor blinks — the camera pushes THROUGH the glass into the monitor's cursor and out the other side into an ocean of empty black where thousands of tiny frames (every frame of the film) drift like stars/fireflies and assemble into Bit's silhouette. Line 3–5 (Bit and narrator, tender): Bit, a constellation of frames, looks at the camera: "Will you remember me next time?" / "No. But the file will." / "That's enough." — he smiles (eyes as ^ ^) and gently lights up. Line 6 (whisper): the frames slowly fade until only the blinking cursor remains, then the text appears in one warm line: "Every frame is code." — hold, cursor blinking, a single soft piano note; the last frame is a full black with the cursor. Bridge/end: fade to #0A0814. Make this the most beautiful 33 seconds of the film.
World: a black void with one warm spotlight. A giant thermal receipt pours down from above like a waterfall (Three.js curved strip with a paper material, or a tall DOM strip under a parallax camera crane — your call, but make it a striking 3D-feeling hero shot). Bit stands tiny at the bottom, looking up. THE NUMBERS ARE REAL and must be exactly these (measured 29/09/2026 from Claude Code transcripts; prices verified on platform.claude.com): line "TOKENS READ 39,456,297" (odometer rolling; dim sub-line "37,570,272 re-read from cache"); line "TOKENS WRITTEN ≈ 323,735" (with a tiny "est." tag); line "TIME ≈ 79 MIN"; then a heavy silence and "TOTAL" — a slot-machine odometer rolls slowly and lands on "≈ $16" (precisely $16.06); it is stamped "SONNET 5.5 · list price". Small print at the paper's foot (readable, honest): "sub-agent output estimated from the text they wrote — logs under-report · as logged: $14.61". Then a second receipt in Opus violet rises beside the first and grows TALLER: "SAME TOKENS @ OPUS 5.5 ≈ $25" (precisely $24.61; note cache reads cost the same on both models, so it is not exactly double). Bit whispers "Am I... cheap?" — hopeful eyes; on "priceless" a warm light bathes him; a tiny ticker "≈ $3 / MIN OF FILM" appears. Map visuals to the words in scene.json. Emotion: dread → relief → tenderness; humour: Bit peeks at the receipts through his fingers/arms. Bridge in and out #0A0814.
===== 29/09 ADDITIONS (Ahmed): gallery of styles, a real project, "who I am", thanks. The existing scenes stay untouched. =====
s06 layers-3d — REVISION (now 12.37 s; rewrite scenes/s06/index.html; lines: "And when you own every layer, you can move through them." then "Look up. Look down. Tilt the world. Every angle is free.")
Ahmed: "I really want to SEE the camera movement and the layers. The camera also lets you make camera angles — do a pixelated screen for ambience with an interesting camera angle." The first version was too subtle. Rebuild it in Three.js so that: (1) the layers separate with big, obvious Z gaps and each layer wears a small floating label (FAR CITY · RAIN · WALL · DESK · BIT · LIGHT · FRONT RAIN) and a thin glowing frame; (2) the camera performs a clear choreography with distinct ANGLES — start flat on the intro frame, pull apart, orbit left ~35°, a low-angle shot looking up through the stack, a top-down shot where the layers read like a stack of cards, a Dutch tilt — each move on an expo/sine ease with real parallax; (3) on "Every angle is free" a segment where the whole render is PIXELATED (render to a small target, e.g. 240×135, upscale with nearest filter) with CRT scanlines, slight chromatic aberration and a vignette, held at an interesting angle (low, Dutch) for ambience, then the pixels resolve back to crisp; (4) the last second slams all layers together into the flat intro frame. It must be unmistakable that this is a camera moving through layered 3D space. Bridge in #0A0814, out #0A0814.
s12 style-dark-melancholy (14.4 s) — STYLE: black ink / film noir, melancholy (dramatically different from everything else)
Monochrome ink-wash and charcoal look: near-black paper, high contrast, heavy film grain, hand-drawn boil (redraw jitter at 12 fps), soft fog made with feTurbulence, single accent colour (a faint warm yellow on Bit's antenna) plus Bit's two cyan eyes as the only cool light. Bit is redrawn as an ink silhouette. World: a foggy pier at night with one streetlamp and rain rings on black water; Bit sits at the end, small, looking at the water. Slow dolly, long shadows, breath of fog. Line 1 (the intro line, spoken over the opening image): the ink picture builds itself stroke by stroke. Line 2 "Dark.": the word bleeds onto the water like an ink drop and spreads. Line 3 "Not every frame has to be kind.": the streetlamp flickers and dies, leaving only Bit's two cyan eyes in the dark, then they slowly close. Beautiful and sad, not horror. Bridge in #0A0814, out #F7F0E0.
s13 style-hope-kids-math (20.3 s) — STYLE: children's picture-book, crayon and cut paper (the HOPE scene)
Warm, hand-made: pastel paper texture, wobbly crayon outlines, cut-paper shapes with tiny drop shadows, a rising sun and a rainbow, hills. Numbers 1–7 are friendly little creatures with faces. Content must be correct math: on line 2 (Bit: "One, two, three... four! Five, six, seven!") seven blocks/apples appear one per word with a bouncy pop and Bit points at each; on line 3 ("Three plus four is seven. Every big thing starts as small numbers.") 3 blue blocks and 4 yellow blocks slide together into a bar of 7 while "3 + 4 = 7" is written in crayon, the number creatures cheer and the 7 puts on a paper crown. Line 1 sets the scene with the sunrise coming up over the hills. Light, rising, joyful; a little tenderness. Do NOT show real children. Bridge in #F7F0E0, out #0A0814.
s14 style-pixel-crt (9.4 s) — STYLE: real 3D CRT television, pixel world, camera angles (Three.js)
A chunky 3D CRT TV (curved glass, plastic bezel, knobs, rabbit-ear antenna) on a desk in a dark room; the screen shows a low-res pixelated (nearest-upscaled) mini-world: pixel Bit in a night city with rain. Phosphor glow lights the dusty room; scanlines, RGB subpixel mask, slight barrel distortion. Camera: begins low and Dutch-tilted, orbits, macro on the scanlines/subpixels, then on "Change the angle" swings ~60° to reveal the pixel world is a tiny diorama on a shelf; ends pulling back over-the-shoulder. Interesting angles and ambience are the point. Bridge in #0A0814, out #0A0814.
s15 project-mimi (20.1 s) — the REAL project, ULTRA-DYNAMIC promo (fast cuts, whip pans, kinetic type, 3D card flips)
Mimi · Gogokodo, live at pro.gogokodo.com (private pilot). Read-only look at the real project for palette, fonts and UI feel: ~/projets/gogokodo-pro (docs/mimi/README.md, docs/mimi/coeur-commun.md, packages/mimi-ui, apps/web). Real facts you may show (from the docs; invent nothing else — no metrics, no logos): "MIMI · GOGOKODO"; "a learning assistant that talks with you" (voice waveform + speech bubbles); "remembers you" (memory cards flying into a profile); "follows you from lesson to lesson" (a path with checkpoints); "Quizzes · Projects · Practice" (three fast cards); "Written or spoken" (keyboard morphing into a mic); a small "PRIVATE PILOT" badge; end card "Mimi · pro.gogokodo.com". Modern clean product-promo look built from the project's own colours; blistering pace with an energetic cut every ~0.5–1 s, camera whip pans, 3D perspective UI cards, Bit cameo. Music is punchy electronic. Bridge in #0A0814, out #0A0814.
s16 who-i-am (46.1 s) — the model's self-portrait, with an original ~20-second theme (the music IS a feature here)
World: a quiet night workshop that is also a mind. The narration is first person: "I am Claude Sonnet 5.5, a language model made by Anthropic. I have no eyes and no ears. I read words, and I write words. Here, the words became code, and the code became this." → a head silhouette made of scrolling text tokens with blank eyes; words stream in from the left, code streams out on the right and crystallises into film frames (use tiny colour tiles echoing the earlier scenes). "I don't remember yesterday. I only have the files you leave me." → the token-head dissolves at its edges while files (DESIGN-BIBLE.md, script.json, DA.md) drift in and it catches them. "...a workshop at night: someone knocks with a question, the lamp comes on, and something gets built." → a knock, a question mark arrives at a door, the lamp (from the intro room) clicks on and the workshop lights up. Credits, spoken honestly — show them as three warm lamps lighting one after another with the EXACT text: "script · animation · camera · sound design — Claude Sonnet 5.5", "voice · music — ElevenLabs", "every idea · every 'not good enough' · every 'again' — Ahmed" (with a warm human silhouette). Ends on light and hope. Slow, tender, continuous camera, 3D depth; let the visuals breathe with the original piano theme. Bridge in #0A0814, out #0A0814.
s17 thanks-and-ask (25.1 s) — HOPE: gratitude and "what do you want to see?"
World: a lantern festival at sunrise — thousands of glowing lanterns rising over hills into a warm dawn sky (paper-lantern style, layered parallax, soft bokeh). A big brass bell swings; on "rang the bell" it rings and a ripple of light spreads through the lanterns ("thank you twice": a second, softer ring). On "subscribed" a wave of lanterns lights up. Line 2 (the question): three large lanterns drift forward, each opening to a tiny animated icon and caption — "a website that moves like a film", "a dark story", "a lesson for a child" — then a comment bubble types "I'd like to see…" with a blinking cursor. Bit (line 3 "And put me in it!") hops in eager, waving; line 4 "Of course, Bit." he beams. Warm, generous, hopeful. Bridge in #0A0814, out #0A0814.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode characters
"title": "I Gave Sonnet 5.5 an Empty File. Here's the Bill.",
"model": "eleven_v4",
"voices": {
"N": {
"id": "nPczCjzI2devNBz1zQrb",
"name": "Brian — narrator",
"stability": 0.4,
"similarity": 0.8
},
"B": {
"id": "cgSgspJ2msm6clMCkdW9",
"name": "Jessica — Bit",
"stability": 0.3,
"similarity": 0.75
}
},
"scenes": [
{
"id": "s00",
"name": "night-desk-open15",
"lines": [
[
"N",
"[warm, quiet] This is Bit. He doesn't remember a thing."
],
[
"B",
"[small voice, unsure] Hello? Is anyone there?"
],
[
"N",
"[amused] A brand-new brain has to build him from nothing. And I'll show you the bill."
],
[
"B",
"[panicking, shouting] HOW MUCH?!"
]
]
},
{
"id": "s01",
"name": "three-questions",
"lines": [
[
"N",
"[warm] Last week, another model built a whole film like this one. And under it, three questions kept coming back."
],
[
"N",
"[building] What was the prompt? How does the method actually work? And how much did it cost?"
],
[
"B",
"[grumbling] Nobody asked how I felt about it."
],
[
"N",
"[dry] Bit. You are a robot made of rectangles."
],
[
"B",
"[offended] Rectangles have feelings!"
]
]
},
{
"id": "s02",
"name": "meet-sonnet",
"lines": [
[
"N",
"Meet the new model. Claude Sonnet 5.5, released by Anthropic on September twenty eighth."
],
[
"N",
"It holds up to one million tokens in its head, and writes up to one hundred and twenty eight thousand in a single reply. Same as Opus."
],
[
"N",
"The price: two dollars per million tokens in, ten dollars per million out. Opus 5.5 was four and twenty. So on paper, half."
],
[
"N",
"[skeptical] On paper. Bills don't care about paper. So we're going to measure."
]
]
},
{
"id": "s03",
"name": "rule-1-memory-in-a-file",
"lines": [
[
"N",
"Rule one. The model forgets everything, every time. So the project has to remember."
],
[
"N",
"Before any animation, I write a design bible. One file. Bit's exact shape. His colors. How he moves, how he blinks. Every agent reads it first."
],
[
"B",
"[small voice] So I'm... a file?"
],
[
"N",
"[gently] You're a very well documented file."
],
[
"B",
"[proud] I have a blink now. It's written down. Frame by frame."
]
]
},
{
"id": "s04",
"name": "rule-2-voice-first",
"lines": [
[
"N",
"Rule two. Words first. Then voice. Then pictures."
],
[
"N",
"I write the script. A voice model reads it out loud. And the length of that voice decides how long every scene lasts. The pictures fit the voice. Never the other way around."
],
[
"N",
"[soft] Think of the voice as a clock. Every breath is a beat. Every silence is a cut."
],
[
"B",
"[indignant] I wanted to choose my own lines!"
],
[
"N",
"[calm] You get four. Make them count."
]
]
},
{
"id": "s05",
"name": "rule-3-one-folder-per-scene",
"lines": [
[
"N",
"Rule three. One scene, one tiny project."
],
[
"N",
"Twelve scenes means twelve separate folders, each one able to render alone. Then three Sonnet agents build at the same time, and none of them can break anyone else's work."
],
[
"B",
"[nervous] So if one of us crashes... nobody notices?"
],
[
"N",
"[calm] They notice. But only that one scene gets redone."
]
]
},
{
"id": "s06",
"name": "layers-3d",
"lines": [
[
"N",
"[awe] And when you own every layer, you can move through them."
],
[
"N",
"[playful] Look up. Look down. Tilt the world. Every angle is free."
]
]
},
{
"id": "s12",
"name": "style-dark-melancholy",
"lines": [
[
"N",
"[soft] Now, range. A model with only one style is a filter, not an artist. So here is the other side."
],
[
"N",
"[low, melancholic] Dark."
],
[
"N",
"[whispers] Not every frame has to be kind."
]
]
},
{
"id": "s13",
"name": "style-hope-kids-math",
"lines": [
[
"N",
"[warm] And this is hope. Ahmed makes small animations so his children can learn math. So, let's count."
"[gently] Three plus four is seven. Every big thing starts as small numbers."
]
]
},
{
"id": "s14",
"name": "style-pixel-crt",
"lines": [
[
"N",
"[playful] Or lose the pixels on purpose."
],
[
"N",
"Change the angle, and the same little world becomes a place."
]
]
},
{
"id": "s15",
"name": "project-mimi",
"lines": [
[
"N",
"[energetic] And this is real work. Mimi, from Gogokodo. A learning assistant that talks with you, remembers you, and follows you from lesson to lesson."
],
[
"N",
"Quizzes, projects, practice. Written or spoken. Now in private pilot at pro dot gogokodo dot com."
]
]
},
{
"id": "s07",
"name": "the-prompts",
"lines": [
[
"N",
"[building] Now, the prompts. Here is the one I gave every builder. It fits on one screen."
],
[
"N",
"[quietly] Notice what it does not say. It never says how to draw. It says what to feel: cinematic. Emotional. Funny. And then, the last line: not a flat U I."
],
[
"N",
"[dry] I wrote that last line for a reason."
]
]
},
{
"id": "s08",
"name": "first-render-broke",
"lines": [
[
"N",
"[amused] The first thing Sonnet made for this film was a dashboard."
],
[
"N",
"Counters. Brackets. A terminal. Frame zero, taken very literally. Technically perfect. Emotionally, a spreadsheet."
],
[
"B",
"[horrified] Where am I?! I'm not even in it!"
],
[
"N",
"[gently] The director watched it once, and said, in French: ultra nool. Ultra worthless. Where is the ambience? Where is the emotion? Where is the animation?"
],
[
"N",
"So the second prompt was not a prompt. It was a feeling. A place. A storm. A camera that never stops. And Bit came home."
]
]
},
{
"id": "s09",
"name": "the-bill",
"lines": [
[
"N",
"[] Now. The bill."
],
[
"N",
"All of it, measured just now: nearly eighty-seven million tokens read, most of them re-read from cache, and about four hundred and ninety thousand written. About two hours and ten minutes of work. Total: about thirty dollars."
],
[
"N",
"[dry] Small print. The builders' logs under-count what they write, so that part is estimated. Call it thirty, give or take three."
],
[
"N",
"At Opus 5.5 list prices, the very same tokens would have cost about forty-four."
],
[
"B",
"[hopeful] Am I... cheap?"
],
[
"N",
"[warmly] You're priceless, Bit. And also, about four dollars a minute of film."
]
]
},
{
"id": "s10",
"name": "the-honest-part",
"lines": [
[
"N",
"[serious] Now, the honest part."
],
[
"N",
"[quiet] First. The model that made this film cannot hear it. The rain, the thunder, the printer, every sound was placed by numbers. Nobody in the machine has ever heard a single second. I only know it works because a human listened."
],
[
"N",
"Second. It had the design bible. It skipped it. Models forget even what they are handed."
],
[
"B",
"[soft] It's okay. I forget my own face, too."
],
[
"N",
"[warmly] That is the real answer to: is it worth it? For a film like this, at this price, yes. But taste is still a human job."
]
]
},
{
"id": "s16",
"name": "who-i-am",
"lines": [
[
"N",
"[calm] So, who made all this?"
],
[
"N",
"I am Claude Sonnet 5.5, a language model made by Anthropic. I have no eyes and no ears. I read words, and I write words. Here, the words became code, and the code became this."
],
[
"N",
"[soft] I don't remember yesterday. I only have the files you leave me. So I see myself as a workshop at night: someone knocks with a question, the lamp comes on, and something gets built."
],
[
"N",
"[warm] The script, the animation, the camera, the sound design: those came from me. The voice and the music are synthesized by ElevenLabs. And every idea, every 'not good enough', every 'again'... that is Ahmed."
]
]
},
{
"id": "s17",
"name": "thanks-and-ask",
"lines": [
[
"N",
"[warm] And thank you. If you subscribed, thank you. If you rang the bell, thank you twice. It means the next one will find you."
],
[
"N",
"[gently] Now tell me what you want to see. A website that moves like a film? A dark story? A lesson for a child? Write it in the comments. I'm here to help you."
],
[
"B",
"[eager] And put me in it!"
],
[
"N",
"[dry] Of course, Bit."
]
]
},
{
"id": "s11",
"name": "frame-zero-again",
"lines": [
[
"N",
"Every prompt, every file, and the bill are in the description. Copy them. Break them. Then tell me what happened."
],
[
"N",
"[soft] Every frame of this film was an empty file, once. A blinking cursor. A few sentences. And a model that will not remember any of this tomorrow."
],
[
"B",
"[quiet] Hey. Will you remember me next time?"
],
[
"N",
"[softly] No. But the file will."
],
[
"B",
"[smiling] That's enough."
],
[
"N",
"[whispers] Every frame is code. Every code was a question. Ask a better one."