whaleyxbt / claude-motion

# claude-motion
**A motion design toolkit for coding agents.** Remotion skills teach your agent the API. This teaches it taste, makes it check its own frames, and gives it a sound engine. And when the idea is a simulation, not a motion graphic, it renders web sims frame by frame to 60 fps video.
Works with Claude Code and Cursor out of the box (skills in `.claude/skills/`), and with Codex, OpenCode or anything else that reads `AGENTS.md`.
 Made by Claude with this toolkit from one prompt and one revision. No After Effects, no stock sounds. How it was made → 
## New: web sims → 60 fps video
 Made by Claude with this toolkit. Left: the crawler swarm (340K+ views on X). Middle: one username → a dossier . Right: a rocket engine explorer with a fly-through and an exploded view. 
Some videos are simulations: 256 agents doubling on the beat, a rocket engine the camera flies through. Those are easier to write as a web page than as React, so `sims/` is a second pipeline:
- **One HTML page per piece**, three.js and fonts inlined, works offline. Open it and it plays live.
- **`render(t)` is a pure function of time.** Agents and physics are simulated once at load, so any frame can be drawn on demand.
- **Frame-exact capture.** Headless Chromium steps the page frame by frame into ffmpeg: 60 fps at 1440×1800 (or any size), no matter how slow a frame is.
- **Cuts on the beat.** `beats.py` finds the tempo, bars and drop of a track and hands them to the sim.
- **Three examples to take apart:** `crawlers`, `dossier`, `engine` (with its sound generated in Python).
 [code] 
Ask your agent:
 [code] 
## What your agent gets
**Motion rules with numbers.** Easing curves, spring presets, stagger, reading holds, type scale, one-accent color, texture, motivated transitions. Not "make it smooth": `bezier(0.16, 1, 0.3, 1)` for entrances, exits at half the duration, 0.09 s between words. → `motion-design`
**A self-review loop.** Agents can't watch video, but they can look at frames. The agent renders a draft, gets a contact sheet with one timestamped frame per beat, checks it against a list (collisions, clipping, holds, safe area, phone readability) and fixes what it finds before saying it's done. → `review-loop`
**A sound engine.** Pure Python stdlib, no samples, no licenses. Generators for typing, clicks, pops, whooshes, risers, chimes, impacts, textures and pads; a mixer that places sounds on the same timeline as the picture; mastering that hits −14 LUFS by itself. The agent writes one cue sheet per video and adds generators when it needs a new sound. → `sound-design`
**One timeline for everything.** Every beat is a named timestamp in a JSON file. Scenes, sound and review all read it, so retiming the video retimes the sound and the checks with it.
**A reference piece to take apart.** The video above, with reusable components: masked text reveals, rolling numbers, film grain, hand-drawn line boil, a background with drifting grid and glow.
## Quick start
**Let your agent set