Communitygithub.com

What-If Reel Maker

Erstelle aus einer einzeiligen Idee ein 60-sekündiges vertikales ‚What if…‘-3D-Wissenschafts-Video (Three.js-Szene, Erzähler, Untertitel, Sound) für @the.whatif.studio.

Was ist What-If Reel Maker?

Der What-If Reel Maker ist ein KI-gestütztes Tool, das aus einer einzigen Idee (z. B. „Was wäre, wenn der Mond für 5 Sekunden verschwindet?“) ein komplettes, 60-sekündiges Wissenschaftsvideo im vertikalen Format (1080x1920, 30 fps) erstellt. Es richtet sich an Entwickler und KI-Agenten-Nutzer, die automatisierte Video-Pipelines für den Instagram-Kanal @the.whatif.studio aufbauen möchten. Das Tool übernimmt die gesamte Produktion: die physikalische Analyse mit validierten Zahlen, das Erstellen eines Drehbuchs mit präzisen Zeitstempeln, die Sprachsynthese über Kokoro-ONNX, den Aufbau einer deterministischen Three.js-3D-Szene mit Low-Poly-Stil, das Rendern von Ebenen (Platte & Overlay), die Soundmischung (Hintergrundgeräusche, Soundeffekte, automatisierte Pegelsteuerung) und den finalen Compositing-Schritt zu einer MP4-Datei. Es unterstützt die Betriebssysteme Windows und macOS, benötigt Node 18+, Python 3.10+ und ffmpeg und vermeidet unnötige Rückfragen, indem es sinnvolle Standardeinstellungen wählt – der Benutzer muss nur die eine Idee vorgeben und kann am Ende die finale MP4-Datei sowie eine caption.txt für Instagram erhalten.

Funktioniert mit~Claude Code~Codex CLI~Cursor
npx skills add gitbasitmalik/viral-3d-videos

In Ihrer bevorzugten KI fragen

Öffnet einen neuen Chat, in dem dieser Agent-Skill bereits geladen ist.

Dokumentation

Was macht What-If Reel Maker?

Der Benutzer gibt EINE Zeile vor (z. B. "Was wäre, wenn der Mond für 5 Sekunden verschwindet?"). Du erledigst alles andere und lieferst final.mp4 (1080x1920, 30 fps, 60 s, mit Erzähler, Untertiteln und Soundeffekten) plus caption.txt für Instagram. Stelle keine Fragen, es sei denn, die Idee ist unklar. Wähle sinnvolle Standardeinstellungen und teile mit, welche du gewählt hast.

Der Hausstil ist eine in Code (Three.js) erstellte Low-Poly-3D-Umgebung aus der realen Welt. Sie enthält ein Countdown-HUD oben links, kursive Serifen-Untertitel, einen Abschnitt "Röntgen" mit weißem Umriss auf schwarzem Hintergrund, eine Übersichtsaufnahme (Planet/Weltraum/Mikro), eine eskalierende Nachwirkung und eine Endkarte mit einem "Folgen"-Button. Handle: @the.whatif.studio.

0. Einmalige Einrichtung (prüfen, nur Fehlendes installieren)

Erfordert Node 18+, Python 3.10+ und ffmpeg im PATH (winget install ffmpeg / brew install ffmpeg).

Projektstammverzeichnis: ~/whatif/ (erstellen, falls nicht vorhanden). Gemeinsame Engine-Dateien liegen im Stammverzeichnis, jedes Video in videos/<slug>/.

mkdir -p ~/whatif/models ~/whatif/videos && cd ~/whatif
npm init -y && npm i [email protected] playwright @fontsource/cormorant-garamond @fontsource/ibm-plex-mono
npx playwright install chromium
pip install kokoro-onnx soundfile scipy numpy
curl -L -o models/kokoro-v1.0.onnx https://github.com/thewh1teagle/kokoro-onnx/releases/download/model-files-v1.0/kokoro-v1.0.onnx
curl -L -o models/voices-v1.0.bin https://github.com/thewh1teagle/kokoro-onnx/releases/download/model-files-v1.0/voices-v1.0.bin

Kopiere dann die Engine-Dateien aus dem Ordner engine/ dieses Skills in das Stammverzeichnis, falls sie noch nicht vorhanden sind (siehe Abschnitt 9). Unter Windows verwende python statt python3.

1. Physik zuerst (am wichtigsten)

Kommentatoren werden die Wissenschaft überprüfen. Bevor du etwas schreibst:

  • Finde heraus, was WIRKLICH passiert. Schreibe die Überlegungen und alle Zahlen in videos/<slug>/physics.md und berechne die Zahlen mit einem schnellen Python-Skript.
  • Suche nach der kontraintuitiven Wendung (z. B. Schwerkraft aus: Anfangs scheint nichts zu passieren, weil das zusammengepresste Gestein, Wasser und die Luft nach außen federn und dieser Schubs sich wie Schwerkraft anfühlt). Die Wendung ist der Haken.
  • Überprüfe Schlüsselaussagen mit einer Websuche, wenn verfügbar. Wenn etwas unsicher ist, mildere die Formulierung ("für Minuten", "Kilometer") und erfinde niemals präzise Zahlen.

2. Drehbuch (videos/<slug>/script.json)

Folge dieser 60-Sekunden-Taktvorlage (verschiebe Zeiten, wenn die Geschichte es erfordert):

ZeitTaktVisuellHUD
0–8Normale Welt, HakenLangsame Kamerafahrt durch die Umgebung; Titel 0.2–3.9<EREIGNIS> Countdown 8.00 S→0, sub = Ort
8.0Ereignis tritt einWelle + Chroma-Puls—
8–28Ereignisfenster, verlangsamt dargestellt (z. B. 5 echte s bei 4x)zuerst normale Ansicht, dann Röntgen<EREIGNIS ENDET> IN 5.00 S, sub 4X LANGSAMER · <live-Wert>
16–24Verborgener MechanismusUmrissmodus + leuchtende Partikelgleich
24–28Großes Bildseparate Szene (Planet/Weltraum/Zellen), weißer Blitz rein & rausgleich
28RückkehrBlitz + Knall<DING> / ZURÜCK
28–52Eskalierende NachwirkungSchütteln, Risse, Wellen, Trümmer usw.Schlüsselwert (z. B. 176 KM/H)
~46Pointe—"Und ja. ."
51.2–52Ausblenden auf Schwarz
52–60EndkarteFaktenzeile + FOLGEN FÜR MEHR WHAT IFS, Tastendruck ~57.3—

Erzählung: 14–16 Zeilen, ≤3 Wörter pro Sekunde, ruhiger dokumentarischer Ton. Zeile 1 bei 0.3 s ist die Titelfrage. Die Endkarte hat zwei Zeilen: einen ein-sätzigen Fakt (~52.7) und "Folgen für mehr What Ifs." (~56.6). Untertitel sind verkürzte Versionen der Erzählzeilen (≤2 Zeilen, <br> zwischen).

{
 "handle": "@the.whatif.studio",
 "voice": "am_michael",
 "title": "Was wäre, wenn die Schwerkraft<br>für 5 Sekunden verschwindet?",
 "titleEnd": 3.9,
 "endTitle": "Was wäre, wenn die Schwerkraft für 5 Sekunden verschwindet?",
 "endFact": "Du spürst nie die Schwerkraft. Du spürst den Boden, der zurückdrückt.",
 "duration": 60, "endStart": 52, "press": 57.3,
 "narration": [[0.3, "Was wäre, wenn die Schwerkraft verschwindet... für fünf Sekunden?"], [4.1, "Genau jetzt zieht die Schwerkraft an jedem Atom in diesem Park."]],
 "captions": [[4.1, 7.9, "Genau jetzt zieht die Schwerkraft<br>an jedem Atom in diesem Park."]]
}

3. Stimme zuerst, dann Timing anpassen

Führe python3 gen.py <slug> aus. Es schreibt videos/<slug>/audio/lNN.wav und durs.json und gibt die Länge jeder Zeile aus. Wenn eine Zeile die nächste Zeile oder einen Taktwechsel überschneidet, kürze den Text oder verschiebe ihn und führe es erneut aus. Setze dann jeden Untertitel auf [start, start + duration + 0.35, text]. Stimmen: am_michael (Standard männlich), af_heart (beste weiblich), bm_george (britisch männlich).

4. Szene erstellen (videos/<slug>/scene.js)

Schreibe für jedes Video eine neue Szene. Sie muss build(h), update(t, h) und hud(t) exportieren (Vorlage in Abschnitt 9). Regeln:

  • Deterministisch: Verwende nur h.rnd()/h.R(a,b) (gesät) zur Build-Zeit. Alles in update ist eine reine Funktion von t. Verwende niemals Math.random, Date oder performance.now.
  • Zeitlupe über Weltzeit: w = t<8 ? t : t<28 ? 8+(t-8)/4 : 13+(t-28). Animiere Personen, Wasser und Wolken mit w.
  • Aussehen: Low-Poly-Primitive mit flatShading. Modelliere einen realen Ort grob (Pier, Park, Straße, Strand). Kisten für Gebäude (Canvas-Fenster-Textur), Kiste+Kugel-Personen in verschiedenen Farben, instanziierte Bäume, schwarze Laternenpfähle mit weißen Kugeln. Füge einen Farbverlaufs-Himmel-Shader, Sprite-Wolken, THREE.Fog für Tiefe und eine Sonne DirectionalLight mit Schatten (Schattenkamera ±45) + HemisphereLight hinzu.
  • Kamera: vertikales Sichtfeld ~58, Augenhöhe 1.7–2.2 m, langsame Kamerafahrt und sanfte Neigungen. In der Nachwirkung füge Schütteln aus summierten Sinuskurven hinzu.
  • Röntgenphase: gib outline: 0→1 zurück (einblenden über ~0.6 s). Während es aktiv ist, setze Gebäudekarten auf null und verstecke Wolken (verhindert rauschende Kanten). Optional gib overScene zurück: eine additive Points-Szene (depthTest false) für Streifen/Partikel.
  • Große Übersichtsaufnahme: erstelle eine zweite Szene + Kamera und gib sie als scene/camera für 24–28 zurück.
  • FX, die von update zurückgegeben werden: flash (0–1 weiß), chroma, ripple + rp (Ringradius), fade (0→1 bei 51.2–52).
  • Performance: Halte Draw-Calls unter ~400 (Instancing) und vermeide viele große transparente Sprites nahe der Kamera, da diese Überzeichnung sehr langsam ist.
  • Halte Text aus den unteren 20% und der rechten Kante (Instagram-UI) heraus. Untertitel liegen bei y≈1240.

5. Vorschau, dann korrigieren

Führe node render.js preview <slug> 2,6,10,18,22,26,30,40,47,55 aus. Es schreibt JPEGs nach videos/<slug>/prev/. Öffne sie und prüfe: Ist der Ort erkennbar, sind die Untertitel lesbar, ist der Umrissmodus sauber, ist die Übersichtsaufnahme gut eingerahmt, wirkt die Nachwirkung dramatisch? Behebe Probleme und erstelle erneut eine Vorschau. Rendere das vollständige Video erst, wenn die Standbilder gut aussehen.

6. Ebenen rendern

Die Szene (Plate) und der Text (Overlay) werden getrennt gerendert, sodass Textkorrekturen kein 3D-Neu-Rendering erfordern.

# plate: aufgeteilt auf Prozesse (einer pro 2 CPU-Kerne), jeder auf eigenem PORT; nur 0..endStart (Rest ist schwarz)
LAYER=plate PORT=8781 node render.js full <slug> plate1.mp4 0 26
LAYER=plate PORT=8782 node render.js full <slug> plate2.mp4 26 52
LAYER=overlay PORT=8783 node render.js full <slug> overlay.mov 0 60

Führe diese im Hintergrund aus und überwache die Logs. Wenn WebGL SwiftShader meldet (langsam, CPU), versuche HEADFUL=1, um die echte GPU zu nutzen.

7. Sound (videos/<slug>/mix.py)

Kopiere die Mix-Vorlage aus Abschnitt 9 und bearbeite den EVENTS-Block, um die Takte zu treffen: Atmosphäre, Countdown-Ticks, einen Anstieg vor dem Ereignis, Boom beim Ereignis und der Rückkehr, ein Schimmern im Röntgen, ein Whoosh in die Übersichtsaufnahme, ein Grollen/Risse oder andere Nachwirkungsgeräusche, das End-Pad und den Tastendruck Pop. Es platziert die Erzählung automatisch und senkt die Effekte unter der Stimme ab. Führe es aus, normalisiere dann:

python3 videos/<slug>/mix.py <slug>
ffmpeg -y -i videos/<slug>/mix.wav -af loudnorm=I=-14:TP=-1.5:LRA=11 -ar 48000 videos/<slug>/mix_norm.wav

8. Compositing und Auslieferung

cd videos/<slug>
ffmpeg -y -i plate1.mp4 -i plate2.mp4 -f lavfi -t 8 -i "color=black:s=1080x1920:r=30" -i overlay.mov -i mix_norm.wav \
 -filter_complex "[0:v][1:v][2:v]concat=n=3:v=1:a=0,format=yuv420p,setsar=1[b];[b][3:v]overlay=format=auto,format=yuv420p[v]" \
 -map "[v]" -map 4:a -c:v libx264 -preset veryfast -crf 23 -c:a aac -b:a 192k -movflags +faststart -shortest final.mp4

(Die Länge des schwarzen Clips = Dauer − endStart.) Extrahiere 8–10 Frames aus final.mp4 und sieh sie dir vor der Auslieferung an. Schreibe caption.txt: eine Aufhängerzeile, 2–3 Sätze der echten Physik, "Folge @the.whatif.studio für mehr What Ifs" und 12–15 Hashtags (#whatif #physics #science #3danimation …). Teile dem Benutzer mit, dass er in CapCut leise Musik mit 15–20% Lautstärke hinzufügen kann.

9. Engine-Dateien

Die wiederverwendbare Engine befindet sich im Ordner engine/ dieses Skills. Kopiere die Dateien daraus – tippe sie nicht neu ab. Eine gemeinsame Engine wird von jedem Video wiederverwendet; zwei Dateien werden pro Video kopiert und dann bearbeitet.

Gemeinsame Engine (einmal in ~/whatif/ kopieren):

  • engine/index.html → ~/whatif/index.html
  • engine/main.js → ~/whatif/main.js
  • engine/render.js → ~/whatif/render.js
  • engine/gen.py → ~/whatif/gen.py

Pro Video (für jedes neue Video kopieren, dann bearbeiten):

  • engine/scene.template.js → videos/<slug>/scene.js – schreibe die Szene für jedes Video neu (siehe Abschnitt 4). Muss build(h), update(t, h), hud(t) exportieren.
  • engine/mix.py → videos/<slug>/mix.py – bearbeite den EVENTS-Block, um die Takte zu treffen (siehe Abschnitt 7).
# SKILL_DIR = Ordner dieses Skills; vom Projektstammverzeichnis ausführen (~/whatif)
cp "$SKILL_DIR"/engine/{index.html,main.js,render.js,gen.py} ~/whatif/
cp "$SKILL_DIR"/engine/scene.template.js videos/<slug>/scene.js
cp "$SKILL_DIR"/engine/mix.py            videos/<slug>/mix.py

Qualitäts-Checkliste vor der Auslieferung

  • Physik überprüft und Zahlen berechnet; die Wendung ist in den ersten 15 s klar.
  • Jede Erzählzeile passt in ihren Takt ohne Überschneidungen; Untertitel stimmen mit der Erzählung überein.
  • Vorschauen sahen gut aus; das endgültige Video wurde an 8–10 Frames stichprobenartig geprüft.
  • Der Handle zeigt @the.whatif.studio; die Endkarte funktioniert und der Tastendruck erfolgt direkt nach "Folge für mehr What Ifs".
  • Lautstärke liegt bei etwa −14 LUFS; die Stimme ist deutlich über den Effekten hörbar.

Verwandte Skills