AI Captions · AI Voiceover · 500k CC0 Tracks · p5.js · Creative Coding
p5.js to MP4 — with
AI Audio & Captions
Frame-perfect rendering of your p5.js sketches — plus AI voiceover, auto-captions, 500,000 CC0 music tracks, intro/outro cards, and logo overlay. Everything saveFrames() makes painful, in one render.
1 free render · $5/month after · Cancel anytime
See it in action — a real render
Want to test with a real input file? Open the live sample animation →
How it works
Bundle your sketch
HTML + sketch.js in a ZIP
→
Upload and render
Frame-by-frame in Chromium
→
Download MP4
1080p H.264, ready to share
Features
Everything you need for p5.js to MP4
AI voiceover — 14 voices, local
Type a script and Kokoro TTS narrates your p5.js in one of 14 English voices. Runs entirely on-server — your script never goes to ElevenLabs, OpenAI, or any external API. Auto-ducks under background music.
AI captions from Whisper
Local Whisper (small.en) transcribes any spoken audio and burns time-synced captions directly into frames. Four caption styles — from subtle lower-thirds to bold TikTok-ready text. No API costs, no audio uploads.
500,000 CC0 music tracks
Search Freesound's entire CC0 catalog from inside Animation Machine. Cinematic, lo-fi, ambient, upbeat — every genre. Music loops or trims to match your p5.js's exact duration. No attribution required.
Frame-perfect canvas rendering
Your draw() loop runs in a real Chromium browser, stepped at a synthetic clock — 60fps output with zero dropped frames, even for heavy sketches.
FAQ
p5.js to MP4 — Common Questions
Can I export a p5.js sketch to MP4?
Yes — your sketch runs in a real Chromium browser and is captured frame by frame at a synthetic clock. No saveFrames() + ffmpeg pipeline, no dropped frames, no canvas-recording artifacts.
How do I prepare my p5.js sketch?
Zip your index.html and sketch.js together (the p5.js CDN script works fine). Sketches driven by draw() render naturally — upload the ZIP and pick a duration.
Will all p5.js features render correctly?
Animation Machine renders your p5.js animation in a full Chromium browser, so anything that displays correctly in a browser — including vector shapes, masks, effects, and image assets — will render correctly in the video.
What resolution and quality can I export?
Export at 1920×1080 (landscape), 1280×720 (720p), 1080×1920 (portrait), or 1080×1080 (square). Quality presets are Draft (fast), Standard, and High. Portrait and square use a crop-to-fill approach for clean output.
Can I add background music to my p5.js video?
Yes. Search our 500,000-track CC0 music library or upload your own audio file. The music is automatically looped and trimmed to match your animation's exact duration.
Can I export a p5.js animation as GIF instead of MP4?
Yes. Animation Machine supports both MP4 and animated GIF export. GIF works well for short loops that need to autoplay in emails or messaging apps; MP4 is better for longer animations or when file size matters.
How much does Animation Machine cost?
Animation Machine is $5 per month with unlimited renders. No per-export fees. Cancel anytime from your account settings.
Also available