Recreating the viral riso animation with Claude Code + Opus 5: full prompt, process and token cost

GoldianSummer · reddit · 2026-09-16

A Reddit user recreated the viral risograph-style animation (original by Kevin Ngo) from scratch using Claude Code with Opus 5, publishing the full brief, workflow and token stats.

Output: a single 224 KB, 3,500-line index.html in pure Canvas 2D — no libraries, images or network calls. Every ink is its own halftone layer with a screen angle; offsets fake misregistration with paper grain on top. Everything is seeded and render(t) is a pure function of time; music is synthesized via WebAudio at 120 BPM. 26 scenes total, exported to MP4 via a built-in record button.

Process: a 10k-character brief explicitly forbids one-shotting — engine first, then scenes in batches of 8 visually checked, then later acts, then a full inspection pass. Claude self-checked by rendering frames in a headless browser and reviewing contact sheets every 0.25s around transitions; a 100ms jank was traced via profiling to a single closePath() on a huge path. Total wall clock: 5h40 in one session.

Tokens: 716k output, 43M cached input read, 1.5M written. The author notes cost lives in the write-look-fix iteration loop, not frame count.

Original post →

More from coding & agent

coding & agent channel →