How I Built an AI Video Pipeline with Zero Cloud APIs

A fully local stack that turns a script into a professional animated video

A few weeks ago I set myself a challenge: generate a professional animated video entirely from code — no cloud APIs, no video editing software, no subscriptions.

The result? A polished 60-second animated explainer, AI-narrated and frame-accurately animated, built entirely on open-source tools running on my laptop.

Here’s how the pieces fit together.

The Stack

Four tools. Each does one job cleanly.

Kokoro-82M handles the voice. It’s an open-source TTS model that runs locally via ONNX — no API key, no usage limits. The quality surprised me. It doesn’t sound robotic, handles technical terms naturally, and synthesizes a full minute of audio in seconds. Apache 2.0 licensed.

HyperFrames handles the composition. This is the most interesting piece. It’s a video framework built on a simple idea: write your scenes as a web page — HTML, SVG, CSS — and it renders them into a video. The framework opens your composition in a headless browser, seeks through the animation timeline frame by frame, and pipes everything to ffmpeg. If you can build an animated web page, you can build a video. No proprietary format. No GUI dependency.

GSAP handles the animation inside HyperFrames. It gives you precise, easing-based control over every visual element at a specific timestamp. The triangle drawing itself, squares expanding, numbers popping in — all defined as a single seekable timeline.

ffmpeg encodes the final MP4. One command, handled automatically. Nothing interesting to say about it — which is exactly right.

The Result

A 60-second Pythagorean theorem explainer. 1920×1080. Color-coded animated diagrams, synchronized AI narration, rendered entirely on a laptop.

No API keys. No internet required. 6.3 MB output.

[embed]

What Worked

The pipeline fits together surprisingly well. Each tool does its job and gets out of the way. The composition is a plain HTML file — version-controllable, previewable in a browser, renderable on any machine with the same output every time.

Kokoro’s voice quality clears the bar for educational content comfortably. HyperFrames’ seek-based rendering means every render is bit-for-bit identical — no drift, no variation.

Rough Edges

HyperFrames is early-stage. The model is clean but documentation is sparse. Kokoro has a quality ceiling — good enough for most content, but not indistinguishable from a professional voice actor. And render time scales with visual complexity.

Final Thoughts

What this experiment proves is that the pipeline is now viable. Local TTS quality has crossed a threshold. Browser-based video composition exists and works. The pieces are there — they just need assembling.

A workflow that used to require a voice actor, a motion designer, and a video editor can now start with a text file and a render command.

I’m planning to generalize this into a reusable template. If that’s something you’d find useful, reach out.

Find me on GitHub or LinkedIn.