TIPS 56 · VIDEO

Dieses Video hat Claude geschnitten

Videos aus Code mit Remotion und Claude Code: die offiziellen Skills, der Ablauf vom Skript bis zur fertigen Datei, die Prüfung der Einzelbilder und wie du alles in einen Skill packst, der mit einem Befehl startet.

Was es ist und warum es zählt

45 Sekunden Hochkant-Video von Hand zu schneiden heißt Stunden: Schnitte, Untertitel Wort für Wort, Timing. Und änderst du einen Satz im Skript, machst du die halbe Arbeit noch mal.

Remotion ändert das: Es ist eine Bibliothek, die Videos mit React macht. Jedes Video ist ein React-Projekt, jede Szene eine Komponente, also ein Stück Code, das sagt, was in jedem Einzelbild zu sehen ist. Weil es Code ist, kann Claude Code ihn schreiben, ändern und exportieren. Du änderst einen Satz, generierst neu, und das Video ändert sich.

Unsere Videos machen wir so, mit einem eigenen Skill: Ich schreibe ihm die Idee, und er macht Skript, Stimmen, Untertitel, Szenen, Export und prüft dann die Einzelbilder eins nach dem anderen. Diese Anleitung ist für alle, die Videos veröffentlichen müssen und weder Zeit noch Lust haben, Schneiden zu lernen.

1. Das Projekt und die offiziellen Skills

Du brauchst Node.js und Claude Code. Remotion hat eine eigene Seite für Claude Code, und das sind ihre Befehle, der Reihe nach:

Die Befehle
npx create-video --yes --blank my-video
cd my-video
npx remotion skills add
npm run dev

Der erste legt ein leeres Projekt an, der dritte installiert die Skills von Remotion für Agenten, der letzte öffnet Remotion Studio: die Videovorschau im Browser. Dann startest du in einem zweiten Terminal, im selben Ordner, claude. Die Skills lassen sich auch mit npx skills add remotion-dev/skills installieren. Jeder wird mit einem Schrägstrich aufgerufen:

  • /remotion-best-practices: enthält alle anderen. Wenn du nicht weißt, welchen du nehmen sollst, nimm diesen.
  • /remotion-create: ein neues Projekt oder eine neue Komposition (eine Komposition ist ein Video, mit Größe, Bildern pro Sekunde und Dauer).
  • /remotion-markup: Animationen, Layout, Texte, Schriften, Audio und Timing.
  • /remotion-captions: die Untertitel.
  • /remotion-render: exportiert ein Video oder ein einzelnes Bild.
  • /remotion-upgrade: aktualisiert Remotion und die installierten Skills.

2. Vom Skript zur fertigen Datei

  1. Das Skript. Kurze Sätze, eine Sache pro Satz. Bei uns sind 45-55 Sekunden etwa 120 Wörter.
  2. Die Stimmen: ElevenLabs oder OmniVoice. Eine Audiodatei pro Satz: So dauert jede Szene genau so lang wie ihr Satz, und änderst du einen, generierst du nur den neu.
  3. Untertitel auf den Wörtern. Man transkribiert das Audio mit dem Timing jedes Wortes. Remotion kann das auch lokal und kostenlos, mit Whisper.cpp (das Paket @remotion/install-whisper-cpp), und mit createTikTokStyleCaptions() fasst es die Wörter zu Seiten zusammen wie in den sozialen Netzwerken.
  4. Die Szenen. Eine Komponente pro Szene, aneinandergereiht mit dem Timing aus dem Audio, nie von Hand eingetippt. Die Größe legt die Komposition fest: für ein Hochkant-Video 1080×1920.
  5. Der Export, mit npx remotion render. Dann die Prüfung, die einen eigenen Abschnitt verdient.
Die Nachricht
Erstell aus diesem Skript ein 45 Sekunden langes Hochkant-Video: [Skript]. Nimm Remotion, 1080×1920, eine Szene pro Satz, Stimmen mit [ElevenLabs oder OmniVoice], eine Audiodatei pro Satz, Untertitel auf den Wörtern. Nimm das Timing aus dem Audio, tipp es nicht von Hand ein. Zeig mir vor dem Export die Liste der Szenen mit Anfang und Ende.

3. Die Prüfung der Einzelbilder

Das ist der Teil, der den Unterschied macht, und den ich von Hand nie machen würde. Claude schaut ein Video nicht so wie du, Bilder aber schon. Also exportiert es Standbilder an den Stellen, die zählen, eins mit npx remotion still, viele auf einmal mit npx remotion render und der Option --frames, und legt sie auf einen Kontaktbogen: ein Blatt mit allen Bildern im Raster. Dann schaut es ihn an und sucht nach:

  • Text, der über den Rand läuft oder unter den Buttons der App landet;
  • einen Untertitel, der nicht zum Wort passt, das gerade gesprochen wird;
  • ein leeres oder schwarzes Bild genau am Schnitt;
  • ein Element, das zu früh erscheint, oder einen Bildschirm, der nicht zeigt, was die Stimme sagt.
Die Nachricht
Prüf jeden Schnitt auf einem Kontaktbogen: Exportier ein Bild kurz vor und eins kurz nach jedem Schnitt, dazu eins in der Mitte jedes Untertitels, leg sie in ein Raster mit der Bildnummer darunter und schau es dir an. Such mir abgeschnittene Texte, falsche Untertitel, leere Bilder. Korrigier, exportier neu und mach den Bogen noch mal, bis er sauber ist. Dann sag mir, was du korrigiert hast.

4. Alles in einem Skill, ein Befehl mit der Idee

Wenn der Ablauf funktioniert, packst du ihn in einen Skill. Ein Skill ist ein Ordner mit einer Datei SKILL.md darin: die Anweisungen, denen Claude Code folgt, wenn du /name-des-skills tippst. Leg ihn in ~/.claude/skills/<name>/SKILL.md, um ihn in allen Projekten zu haben, oder in .claude/skills/<name>/SKILL.md, nur für dieses. Was du nach dem Befehl schreibst, kommt im Skill als $ARGUMENTS an. Unserer funktioniert so: Ich tippe den Befehl und die Idee, er macht den Rest.

Die Datei
---
name: video
description: Erstellt ein Hochkant-Video mit Remotion, von der Idee bis zur fertigen Datei.
disable-model-invocation: true
argument-hint: [Idee für das Video]
---

Idee: $ARGUMENTS

1. Schreib das Skript: <Länge>, kurze Sätze. Zeig es mir und warte auf mein OK.
2. Erzeug die Stimmen mit <ElevenLabs oder OmniVoice>, eine Datei pro Satz.
3. Transkribier das Audio mit dem Timing jedes Wortes und leg die Untertitel auf die Wörter.
4. Bau die Szenen nach stil.md.
5. Exportier in 1080×1920.
6. Mach den Kontaktbogen jedes Schnitts und prüf ihn mit pruefungen.md. Korrigier, bis er sauber ist.
7. Sag mir, wo die Datei liegt und was du korrigiert hast.

disable-model-invocation: true heißt, dass er nur startet, wenn du ihn aufrufst: Ein Video kostet Zeit und Guthaben für die Stimmen, besser nicht aus Versehen starten. Stil und Prüfliste stehen in eigenen Dateien im selben Ordner: Claude liest sie nur, wenn sie gebraucht werden. Die Dokumentation empfiehlt, SKILL.md unter 500 Zeilen zu halten.

Die Nachricht
Mach aus dem, was wir heute gemacht haben, einen Skill: Leg .claude/skills/video/SKILL.md mit den Schritten in der richtigen Reihenfolge an, schreib den Stil in stil.md und die Prüfungen und die gefundenen Fehler in pruefungen.md. Nimm disable-model-invocation: true und die Idee in $ARGUMENTS.

5. Die Lizenz von Remotion

Remotion ist kostenlos, auch kommerziell, wenn du eine Einzelperson bist, ein Unternehmen mit höchstens 3 Beschäftigten oder eine gemeinnützige Organisation, und auch zum Ausprobieren, bevor du es beruflich nutzt. Ab mehr als 3 Beschäftigten brauchst du die Company License. Remotion oder eine eigene veränderte Version weiterverkaufen darfst du nicht. Lies vor dem Start die Lizenzseite noch einmal, weil sich die Bedingungen ändern können, und prüf auch die Bedingungen des Dienstes, den du für die Stimmen nutzt.

Häufige Fehler

  • Die Szenenzeiten von Hand eintippen. Sobald du einen Satz änderst, verrutscht alles: Das Timing kommt aus der Länge des Audios.
  • Nur das fertige Video anschauen. Einen Fehler, der ein Bild lang dauert, siehst du bei normaler Geschwindigkeit nicht: auf dem Kontaktbogen schon.
  • Untertitel aus einer Transkription nach Sätzen. Du brauchst das Timing jedes Wortes, sonst kommt der Text vor oder nach der Stimme.
  • Ein Skill, der von selbst startet. Ohne disable-model-invocation: true kann Claude ihn starten, wenn eine Anfrage danach aussieht.
  • Die Lizenz für selbstverständlich halten. Hat das Unternehmen mehr als 3 Beschäftigte, brauchst du die Company License.

Checkliste

  • Das Remotion-Projekt startet und Remotion Studio zeigt die Vorschau
  • Die Remotion-Skills sind installiert und /remotion-best-practices antwortet
  • Eine Audiodatei pro Satz, und die Szenenzeiten kommen aus dem Audio
  • Die Untertitel folgen den Wörtern, nicht den Sätzen
  • Der Kontaktbogen jedes Schnitts ist sauber
  • Der Skill startet mit /name und der Idee, und nur, wenn ich ihn aufrufe
  • Ich habe geprüft, dass die Lizenz von Remotion mein Unternehmen abdeckt

Häufige Fragen

Muss ich React können?

Nein, den Code schreibt Claude. Aber eine Szene lesen zu können hilft: Wenn dir etwas nicht gefällt, kannst du „schieb den Titel in Szene 3 weiter nach oben“ sagen statt „überzeugt mich nicht“.

Und wenn ich nach dem Export einen Satz ändere?

Du änderst den Satz im Skript, erzeugst nur die Stimme für diesen Satz neu, und Claude passt das Timing an, exportiert neu und prüft den Kontaktbogen wieder. Genau deshalb lohnt sich eine Audiodatei pro Satz.

Funktioniert das nur mit Claude Code?

Nein. Die Seite von Remotion zu Agenten nennt auch Codex, Kimi Code und OpenCode, und die Skills folgen dem offenen Standard Agent Skills. Diese Anleitung nutzt Claude Code, weil ich es nutze.

← Alle Anleitungen