kbohara315/what-if-animation

What If Animation

Ein Themensatz rein, eine fertige 15–25 Sekunden lange Episode raus. Jeder Frame ist SVG, das Claude schreibt (gerendert von Remotion); die Stimme und die Sounds kommen von ElevenLabs. Zwei Beispiele sind in studio/src/episodes/ enthalten, beide bereit zum Rendern: rewind („Was, wenn du 10 Sekunden zurückspulen könntest?“, der Proof-Clip: rückwärts abgespielte Aufnahmen als die Kraft) und copy-paste („Was, wenn du alles kopieren und einfügen könntest?“, der erste vollständige Durchlauf des Skills: eine neue Küchenkulisse, ein Schema für den Wissenschafts-Beat, ein Cliffhanger-Blackout). Lies das Referenzdokument, das deinem Thema am nächsten kommt, bevor du beginnst.

Datei	Inhalt
references/formula.md	Die 7-Takt-What-If-Formel, die 15–25 s-Form, Skriptregeln, Themenauswahl
references/look.md	Der gemessene Look, das Tempo, das Einstellungsvokabular sowie die Storyboard- und Bewegungs-Checklisten
references/kit.md	Die Bausteine: Engine, Figuren, Sets, Raum-Kit, Licht, UI, Looks und wie man sie hinzufügt
references/sound.md	Sound-Events schreiben, Prompts, Pegel, Kosten
references/traps.md	Alles, was bei den beiden Beispielen Zeit gekostet hat
studio/	Das Remotion-Projekt: einmal kopieren, dann lebt jede Episode darin
scripts/	voice, plan, stills, board, sfx, mixcheck, motiongrid, master (Python 3.9+ und Node)

Regeln

• Nur eigene Figuren. Pip (der Held, Look B) und Mo (sein Freund) gehören uns, ebenso wie Schwester, Mutter und der Anzug auf dem Rig. Niemals der eigene Held eines Kanals und nichts, was an eine berühmte Cartoon-Figur erinnert: Jeden neuen Look auf dem Figurenblatt prüfen (Mos erster Hut wurde verworfen, weil er an eine solche Figur erinnerte).
• Eigene Geschichten. Die Formel wird geteilt; die Episode gehört niemand anderem. Keinen Titel eines Kanals nachmachen.
• Niemals behaupten, die viralen Kanäle seien mit Claude oder einem anderen Tool erstellt. Niemand hat gesagt, wie sie gemacht werden.
• Schlüssel nur beim Namen nennen. ELEVENLABS_API_KEY, aus der Umgebung oder einer .env oberhalb des Studios. Nie einen Schlüssel ausgeben, einfügen oder hartcodieren.
• Die ElevenLabs-Guthaben jeder Ausführung melden. Die Skripte protokollieren sie in out/<slug>/costs.json und master.py summiert sie in report.json. Die Kosten der Stimme werden aus dem Kontoverlauf gelesen (exakt); Soundclips erscheinen dort nicht, daher stammen ihre Kosten vom Kontozähler, der nachhinken kann: Vor der Meldung erneut auslesen. Die Zahl nennen, wenn die Episode übergeben wird. Der copy-paste-Durchlauf kostete 152 Credits (78 für die Stimme, 74 für 12 neue Clips).
• Storyboard vor der Animation. Kein Video-Rendering, bevor die Standbilder die Selbstprüfung (Schritt 5) bestanden haben und, wenn die Person im Loop ist, sie das Board gesehen hat.
• Jede Tatsache ist echt. Eine Zahl im Skript wird zuerst berechnet und im science-Feld der Episode belegt.

Einrichtung (einmal pro Maschine)

Benötigt Node 18+, ffmpeg und ffprobe im PATH, Python 3.9+ mit numpy und Pillow sowie einen ElevenLabs-Key.

cp -r <skill>/studio ./what-if-studio && cd what-if-studio && npm install

Alles unten wird von diesem Studio-Ordner aus ausgeführt; <skill> ist der Ordner dieses Skills. Um offline oder mit einem eigenen Markenauftritt zu arbeiten, eine Display-Schriftart in public/fonts/ ablegen und titleFont in src/studio.config.ts setzen (die Standard-Titelschriftart Bricolage Grotesque und die UI-Schriftarten werden zur Renderzeit von Google Fonts geladen). Um ein bestehendes Studio auf eine neuere Engine zu aktualisieren, <skill>/studio/src/engine über das vorhandene src/engine kopieren.

Die Pipeline

Der Reihe nach durch die Schritte arbeiten. Jeder endet mit etwas, das du dir vor dem nächsten Schritt ansiehst.

1. Skript

references/formula.md lesen. Zuerst auf YouTube nach der Prämisse suchen: Wenn ein What-If-Kanal bereits genau diese Episode hat, die Kraft oder die Regel ändern. Aus dem Themensatz das Wort für die Kraft, ihre Regel, drei eskalierende Demos und die Wendung (eine echte Tatsache mit Zahl) festlegen. src/episodes/<slug>/episode.json schreiben mit id (PascalCase, der Kompositionsname), slug, topic, title (zwei Zeilen), script (ein Eintrag pro Takt) und science (jede Tatsache: die Behauptung, die Berechnung, die Quelle). 45 bis 65 Wörter. Laut im Tempo vorlesen: Jede Zeile muss ein Bild sein.

2. Stimme

python <skill>/scripts/voice.py <slug>

Ein ElevenLabs-Take mit Zeichen-Zeitstempeln (der 356-Zeichen-copy-paste-Take kostete 78 Credits), dann werden die Pausen auf das Tempo des Genres zugeschnitten: public/<slug>/voice.wav und src/episodes/<slug>/words.json. Die Länge (15–25 s) und die ausgegebenen Wortzeiten prüfen. Pausen mit gaps in episode.json nachjustieren und erneut ausführen: Der Take ist gecached, also kostenlos. Ein Wort ändern und die API wird erneut aufgerufen.

3. Einstellungsliste

Pro Bild im Skript eine Einstellung entwerfen (normalerweise 9 bis 14), dabei Größe und Winkel bei jedem Schnitt variieren (Totale, Detail, Halbnah, Nah, Über-die-Schulter, Aufsicht, Untersicht; siehe references/look.md). Zu episode.json hinzufügen:

• shots: { "id": "S1", "size": "medium", "set": "kitchen", "key": 14, "note": "was wir sehen" } (key ist der Frame der eigenen Uhr der Einstellung, den das Storyboard zeigt)
• edit: { "shot": "S1", "at": "cookie" } pro Schnitt, ausgelöst auf dem Wort, auf dem er landet (plan.py listet die Cue-Formen auf; reverse, from, to und look für Kräfte, die die Uhr einer Einstellung biegen)
• fx: Ein-Frame-Blitzlichter und Erschütterungen, { "at": "S3+2", "kind": "flash" }

python <skill>/scripts/plan.py <slug>

Es schreibt timeline.json und out/<slug>/shotlist.md und gibt das Tempo aus. Auf 27+ Schnitte pro Minute im Opening und keine statische Einstellung über ca. 3 s abzielen; reparieren, was es anmahnt, bevor etwas gezeichnet wird.

4. Storyboard

references/kit.md für die Bausteine lesen. src/episodes/<slug>/shots.tsx schreiben, eine Komponente pro Einstellung, jede eine reine Funktion ihrer Uhr t (die Muster in den beiden Beispielen shots.tsx kopieren), sowie index.tsx (die Episode und ihr Kraft-Look), dann die Episode zu src/episodes/index.ts hinzufügen. In diesem Schritt muss jede Einstellung nur an ihrem key-Frame stimmen. Wenn ein Thema einen Ort benötigt, den die Bibliothek nicht hat, ihn mit dem Raum-Kit bauen und zu src/engine/sets/ (und zur Kopie des Skills) hinzufügen, wie es der copy-paste-Durchlauf mit der Küche und dem Schema gemacht hat. Eine neue Figur oder ein neues Kostüm: Den Look hinzufügen, dann auf dem Figurenblatt prüfen (npx remotion still src/index.ts Cast out/cast.png).

npx tsc --noEmit
node <skill>/scripts/stills.mjs <slug>
python <skill>/scripts/board.py <slug>

out/<slug>/storyboard.jpg: ein beschriftetes Standbild pro Einstellung.

5. Standbilder selbst prüfen

Das Storyboard ansehen, dann jedes Standbild in out/<slug>/board/ in voller Größe öffnen und die Storyboard-Checkliste in references/look.md ehrlich durchgehen, Einstellung für Einstellung. Aufschreiben, was nicht bestanden wird, reparieren, nur diese Einstellungen neu rendern (stills.mjs <slug> S3 S7), das Blatt neu erstellen und erneut prüfen. Wiederholen, bis es bestanden ist. references/traps.md auf den Fehler prüfen, den man sieht, bevor man eine eigene Lösung erfindet. Wenn die Person im Loop ist, ihr jetzt das Board zeigen und ihre Notizen aufnehmen, bevor animiert wird.

6. Animieren

Jede Einstellung von ihrer Schlüsselpose aus zum Leben erwecken: poseAt-Keys mit Antizipation, Halten und Überschwingern, faceAt für Ausdrücke, Kamerafahrten mit kf, der Kraft-Look, die fx. Dann einen Entwurf rendern und die Bewegung prüfen:

python <skill>/scripts/master.py <slug>
python <skill>/scripts/motiongrid.py <slug> S2 S5
node <skill>/scripts/stills.mjs <slug> --frames 120 240

Die Raster wie ein Daumenkino gegen die Bewegungs-Checkliste in references/look.md lesen; reparieren und neu rendern, bis es stimmig ist.

7. Sound

references/sound.md lesen. sound zu episode.json hinzufügen: die Clips (Prompt und Länge), ein Event pro sichtbarer Aktion, ausgelöst auf ihrer Einstellung, Atmosphären pro Ort, die Musikbettung und die Pegel. Prüfen, was die Bibliothek bereits hat, dann generieren:

python <skill>/scripts/sfx.py <slug> --dry
python <skill>/scripts/sfx.py <slug>

Es gibt die verbrauchten Credits aus und setzt die Spurlautstärken in timeline.json. Dann prüfen, dass jedes Wort verständlich bleibt:

python <skill>/scripts/mixcheck.py <slug>

Es listet die Momente auf, während ein Wort gesprochen wird, in denen Effekte oder Musik innerhalb von 3 dB der Stimme liegen. Ein Treffer, der ein Wort illustriert, landet in der Pause direkt danach, nie darauf; eine Bettung (ein Summen, ein Dröhnen) unter einer wichtigen Zeile wird leiser gestellt; wenn der Großteil der Spur die Stimme überlagert, sfx_lu senken. sfx.py und die Prüfung erneut ausführen, bis nur noch beabsichtigte Überlappungen übrig sind (ein Titel-Knall, eine Wendung).

8. Master und Übergabe

python <skill>/scripts/master.py <slug>

Rendert, bringt den Mix auf -14 LUFS mit Spitzen unter -1 dBTP und schreibt out/<slug>/report.json (Länge, Lautstärke, Tempo, Credits). Die finale Datei einmal komplett mit Ton ansehen. out/<slug>/<slug>-final.mp4 und out/<slug>/storyboard.jpg übergeben, mit der Länge, den verwendeten ElevenLabs-Credits und allem, was man noch verbessern würde.

Wo eine Episode lebt

Pfad	Was
src/episodes/<slug>/episode.json	Alles, was du schreibst: Skript, Wissenschaft, Einstellungen, Schnitt, FX, Sound
src/episodes/<slug>/shots.tsx, index.tsx	Die Zeichnung: eine Komponente pro Einstellung, der Kraft-Look
src/episodes/<slug>/words.json, timeline.json	Geschrieben von voice.py und plan.py (sfx.py fügt die Lautstärken hinzu)
public/<slug>/	voice.wav, sfx.wav, music.wav
out/<slug>/	Board-Standbilder, storyboard.jpg, shotlist.md, Bewegungsraster, Renderings, costs.json, report.json
library/sfx/	Jeder generierte Soundclip, von allen Episoden gemeinsam genutzt