Du nimmst regelmäßig Videos oder Reels auf und hättest gern Animationen, Overlays und Untertitel drin, ohne jedes Element selbst in After Effects zu bauen? In diesem Snip zeige ich dir HyperFrames Studio, eine Open-Source-App, in der ein KI-Agent wie Claude Code die Animationen für dich programmiert und über dein Video legt. Du siehst einmal den kompletten Weg: Video und Referenzbilder rein, Prompt schreiben, Feedback direkt im Bild markieren und am Ende als MP4 exportieren.
Ergebnis: Nach diesem Snip hast du HyperFrames Studio eingerichtet und ein eigenes Video mit animierten Overlays, Untertiteln und Soundeffekten als fertige MP4-Datei auf deinem Rechner.
- Lade dir HyperFrames Studio über die Website herunter und installiere die App. Sie läuft aktuell nur auf macOS und Linux, eine Windows-Version gibt es noch nicht.
- Geh beim ersten Start durch das Onboarding und melde dich mit einem HeyGen-Account an. HeyGen läuft im Hintergrund und macht aus deinem Projekt am Ende eine MP4-Datei.
- Wenn du willst, trägst du im Onboarding die URL deiner Website ein. HyperFrames zieht daraus ein Brand Kit mit Farben, Schriftarten und Logos, damit deine Videos zu deiner CI passen. Pflicht ist das nicht.
- Öffne die Settings und wähle unter “Agent” deinen KI-Agenten aus: Claude Code, Codex oder Grok. Dafür brauchst du einen bezahlten Plan beim jeweiligen Anbieter (Claude, ChatGPT oder Grok), mit einem kostenlosen Account funktioniert es nicht. Unter “Permissions” legst du fest, was der Agent darf.
- Klick auf “New Project”. Links siehst du den Chat mit deinem Agenten, rechts die Dateiablage, unten Timeline und Player.
- Zieh dein Rohvideo per Drag & Drop in die Dateiablage oder lade es über “Import Files” hoch. Es landet dann unter “Assets”.
- Such dir Referenzbilder für den Look, den du haben willst (zum Beispiel auf Pinterest Illustrationen im Glass-Design), lade sie herunter und zieh sie ebenfalls in die Dateiablage.
- Bereite deinen Prompt vor. Am einfachsten gibst du Claude dein Videoskript und lässt dir daraus einen Prompt für HyperFrames schreiben. Rein gehören Stil, Tempo, Ablauf, konkrete Animationsideen sowie Untertitel und Soundeffekte.
- Füg den Prompt im Agenten-Chat ein und verknüpfe die Dateien an den passenden Stellen: Häng das Video an die Stelle, an der es um das bestehende Video geht, ergänze einen Satz wie “Orientiere dich an Farben und Schriftarten von [deiner Marke]” und füge die Referenzbilder über “Use” an. Dann abschicken, der erste Durchlauf dauert ein paar Minuten (bei mir rund 10).
- Schau dir das Ergebnis im Player an. Wenn dich etwas stört, nutzt du die Draw-Funktion, kreist die Stelle im Bild ein und schreibst deine Änderung dazu, zum Beispiel “Untertitel weiter unten setzen”. Mit Escape raus und abschicken. Kleine Korrekturen sind meist in unter einer Minute drin.
- Wenn du zufrieden bist, startest du den Export. Das Video wird lokal gerendert, das dauert einen Moment und dein Rechner wird dabei etwas lauter. Danach öffnest du die MP4 über “Open Video” oder “Show in Finder”.
- Verstehen, wie HyperFrames funktioniert: Der Agent schreibt HTML-Code mit Animationen, der wie eine animierte Website über dein Video gelegt und dann gerendert wird.
- HyperFrames Studio einrichten, einen KI-Agenten verbinden und optional ein Brand Kit aus der eigenen Website ziehen.
- Einen Prompt so aufbauen, dass Video, Referenzbilder und Brand Kit gezielt mit den richtigen Anweisungen verknüpft sind.
- Mit der Draw-Funktion gezieltes Feedback direkt im Videobild geben und nachbessern lassen.
- Einschätzen, wofür sich HyperFrames eignet und wofür nicht: Overlays, Animationen und Imagefilme ja, Grobschnitt lieber weiter manuell.
- Erstellung von Erklärvideos mit animierten Infografiken.
- Produktion von Social-Media-Clips mit animierten Titeln und Übergängen.
- Visuelle Aufbereitung von Präsentationen mit dynamischen Animationen.
- Integration von animierten Marketinginhalten in Werbevideos.
- Entwicklung von Lernvideos mit interaktiven, animierten Elementen.
Als nächstes
