Sonnet 5.5 renders a 10-second motion design film frame by frame in one HTML page
The author shares the full prompt: Sonnet 5.5 uses no templates or After Effects, rendering a motion design film of a search bar burning into a 2000s desktop frame by frame from a single HTML page.
sonnet 5.5 is scary good at motion design a dead search bar turns into a 2000s desktop meltdown: answers pop, catch fire, and vawe rises from the ashes no templates, no After Effects. one HTML page, rendered frame by frame steal the prompt ↓ <inputs> Ask me for: my product name, the question a user types, 4 to 6 "old way" answers, the end-card URL, and short UI sound effects (soundeffect-lab or Kenney: free for commercial use). If I skip anything, use the defaults: the question "how do I make a motion video?", the answers "learn After Effects", "buy a template", "hire a studio", "keyframe for 3 days", the URL http://vawe.dev, and soundeffect-lab clicks, pops, swishes, flames and glitches. </inputs> <direction> A 10-second product film, 1920x1080 at 60fps. 2D, an early-2000s desktop drawn in code: blue sky with soft clouds, rolling green hills, glossy blue title bars with rounded top corners, beige window bodies (#ece9d8), a red close button, a glossy blue taskbar with a green pill on the left and a clock tray on the right. Tahoma for all UI. The UI stays small, like a real desktop seen at a normal distance. Banned: logos, brand words, copied wallpapers, music beds, synth pads, constant camera drift, anything that feels like a template. </direction> <structure> 0-2.5s, ask: open 2.8x close on the empty search field and its blinking caret. Hold 0.9s. Type the question with an uneven, human rhythm while the camera eases out once to the full desktop. 2.5-3.7s, click: the pointer glides in, rests, and presses the green go key. The key presses in, then a red starburst bursts from behind it. 3.7-5s, answers: the old-way answers pop in as windows, stepping down the screen like a staircase. Each pop lands with a small overshoot. 5-7s, burn: flames rise through the stack on the strongest beat, the windows char brown, then eight horizontal glitch bands smear the stack away. 7-10s, answer: a thin outline grows from the taskbar to window size, then the window fills in and types "describe it. / <product> makes it." Hold it. The end card is one more window: an address bar with the URL and a green go button. </structure> <build> 1. One HTML file, 1920x1080. Compute every style from time inside seek(t): no CSS transitions, timers or state between frames. 2. One camera transform on a container: still by default; an ease-out at the open, one push at the burn, one pull back for the answer. Nowhere else. 3. Springs for every pop and settle; exits faster than entrances. 4. Sound: one light keystroke per typed letter (40-80ms, never closer than 40ms, about 10dB under the click, different every stroke), a swish on the first frame of each pointer move, the click on the press frame, a pop per window rising in pitch, a flame crackle, glitch hits on the smear, a pop when the answer window fills, a success chime on the card. Normalise to about -20 LUFS. 5. Render, then review every fast moment frame by frame. </build> <gotchas> Cause before effect: the starburst comes after the press, never before; every sound lands on its action's frame. The answer window opens only after the burn has cleared, never over live flames. Type on fixed lines so the camera never chases a wrapping caret. Hold every line long enough to read: at least 1.2s. </gotchas> <start> Ask me for the inputs, then show me the storyboard (ask, click, answers, burn, answer, card) before writing the full film. </start>