Remotion vs HyperFrames: the same launch scene, built twice
By Yannis Coulibaly · November 8, 2026
The short answer
For the same scene, the result is the same: both renders show every word on exactly the same frames, and the pixels differ only in text rendering. Choose on everything else. HyperFrames is plain HTML with no build step and an Apache 2.0 licence. Remotion is React, with a mature cloud renderer, and needs a paid licence for companies of four people or more.
Most comparisons of the two tools are written from their documentation. We built the same thing twice instead. The reference is a real launch scene: 2.6 seconds of kinetic type from Zapier's Ask film, four words that replace each other. Launchscene's export_recipe tool turned its measured timing into one starter file for each tool, with our own four words in place of Zapier's. Then we rendered both, unchanged.
Timing: identical, to the frame
| Word | Reference timing | Remotion frames | HyperFrames frames |
|---|---|---|---|
| SCENES | 0 – 0.52 s | 0 – 15 | 0 – 15 |
| TIMING | 0.80 – 1.32 s | 24 – 39 | 24 – 39 |
| CAMERA | 1.33 – 1.85 s | 40 – 55 | 40 – 55 |
| SOUND | 2.13 – 2.60 s | 64 – 77 | 64 – 77 |
We found the frames where text is visible in each MP4. Both put every word on the frame its measured time calls for, at 30 frames per second. Timing is data in both starter files, so neither tool drifts: the accuracy comes from the measurement, which reads text four times a second.
Pixels: nearly the same
Compared frame by frame, the two videos have a mean structural similarity (SSIM) of 0.989, where 1 means identical. The lowest frames, at 0.979, are the ones showing TIMING: the same font is rasterised slightly differently. You would not see it without a side-by-side.
Render time and files
| Remotion | HyperFrames | |
|---|---|---|
| Starter file | LaunchsceneRecipe.tsx, 2,741 characters | index.html, 1,966 characters |
| First render on our Mac | 1 min 46 s, browser download included | 28 s |
| Second render | 11.3 s | 13.7 s |
| MP4 size | 32 KB | 45 KB |
Remotion downloads its own headless browser on the first render, which explains the first number. After that, the two are within a few seconds on a clip this short. For long films or many renders, test on your own machine: this is one 2.6-second scene.
What differs: how you write it, and the licence
| Remotion | HyperFrames | |
|---|---|---|
| A video is | A React component that reads the current frame | An HTML page with timed elements and a paused animation timeline |
| Build step | A bundler | None: index.html plays as is |
| Preview | Remotion Studio | In the browser, or its preview command |
| Cloud rendering | Remotion Lambda | Local, Docker or AWS Lambda paths |
| Licence | Free up to 3 people; Company License above | Apache 2.0 |
Remotion is free for individuals and companies of up to three people. Larger companies need a Company License: $25 a month per person writing Remotion code, or $0.01 per render with a $100 monthly minimum for automations (Remotion licence FAQ). HyperFrames is open source under Apache 2.0 with no per-render fees (HyperFrames repository); the GSAP library its starter uses has its own standard licence. Both checked on 8 November 2026.
Which one to pick
Our reading: the tool does not change how a launch scene looks; the timing and the design do. Pick HyperFrames if you want plain HTML that any agent writes easily, no build step and no licence question. Pick Remotion if your team already lives in React, if you need its mature cloud renderer, or if you are three people or fewer and want its Studio. Launchscene exports both, so you can switch.
The two starter files are here, unchanged: LaunchsceneRecipe.tsx and index.html. To build your own, see how to make a launch video with Claude Code.
