$npx skillfedfor your agent
REPO

Constraining the canvas before the agent touches it is what makes AI animation work

on: JohnHeibel/ClaudeAnimationBase

ClaudeAnimationBase is a scaffolded starter kit for generating short animated videos by pointing a coding agent at a structured codebase and a detailed style guide. The actual creative output is p5.js animation rendered headlessly through Chrome and assembled into MP4 via ffmpeg - the model writes scene code, the renderer executes it frame by frame.

The interesting design decision here is the separation of concerns. The character, Clawd, ships with predefined views, emotions, mouths, eyes, hats, and dances already implemented in clawd.js. The agent never has to invent a drawing system from scratch; it composes from a known vocabulary. That's what makes the "very little" prompting work - the model isn't solving a blank canvas problem, it's filling in a storyboard against a constrained API.

The ANIMATION_GUIDE.md file is doing real work. It encodes aesthetic rules - handmade feel, no text on screen, transitions mandatory, something must happen in every scene, brush strokes and boiling linework as the medium - that would otherwise require careful prompting every time. Baking those constraints into a document the model reads first is a practical form of system-prompt engineering without touching the model's actual system prompt. The storyboard-before-code instruction is also notable: it forces the model to plan scene structure before committing to implementation, which the author found improved coherence.

The reasoning level observation is worth sitting with. The author reports that higher reasoning settings produce more "extravagant" and detail-oriented scenes. All test videos were generated with Opus at the highest reasoning setting in Claude Code. That's a meaningful data point about how extended thinking affects creative generation, not just analytical tasks - though it comes with the obvious cost implication of running extended reasoning on a creative coding loop.

The GPU situation is handled honestly. Watercolour fills in p5.brush are slow without dedicated graphics - seconds per frame, not milliseconds. The README doesn't hide this; it suggests asking the model to swap those fills for something lighter if you're on integrated graphics. The Linux headless path gets specific: --no-sandbox for Ubuntu 23.10+, EGL or Vulkan flags for NVIDIA cloud nodes, a gpu_probe.mjs script to check which renderer flags actually land. That level of operational detail suggests this was tested seriously, not just assembled for a demo.

The kit traces back to a real music video project, and the README points there explicitly. That provenance matters - the abstractions here were extracted from something that actually shipped, not designed speculatively. The character model sheets (emotions, views, motion, hats) are included as reference images the model can use directly, which closes the loop on the "give it your own reference images" suggestion in a concrete way.

For anyone building agent-driven generative media pipelines, the structural lesson is straightforward: constrain the output space aggressively before the agent touches it, encode your aesthetic rules as readable documents rather than prompt strings, and let the model operate as a scene composer rather than a renderer inventor.

A well-extracted scaffold that shows how pre-built character APIs and written style rules let an agent compose animation without reinventing the drawing system each time.

Install it

Sources & links