tldraw's AI turns pull requests into narrated videos, and HyperFrames, Framefields and Remotion want to render yours

Hand tldraw’s coding agent a pull request URL and it hands back an MP4. The pr-walkthrough skill in the tldraw repo reads the commits and the diff, writes a narration as if it were the PR’s author, voices each segment with Google’s gemini-3.1-flash-tts-preview, and renders code slides with subtitles. The goal, in the skill’s own words, is “the same benefit as would a loom video created by the pull request’s author.”

The rules read like a director’s notes. “The narration drives everything,” the skill says, and the default picture is the diff itself, with text slides “the exception.” It aims for 5 to 7 minutes of narration, and the voice is set to “Iapetus (always).” The finished file lands at 1280×720 and about 30 to 60 MB for an eight-minute video.

The captions come from a local Whisper transcript, and Whisper hears the company’s own name wrong. The skill admits that “tldraw” comes out as “TL Draw” and that this “could be normalized later via a substitution table.” Nobody has bothered yet.

tldraw didn’t start here. In April, Steve Ruiz merged a pull request that swapped the walkthrough’s Remotion renderer for HyperFrames to “shrink the pr-walkthrough video footprint and add whisper-timed captions.” The diff reads +958 / -4960, and “the old Remotion project (package.json, tsconfig, React slide components, lockfile) is removed.”

HyperFrames, from HeyGen, is the one tldraw picked. A video is an HTML page with timing in data attributes, and “the renderer seeks each frame in headless Chrome and encodes the result with FFmpeg, so the same input produces the same video.” Its pitch against Remotion is “plain HTML that humans and agents can both write easily.” The repo has about 70,000 stars, and its own regression tests are videos: roughly 240 MB of golden .mp4 baselines that each build gets checked against. Version 0.8.186, out October 22, wires motion blur into renders and “turns itself off, saying why, on pages it cannot blur safely.”

HyperFrames’ adopters page lists tldraw for “automated pull-request walkthrough videos” and Skyflo for “product launch films, authored end to end by AI agents from script to soundtrack selection.”

Framefields takes the opposite bet on the browser. The repo, created October 2 by gatewai-dev and sitting near 500 stars, promises “No Chromium, no Puppeteer, no DOM reflows, and no screenshot pipeline.” Compositions are TypeScript, and frames render through WebGPU on Metal, Vulkan or D3D12. The agent loop is spelled out: “Your coding agent writes TypeScript, inspects rendered frame grids, and exports hardware-encoded MP4s headlessly.” That frame grid is the agent checking a contact sheet of its own work before it exports.

Their launch film was rendered with Framefields itself, from TypeScript in the repo’s examples folder.

Play the video on YouTube

Remotion has been around since 2020 under the tagline “Make videos programmatically with React.” It has agent skills too, installed with npx skills add remotion-dev/skills, meant for “AI agents like Claude Code, Codex, Kimi Code or Cursor”. The catch HyperFrames likes to point at is the license: Remotion is free for individuals and “a for-profit organization with up to 3 employees,” and bigger companies need a company license. HyperFrames and Framefields are both Apache 2.0.

HyperFrames also ships a skill called /remotion-to-hyperframes for “bringing existing video code or footage into HyperFrames (Remotion first…).” That one is aimed squarely at tldraw-style projects that started on Remotion and want off its license.

Steal this

Before you record a Loom for a big pull request, try having your agent script it from the diff with tldraw’s pr-walkthrough skill as the model: narration first, the diff on screen, one segment per change. Kind of like asking the author to walk you through it, except the author never gets tired of explaining.
When you pick a renderer for agent-made video, check the license against your headcount first. Remotion’s free tier stops at three employees at a for-profit company; HyperFrames and Framefields are Apache 2.0.
If your agent writes video, put a substitution table in front of the captions before the first one ships. Whisper will spell your product name phonetically, and tldraw’s own walkthroughs say “TL Draw.”
When a video is generated from source, keep a known-good render and compare new builds against it, the way HyperFrames keeps 240 MB of golden MP4s in its tests. This is like a screenshot test in a UI suite, with a few hundred megabytes of video standing in for the screenshot.

The next obvious step is a walkthrough attached to every pull request by default, rendered in CI next to the test results. tldraw’s skill still waits to be asked, and it still calls itself “an internal artifact.” Once those videos start showing up for outside contributors, reviewers will have to decide whether they watch the AI’s account of a change or read the change itself.

Somebody should still fix “TL Draw.”

More Software