Back to templates
Code-driven animation prompt for Claude Opus, shared as a text post
Prompt from @xelandre__ on X · ♥ 3
OtherClaude OpusFfmpegPlaywright
Watch the video 
Why it works
- Time-driven rendering: each frame is computed from its timestamp, so the output is deterministic and can be reproduced frame by frame.
- Frame-by-frame capture: headless Chrome with Playwright records each rendered frame, which keeps timing exact rather than relying on real-time recording.
- Motion blur is named in the prompt as a finishing step, giving movement a smoother, more filmed look.
- Code-generated sound is part of the same pipeline, so audio is produced alongside the visuals instead of being added separately.
Reference prompt
Remix template
Code-driven animation for [PRODUCT]: an HTML/JS page showing [FEATURES], where every frame is calculated from the time, captured frame by frame with headless Chrome (Playwright), then assembled with ffmpeg into an MP4 with motion blur and code-generated sound.Customize this prompt for my productOnly your product name is required. Nothing is uploaded.