Whiteboard Studio
Desktop studio for whiteboard animation videos, where a hand draws onto the board in time with a voiceover, with a full MCP server so an AI agent can produce a finished, narrated film without touching the interface. Natural offline narration with word timings, code-generated drawings, a reusable cast, camera moves and MP4 export up to 4K.
- TypeScript
- Electron
- React
- MCP
- Kokoro TTS
- SQLite
- Vitest
The problem
Whiteboard explainer videos teach well, but making one means drawing, animating and timing every element to a voiceover by hand, and most tools end up looking like clipart.
What was built
- A drawing engine where every element enters by being drawn: a pen that lifts, arcs and slows into corners, variable-width strokes, translucent ink and a lit, grained board, so the result looks hand-made.
- An MCP server that exposes every feature as a tool: an agent creates the project, composes new drawings, defines a cast, records narration, moves the camera, looks at rendered frames and exports the film.
- Free, offline narration in a natural voice (Kokoro, twelve voices) with exact word timings; one click retimes every drawing to finish on its sentence. ElevenLabs is optional.
- Forty code-generated drawings, a cast defined once and drawn the same way in every scene, and a library of 9,000+ licensed drawings, with a licence required at import and a credits file in every export.
- MP4 export at 1080p30, 1080p60, 4K, square and vertical, encoded in the browser engine with no ffmpeg; a pure, deterministic renderer checked by golden-frame regression tests.
- It powers OurAfrica Course Studio, which turns course outlines into narrated lesson videos automatically.