Home / Free library / ENGINE
KEYWORD · ENGINE / EDITOR
Unlimited reels, zero credits: the setup
How to make animated reels with code on your own laptop: free voice, real motion graphics, captions timed to every word, no watermark.
FROM THE REEL
How it works
- Script: an AI writes the script from one line, using hook formulas.
- Voice: a free text-to-speech model (Kokoro) records the voiceover on your laptop.
- Scenes: every scene is a small web page (HTML + JavaScript) animated by time.
- Frames: a headless browser (Playwright) screenshots every frame.
- Video: FFmpeg joins the frames, voice and sound effects into an MP4.
- Review: the AI looks at sample frames and fixes anything that overlaps or gets cut off.
What to install (all free)
| Tool | Why | Get it |
|---|---|---|
| Claude Code (or any coding agent) | Builds and runs everything | docs.claude.com |
| Node.js 18+ | Runs the renderer | nodejs.org |
| Python 3.10+ | Runs the voice | python.org |
| FFmpeg | Makes the MP4 | ffmpeg.org |
| Playwright | Renders frames | npm i playwright |
| kokoro-onnx | Free offline voice | pip install kokoro-onnx |
The starter prompt
Open an empty folder in Claude Code and paste this:
Build me a reel engine in this folder. - Input: projects/<slug>/video.json with scenes (type, say, data). - voice.py: speak each scene's 'say' with kokoro-onnx, save voice.wav and word timings to timeline.json. - player.html: a 1080x1920 stage; each scene type is a function of time t (hook, list, chat, stat, cta). Captions follow the word timings. Expose window.renderAt(t) so every frame is deterministic. - render.js: open player.html with Playwright, call renderAt for every frame at 30 fps, pipe screenshots into ffmpeg, add voice.wav. - Before rendering, screenshot 1 frame per scene to build/review/ and check nothing overlaps. Then make a 30-second test reel about [topic].
Tips
- Keep one scene = one idea = one sentence of voiceover.
- Write a brand file once (colours, fonts, handle) and reuse it.
- Always review the frames before posting.
// next shortcut
You might like these too
// weekly drop
Get one new AI shortcut every week
Or follow @aishortcut.hq for a new shortcut every day.