Kurz gesagt
Wähle HyperFrames, wenn ein KI-Agent die meisten deiner Videos schreibt, dein Team in HTML und CSS denkt oder du eine Apache-2.0-Lizenz ohne Gebühren in jeder Unternehmensgröße willst. Wähle Remotion, wenn dein Team schon React schreibt, du datengetriebene Videos in großem Umfang brauchst oder das ältere Ökosystem mit mehr Beispielen und einem bewährten Cloud-Renderer möchtest. Beide machen aus Code ein MP4. Keines von beiden ist ein Videoeditor – wenn also niemand in deinem Team Code schreibt, wirf einen Blick auf die Alternativen am Ende.
Bis vor Kurzem war das kaum ein Wettbewerb. Wer Videos mit Code machen wollte, nutzte Remotion. Dann hat HeyGen HyperFrames als Open Source veröffentlicht, es um schlichtes HTML statt React herum gebaut und mit Skills für Coding-Agents wie Claude Code, Codex und Cursor ausgeliefert. Jetzt stellen sich viele Teams dieselbe Frage: Worauf sollen wir aufbauen?
Kurz gesagt lösen beide dasselbe Problem mit unterschiedlichen Wetten. Remotion setzt auf React. HyperFrames setzt darauf, dass HTML das ist, was sowohl Menschen als auch KI-Modelle schon am besten schreiben. So wirkt sich das in der Praxis aus.
Was ist der Unterschied zwischen HyperFrames und Remotion?
Mit Remotion schreibst du Videos als React-Komponenten. Jedes Bild ist ein Rendering deiner Komponente bei einer bestimmten Bildnummer, die du mit useCurrentFrame() ausliest. Du animierst, indem du Werte aus dieser Nummer berechnest. Wenn du React kennst, fühlt sich das natürlich an. Wenn nicht, ist es viel Lernaufwand, nur um ein Logo zu bewegen.
Mit HyperFrames schreibst du Videos als HTML-Dateien. Du baust die Szene mit HTML und CSS auf, fügst Data-Attribute für Timing und Spuren hinzu und animierst mit allem, was du magst, solange die Animation an jede beliebige Stelle springen kann: GSAP-Timelines, CSS-Animationen, Lottie, Three.js, Anime.js oder die Web Animations API. Der Renderer öffnet die Seite in Headless Chrome, springt zu jedem Bild und kodiert das Ergebnis mit FFmpeg.
Beide sind deterministisch: Derselbe Code ergibt jedes Mal dasselbe Video, und genau das ist der Sinn, Video mit Code zu machen. Der Unterschied liegt in der Sprache, in der du es schreibst – und die entscheidet, wer in deinem Team (oder welcher Agent) daran arbeiten kann.
HyperFrames vs. Remotion auf einen Blick
| HyperFrames | Remotion | |
|---|---|---|
| Entwickelt von | HeyGen (Open Source) | Remotion (Quellcode einsehbar) |
| Du schreibst | HTML, CSS und beliebig positionierbare JavaScript-Animation (GSAP, Lottie, Three.js und mehr) | React-Komponenten (TSX) |
| Timing | Data-Attribute, in Sekunden | Bildnummern, über useCurrentFrame() |
| Build-Schritt | Keiner: Eine index.html-Komposition wird direkt abgespielt | Ein Bundler ist nötig |
| Lizenz | Apache 2.0, kostenlos in jeder Unternehmensgröße | Kostenlos für Einzelpersonen, gemeinnützige Organisationen und Teams mit bis zu 3 Personen; darüber eine Company License |
| Kosten für ein größeres Unternehmen | 0 $ Lizenz (du zahlst für dein eigenes Rendering) | 25 $ pro Monat und Platz oder 0,01 $ pro Rendering bei 100 $ Monatsminimum; Enterprise ab 500 $ pro Monat |
| Rendering | Headless Chrome und FFmpeg über die CLI, lokal, in Docker oder auf AWS Lambda; benötigt Node.js 22+ und FFmpeg | CLI oder Node-API, dazu Remotion Lambda, Cloud Run und Vercel für Cloud-Rendering |
| Unterstützung für KI-Agents | Offizielle Skills und Plugins für Claude Code, Codex, Cursor und Gemini CLI | Offizielle Agent-Skills für Claude Code, Codex, Cursor und weitere |
| Am besten für | Von Agents geschriebene Videos, Web-Teams, Motion, die wie eine Website aussieht | React-Teams, datengetriebene Videos in großer Menge, ausgereiftes Cloud-Rendering |
Lizenz und Preise geprüft auf github.com/heygen-com/hyperframes und remotion.dev am 3. November 2026. Preise ändern sich, prüfe sie also, bevor du dich festlegst.
Was eignet sich besser für KI-generierte Videos?
Das ist die Frage, die die meisten eigentlich stellen, denn beide Projekte sind gerade deshalb so beliebt, weil Coding-Agents inzwischen ordentliche Motion Graphics von allein schreiben können.
HyperFrames wurde genau dafür entworfen. Es liefert eine Reihe von Skills, die du in deinen Agent installierst, und die CLI ist standardmäßig nicht interaktiv, sodass ein Agent init, preview und render ausführen kann, ohne an einer Abfrage hängen zu bleiben. Es gibt auch keinen Build-Schritt: Die Komposition ist eine Webseite, die direkt abgespielt wird. Wichtiger noch: Die Ausgabe ist HTML, und davon haben Sprachmodelle mehr gesehen als von allem anderen. Wenn ein Agent eine GSAP-Timeline auf einer Webseite schreibt, ist er auf vertrautem Terrain.
Remotion funktioniert ebenfalls mit Agents. Es pflegt inzwischen eigene offizielle Agent-Skills, für das Anlegen von Projekten, das Schreiben von Kompositionen, Rendering, Untertitel und Karten, und viele Leute erzeugen jeden Tag Remotion-Videos mit Claude oder Cursor. Die Reibung entsteht dadurch, dass der Agent React, die Bildberechnung und Remotions eigene APIs gleichzeitig richtig treffen muss. Wenn etwas schiefgeht, ist der Fehler meist ein React-Fehler, kein Videofehler, und der ist für Nicht-Entwickler schwerer zu beheben.
Wenn ein menschlicher Entwickler den Code langfristig verantwortet, spielt das weniger eine Rolle. Wenn ein Agent den ersten Entwurf schreibt und jemand ihn nachbessert, indem er um Änderungen bittet, hat HyperFrames derzeit die Nase vorn.
Ist HyperFrames kostenlos? Und was kostet Remotion?
HyperFrames steht unter Apache 2.0. Du kannst es in jeder Unternehmensgröße kommerziell nutzen, ohne Gebühren pro Rendering. Du zahlst nur dafür, wo du es renderst: auf deinem eigenen Rechner, einem Server oder einer Cloud-Funktion. Einige optionale Agent-Skills, etwa um ein bestehendes Video als HyperFrames-Projekt nachzubauen, benötigen HeyGens kostenpflichtiges HyperFrames Pro. Das Framework selbst nicht.
Remotion ist kostenlos für Einzelpersonen, gemeinnützige Organisationen und Teams mit bis zu drei Personen. Darüber brauchst du eine Company License, und gezählt wird deine gesamte Organisation, nicht nur die Leute, die Remotion nutzen. Auf remotion.dev gibt es folgende Optionen: 25 $ pro Monat für jede Person, die Remotion-Code schreibt (von Hand oder mit einem Agent), oder 0,01 $ pro gerendertem Video mit einem Monatsminimum von 100 $, wenn du programmatisch renderst oder den Remotion Player einbettest. Eine Enterprise License hat ein Monatsminimum von 500 $. Für ein Fünf-Personen-Team, das ein Produkt darauf aufbaut, ist das ein echter, aber überschaubarer Posten: Das Minimum von 100 $ deckt 10.000 Renderings im Monat ab. Wenn ein Unternehmen Hunderttausende personalisierter Videos pro Monat rendert, sollte es vorher nachrechnen.
Fairerweise zu Remotion: Die Lizenzgebühr finanziert ein Vollzeitteam, das es pflegt, und Inhaber einer Company License werden zuerst beantwortet, was du bei einem Open-Source-Repository nicht bekommst.
Wo liegt Remotion weiterhin vorn?
Ökosystem. Remotion gibt es deutlich länger. Es gibt mehr Vorlagen, mehr Beispiele, mehr beantwortete Fragen und mehr Leute, die schon auf genau deinen Bug gestoßen sind.
Datengetriebene Videos in großem Umfang. Wenn du Tausende Videos aus einer Datenbank erzeugst, eines pro Kunde, macht das React-Modell von Remotion es leicht, Daten als Props zu übergeben, und Remotion Lambda ist ein erprobter Weg, um in der Cloud parallel zu rendern. HyperFrames hat ebenfalls einen Rendering-Pfad über AWS Lambda, der ist aber neuer.
React-Teams. Wenn dein Produkt schon React nutzt, können deine Komponenten, dein Designsystem und deine Typen direkt in deine Videos einfließen. Das ist ein großer Vorteil, den HyperFrames nicht bieten kann.
Wo liegt HyperFrames vorn?
Kein React nötig. Jeder, der eine Webseite schreiben kann, kann ein HyperFrames-Video schreiben. Das vergrößert den Kreis der Menschen (und Agents), die damit arbeiten können.
Jede Web-Animationsbibliothek nutzbar. Wenn dein Team für die Website schon mit GSAP oder Lottie animiert, lassen sich dieselben Fähigkeiten und sogar derselbe Code weiterverwenden.
Lizenz. Kein Zählen von Plätzen, kein Zählen von Renderings, kein Gespräch mit dem Einkauf.
Für Agents gebaut. Die Skills, die CLI-Standardwerte und das HTML-first-Design gehen alle davon aus, dass eine KI einen großen Teil des Schreibens übernimmt.
Was sind die besten Alternativen zu HyperFrames?
Wenn keines von beiden passt, lohnt sich ein Blick auf diese Optionen, sortiert danach, wer das Video schreibt.
Remotion, siehe oben. Die Standardalternative, wenn du React kennst.
Motion Canvas. MIT-lizenziert. Du schreibst Szenen in TypeScript, sie werden auf ein Canvas statt in das DOM gezeichnet, und ein Editor zeigt sie in Echtzeit in der Vorschau. Es ist beliebt für handgefertigte Erklärvideos und Visualisierungen, die zu einer Sprecherstimme synchronisiert sind, wie man sie aus Programmier- oder Mathe-YouTube-Videos kennt. Für automatisierte Pipelines weniger geeignet.
Revideo. Ebenfalls MIT-lizenziert und ebenfalls mit TypeScript-Szenen, mit einer Headless-Rendering-API, sodass du Videos von einem Server, einer Warteschlange oder einem Cronjob aus erzeugen kannst, dazu ein React-Player für Vorschauen. Es läuft überall, wo Node und ein Headless-Browser laufen, einschließlich Google Cloud Run. Gut für vorlagengetriebene Videos in großer Menge, wenn du Szenen gern als Code schreibst.
No-Code- und KI-Motion-Tools. Wenn im Team niemand Code anfassen möchte, ist ein Framework die falsche Ebene. Inzwischen gibt es Tools, die das Schreiben für dich übernehmen: Du beschreibst das Video in einfacher Sprache, eine KI baut die Animation, und du exportierst ein MP4. Unser Überblick über KI-Tools für Motion Graphics vergleicht sie, und wenn du von HeyGens anderen Produkten hierhergekommen bist, deckt unser Leitfaden zu HeyGen-Alternativen die Avatar-Seite ab.
Also: Was solltest du wählen?
Frag dich, wer den Code schreibt. Ein React-Entwickler: Remotion. Ein KI-Agent oder ein Webentwickler, der lieber HTML und GSAP schreibt: HyperFrames. Niemand: dann keines von beiden, sondern ein Tool, das es für dich schreibt.
Und wenn du dir immer noch unsicher bist, baue denselben 10-Sekunden-Clip in beiden. Das dauert einen Nachmittag, und danach weißt du, in welchem von beiden dein Team arbeiten möchte.
Häufige Fragen
- Ist HyperFrames besser als Remotion?
- Keines von beiden ist generell besser. HyperFrames ist besser, wenn ein KI-Agent das Video schreibt oder dein Team HTML und CSS bevorzugt. Remotion ist besser für React-Teams und für datengetriebene Videos in großem Umfang.
- Ist HyperFrames kostenlos?
- Ja. HyperFrames ist Open Source unter der Apache-2.0-Lizenz, für die kommerzielle Nutzung in jeder Unternehmensgröße kostenlos und ohne Gebühren pro Rendering. Einige optionale Agent-Skills benötigen HeyGens kostenpflichtiges HyperFrames Pro, das Framework, die CLI und die Kern-Skills dagegen nicht.
- Was ist eine gute Alternative zu HyperFrames?
- Remotion, wenn du React schreibst, Motion Canvas für handgefertigte Erklärvideos, Revideo für das Rendering von einem Server oder einer Warteschlange aus oder ein KI-Tool für Motion Graphics, wenn du gar keinen Code schreiben möchtest.
- Muss ich für Remotion bezahlen?
- Nur wenn deine Organisation vier oder mehr Personen hat – gezählt werden alle, nicht nur die Leute, die Remotion nutzen. Einzelpersonen, gemeinnützige Organisationen und Teams mit bis zu drei Personen nutzen es kostenlos. Größere Unternehmen brauchen eine Company License, die pro Platz oder pro Rendering abgerechnet wird.
- Wie starte ich ein HyperFrames-Projekt?
- Installiere Node.js 22 oder neuer und FFmpeg und führe dann npx hyperframes init aus. Mit npx hyperframes preview siehst du es im Browser, mit npx hyperframes render exportierst du ein MP4.
- Kann KI Remotion- oder HyperFrames-Videos schreiben?
- Ja. Beide liefern offizielle Agent-Skills für Coding-Agents wie Claude Code, Codex und Cursor. Die Ausgabe von HyperFrames ist schlichtes HTML ohne Build-Schritt, was es Agents tendenziell erleichtert, es gleich beim ersten Versuch richtig zu machen.
Lizenzen und Preise wurden am 3. November 2026 auf github.com/heygen-com/hyperframes, remotion.dev und remotion.pro geprüft und ändern sich oft. Offenlegung: Dieser Vergleich wird von fluos veröffentlicht, einem KI-Tool für Motion Graphics. fluos basiert auf HyperFrames und nutzt es, um die erstellten Videos zu rendern. Wir haben keine geschäftliche Beziehung zu HeyGen oder Remotion.