Ecoupdigital/video-animado

/video-animado

Erstellt erzählte Videos mit 2D-Animation, gezeichnet in Code (SVG + Remotion). Unverhandelbare Regel: Keine externen Bild- oder Videotools mit KI (kein Kling, Veo, Flow, Magnific, Bildgeneratoren). Figur, Szene und Objekte entstehen aus Formen, SVG-Pfaden und Text. So bleibt die Figur in jeder Szene identisch und der Vorgang reproduzierbar.

Status: erstellt am 08.11.2026, noch nicht Ende-zu-Ende getestet. Bei der ersten echten Ausführung notiere in „Fallstricke“, was schiefgegangen ist.

Wie man mit der Person spricht

• Brasilianisches Portugiesisch, Tonfall eines praktischen Lehrers, Anrede „tu“ falls die Person „tu“ verwendet, sonst „você“. Kein Gedankenstrich.
• Die Person kann nicht-technisch sein. Sag, was passiert ist und was sich für sie ändert. Code und Pfade nur, wenn sie danach fragt.
• Jede Frage verwendet AskUserQuestion, eine nach der anderen, mit 2 bis 4 Optionen, die empfohlene zuerst und markiert mit „(Empfohlen)“. Wenn die Person „entscheide für mich“, „egal“ oder Ähnliches sagt, wähle die empfohlene Option aus, fahre fort und teile mit, was gewählt wurde.
• Frage nie, was man durch einen Blick in die Dateien herausfinden kann.

Wo die Dinge leben

• Studio: der Arbeitsordner für Videos der Person. Suche nach ~/meu-estudio/; falls nicht vorhanden, frage, wo es ist, oder verwende den aktuellen Ordner.
• Animations-Brandbooks: <studio>/animacao/<name-des-universums>/
  • BRANDBOOK-ANIMACAO.html: hübsche Version zum Ansehen und Teilen
  • BRANDBOOK-ANIMACAO.md: die Version, die Claude liest (gleiche Regeln; wenn eine sich ändert, ändere beide)
  • personagens/<name>/: FICHA.md, Personagem.tsx (die Zeichnung in Code) und expressoes.png
  • cenarios/: eine Komponente pro Szene (Casa.tsx, Rua.tsx…)
  • pronuncias.md (optional): wie jeder Begriff in der Stimme klingen und in den Untertiteln erscheinen soll
• Videos: <studio>/animacao/<name-des-universums>/videos/JJJJ-MM-TT-slug/
• Ausgabe: ~/Downloads/JJJJ-MM-TT_<slug>_animado.mp4

Ein Brandbook ist ein Universum (eine „Welt“ mit eigenem Namen). Darin gibt es 0, 1 oder mehrere Figuren.

Ablauf

0. Brandbook finden

Suche selbstständig: Ordner animacao/ im Studio und im aktuellen Ordner, sowie Dateien BRANDBOOK-ANIMACAO.*. Liste auf, was gefunden wurde, und frage:

• Eines davon verwenden (eines pro gefundenem Universum)
• Anderen Pfad angeben (auch ein von einer anderen Person erhaltenes Brandbook)
• Ein neues erstellen

Wenn nichts gefunden wird, sag das und gehe direkt zur Erstellung über. Wenn ein vorhandenes verwendet wird, lies die .md-Datei und die Steckbriefe und springe zu Teil B.

Teil A. Brandbook erstellen (erstes Mal)

Teile zu Beginn mit: „Ich werde etwa 25 bis 35 Fragen stellen, eine nach der anderen, und bei jeder kannst du ‚entscheide für mich‘ sagen.“ Zwischen den Blöcken fasse kurz zusammen, was entschieden wurde, und frage, ob es richtig ist. Fragen- und Optionenpool in references/perguntas.md (vor Beginn lesen).

Die 7 Blöcke in dieser Reihenfolge:

1. Universum: Name (schlage 3 Namen vor), Thema der Videos, Zielgruppe, Ton.
2. Figuren: Wie viele (0, 1 oder mehrere). Für jede den vollständigen Steckbrief (Geschlecht, Alter, Gesicht, Haare, Kleidung, Persönlichkeit, Begleiter wie Hund, Baby oder Pflanze, Stimme).
3. Szenen: Welche gibt es (Zuhause, Büro, Straße, Natur, abstrakter Raum…), welche Räume oder Orte, Tageszeit, feste Objekte.
4. Erzählung: Was jede Figur tut, wie sie sich verhält, wo sie sich aufhält, wie sie spricht, was sie nie tun würde, wie die Figuren miteinander umgehen.
5. Visuelles: Zeichenstil, der in Code möglich ist, Palette (exakte Hex-Werte mit Nutzungsanteil), Schriftarten, Detailgrad.
6. Bewegung: Szenenein- und -ausgänge, Ausdrücke, Rhythmus, Atmen und Blinzeln, Animationsregeln, was niemals getan werden darf.
7. Abschluss: Gesamtzusammenfassung, Stimme der Erzählung (siehe unten), endgültiger Name des Brandbooks.

Ohne Figur auch gültig: Video nur mit Szenen, Text und Formen. In diesem Fall überspringe Block 2 und die Blöcke 3 bis 6 beziehen sich nur auf die Welt und den Rhythmus.

Stimme der Erzählung, im Brandbook gespeichert, um nicht erneut fragen zu müssen, mit 3 Wegen:

1. Klon der Stimme der Person bei ElevenLabs;
2. vorgefertigte Stimme von ElevenLabs, die die Skill je nach Figur vorschlägt;
3. die Person hat bereits die Audiodatei aufgenommen und die Skill verwendet sie nur. Bei mehreren Figuren speichert jeder Steckbrief die Stimme der Figur.

Ausgaben von Teil A:

• BRANDBOOK-ANIMACAO.md und BRANDBOOK-ANIMACAO.html (Struktur in references/brandbook-html.md).
• Für jede Figur: FICHA.md, Personagem.tsx mit den Eigenschaften expressao, falando, olhando, escala (der Mund folgt der Lautstärke der Erzählung) und expressoes.png, ein Bild mit allen Ausdrücken nebeneinander.
• Eine Komponente pro Szene.
• Ein Testbild mit der Figur in einer Szene.

Fahre erst fort, wenn die Person die Ausdrücke und das Testbild mit eigenen Augen genehmigt hat. Wenn die Code-Zeichnung nicht gut wird, vereinfache die Zeichnung (weniger Details, mehr Form). Ersetze sie niemals durch ein externes Tool.

Teil B. Video erstellen

1. Einzige Frage (nur was fehlt): Thema, Dauer (standardmäßig 30 bis 60 s), Format (standardmäßig vertikal 1080×1920, 30 fps), welche Figuren und Szenen vorkommen.
2. Haken und Drehbuch zum HÖREN (lies references/roteiro.md). Zuerst 3 Optionen für den Haken verschiedener Typen, die Person wählt aus. Dann das Drehbuch: kurze Sätze, Zahlen wie gesprochen geschrieben, keine Klammern oder schwierigen Abkürzungen, keine verbotenen Sätze aus der Liste. Neben jedem Satz: die Szene, wer erscheint, der Ausdruck und was auf dem Bildschirm erscheint. Respektiere die Erzählung des Brandbooks. Am Ende liste separat die Tatsachenbehauptungen auf, die die Person bestätigen muss. Speichere in videos/<Datum-Slug>/roteiro.md und fahre nur mit Zustimmung der Person fort.
3. Erzählung, über den im Brandbook gespeicherten Stimmweg. Zeige das Audio an und warte auf Zustimmung. Seltsame Phrase: generiere nur diese eine Phrase neu. Verwende pronuncias.md falls vorhanden. Speichere narracao.mp3.
4. Zeitabstände jedes Wortes. Transkribiere die Erzählung mit Wort-Zeitstempeln (das Transkriptionswerkzeug, das das Studio bereits hat, aus dem Schnittkurs: mlx-whisper auf dem Mac). Korrigiere typische Whisper-Fehler bei Produktnamen und technischen Begriffen. Wenn die Person keinen Transkriptor installiert hat, sag es und hilf bei der Installation, bevor du fortfährst.
5. Remotion-Projekt in videos/<Datum-Slug>/ (verwende die Skill remotion-best-practices). Eine Hintergrund-Audiodatei (narracao.mp3). Jede Szene importiert die Komponenten des Brandbooks, zeichnet Figur oder Szene nie neu. Mund: extrahiere die Audiolautstärke pro Frame und verwende sie als falando, mit einem Mindestwert, um Zittern in der Stille zu vermeiden. Jedes Element entsteht bei dem Wort, das es erwähnt. Untertitel Wort für Wort im Stil des Brandbooks. React-Hooks niemals innerhalb von if oder nach einem vorzeitigen return.
6. Überprüfen vor dem Rendern. npx tsc --noEmit, dann einen Frame jeder Szene. Betrachte das Bild: Figur vollständig und gleich dem Steckbrief, Text ohne Überlappung oder Überschreitung der Breite, innerhalb des sicheren Bereichs, Mund synchron zur Stimme, Ausdruck und Szene korrekt zum richtigen Zeitpunkt. Details in references/conferencias.md.
7. Rendern, überprüfen und ausliefern. mp4 (H.264, AAC-Audio) in ~/Downloads/. Führe scripts/checar_video.py aus (Lautstärke, Größe, Stille), generiere ein Kontaktblatt und rufe den unabhängigen Revisor auf (Subagent, der die Montage nicht gesehen hat, Briefing in references/conferencias.md). Korrigiere schwerwiegende oder mittelschwere Fehler und rendere erneut. Liefere auch das Titelbild und die Bildunterschrift des Beitrags aus und biete die Formate 1:1 und 16:9 an (references/roteiro.md). Sag, was in jeder Szene ist, die Dauer, was der Revisor dachte und was geändert wurde, was die Person mit dem Gehör prüfen sollte (du hörst kein Audio) und wo das Projekt ist.
8. Anpassungen. Die Person bittet in alltäglichen Worten („die Figur ist zu ernst“, „erscheint schneller“) oder mit Zeitangaben („ändere den Titel bei 0:12“). Rechne Zeit in Frames um, greife nur in die betroffene Szene ein und zeige den Ausschnitt, bevor du alles renderst. Wenn die Regel für die nächsten Videos gilt, aktualisiere das Brandbook (beide Versionen); gilt sie nur für dieses, das Projekt.

Namensvorschlag

Immer wenn das Brandbook erstellt wird, schlage 3 Namen für das Universum vor (kurz, leicht auszusprechen) und lass die Person wählen oder einen anderen eingeben. Der Name wird zum Ordnernamen (Kebab-Case) und zum Titel des HTML.

Fallstricke

• Figur außerhalb des Brandbooks: Jede Szene importiert dieselbe Komponente.
• Mundbewegung ohne Sprache oder stiller Mund mit Sprache: Synchronisiere mit der Amplitude, mit einem Mindestwert.
• Externes Tool aus Bequemlichkeit: Wenn die Zeichnung nicht gelingt, vereinfache sie.
• Sprachguthaben ohne genehmigtes Drehbuch ausgeben. Sag vor der Generierung der Erzählung, wie viele Zeichen an die Stimme gehen, und warte auf ein Ja.
• Ohne Durchgang durch den unabhängigen Revisor ausliefern: Wer montiert hat, sieht die eigenen Fehler nicht.
• Brandbook nur in HTML speichern: Claude liest die .md-Datei, halte beide gleich.
• (Bei der ersten echten Ausführung ausfüllen.)