Communitygithub.com

Antonod1988/code-explainer-film

Erstelle einen vollständigen, vertonten Kurzfilm oder eine animierte Erklärung vollständig in Code, ohne Videogenerator: Canvas-2D-Illustration und Three.js-3D-Einblendungen, frame-genau als MP4 aufgenommen, eine neuronale Sprachausgabe, deren Wortzeitsteuerung den Schnitt steuert, Musik und Soundeffekte, die in numpy synthetisiert werden, separate Versionen pro Sprache, Überprüfung von Bild und Ton ohne menschliches Eingreifen sowie Lieferkopien für Telegram, YouTube und X. Verwende dies immer dann, wenn der Benutzer eine Animation, eine Erklärung, einen Video-Essay, einen Lehrfilm oder ein Intro wünscht.

Was ist code-explainer-film?

Diese Fähigkeit ermöglicht es dir, vollständige animierte Erklärfilme oder Kurzfilme ausschließlich mit Code zu erstellen – ohne Videogeneratoren oder klassische Schnittsoftware. Das Herzstück ist ein „Voice-First“-Ansatz: Du schreibst ein Script mit Markern, lässt es von einer neuronalen Sprachausgabe vorlesen, erhältst die exakten Zeitstempel jedes Wortes und leitest daraus den gesamten Schnitt sowie die visuelle und auditive Untermalung ab. Das Ergebnis ist ein ausführbares Programm, bei dem jeder Frame eine reine Funktion der Zeit ist. Dies ermöglicht präzise Iterationen, Änderungen in Sekunden, das problemlose Erstellen mehrerer Sprachversionen durch einfaches Neuausführen und vollständige Kontrolle über Bild, Ton und Schnitt. Die Fähigkeit wird über die Befehlszeile gesteuert und umfasst Tools für Texterstellung, Sprachsynthese, 2D- und 3D-Rendering mit Canvas und Three.js, Audiokomposition in numpy sowie die finale Ausgabe für Plattformen wie Telegram, YouTube und X.

Funktioniert mit~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/Antonod1988/code-explainer-film/tree/HEAD/skills/code-explainer-film

In Ihrer bevorzugten KI fragen

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

Dokumentation

Film in Code

Der Film ist ein Programm. Jeder Frame ist eine reine Funktion der Zeit, die von dir geschriebener Code zeichnet, und die Stimme, die Musik und jeder Ton entstehen ebenfalls aus Code. Es sind keine Bild- oder Videogeneratoren beteiligt. So kann jede Sekunde geändert und neu gerendert werden, und eine andere Sprache ist ein erneuter Durchlauf, kein neuer Schnitt.

Diese Pipeline hat einen 5:16-Film auf Russisch und Englisch erstellt: 16 Beats, 57 Cues, zehn 3D-Einblendungen, etwa 1,5 bis 2 Stunden vom Skript bis zur ersten Sprache, 14 bis 16 Minuten Rendering pro Sprache auf einem Laptop. Der Code dieses Films befindet sich in assets/examples/court-astronomer/.

Die eine Idee: Stimme zuerst

Schreibe das Skript mit Markern. Lass es vom Sprachdienst aussprechen und die Zeit jedes Wortes melden. Ein Marker wird dann zu einer absoluten Sekunde, und Bild und Ton hängen beide an diesen Sekunden.

Придворные астрономы {plant}поставили её на карту и {cut}записали дату.

CUE.plant = 9.21    die Hand setzt den Stern ab: Plumps, Funken
CUE.cut   = 10.50   Schnitt zur Urkunde, die Feder beginnt zu schreiben

Jede Sprache erhält ihre eigene Zeitleiste aus ihrem eigenen Take, sodass ein russischer und ein englischer Film ohne zusätzliche Arbeit unterschiedlich geschnitten sind und ein umgeschriebener Satz alles danach verschiebt. Deshalb ist die Reihenfolge unten Skript, Stimme, Bild, Ton – und niemals Bild zuerst.

script/script.json ─ tools/tts.py ─> audio/voice/<lang>/  +  web/timing_<lang>.js
                                                                   │
                         ┌─────────────────────────────────────────┴───────┐
                  web/film.js + shots + space.js                    audio/score.py
                         │ render.py                                       │
                  renders/film_<lang>/film_<lang>.mp4               audio/mix/<lang>.wav
                         └───────────────── tools/finish_film.py ──────────┘
                                 final/<stem>.mp4, -phone.mp4, .srt

Ein Projekt starten

python <this-skill>/scripts/check_env.py
python <this-skill>/scripts/new_project.py <ordner>

Lege das Projekt auf einem Laufwerk mit ausreichend Platz an, in einem Ordner, der nach dem Film benannt ist, auf einem kurzen Pfad. Frames werden direkt zum Encoder gestreamt und nie gespeichert, daher benötigt ein 5-minütiger Film etwa 1 GiB.

Das neue Projekt ist eine funktionierende 25-Sekunden-Demo über die Mondphasen in zwei Sprachen. Führe die Befehle aus, die new_project.py ausgibt, und sieh dir das Kontaktblatt an, bevor du etwas änderst: Wenn die Demo funktioniert, ist jeder spätere Fehler deiner und nicht der der Maschine.

Status der Vorlage. Die Pipeline hat den echten Film erstellt, aber diese Vorlage wurde anschließend daraus extrahiert. Bei der Demo wurden tts.py, der Mix und die Tonprüfungen ausgeführt. Die Lieferwerkzeuge wurden auf einem schwarzen Clip getestet, render.py auf Platzhalterseiten und die flache Bildlogik über jeden Frame auf einer Platzhalterleinwand in beiden Sprachen. Die Vorlage hat noch nie einen echten Frame gezeichnet, und ihre 3D-Aufnahme wurde nie ausgeführt. Daher sind die ersten Standbilder auch der Test der Vorlage: Wenn sie fehlschlagen, vergleiche mit assets/examples/court-astronomer/, dem Code, der gerendert wurde.

Ersetze dann den Inhalt und behalte die Mechanik:

Ersetzen für jeden FilmNormalerweise in Ruhe lassen
script/script.jsontools/
web/shots.js (flache Aufnahmen)render.py, server.py
web/film.js: SHOT und SEQweb/main.js, web/lib.js, web/labels.js
web/space.js: die Builderweb/space.js: das Kit darüber
audio/score.pyaudio/mixlib.py, audio/synth.py

Arbeitsablauf

Führe Befehle, die länger als zwei Minuten dauern, im Hintergrund aus. Wenn die Maschine eine Job-Warteschlange oder eine thermische Regel hat (siehe Projektdokumentation und Gedächtnis), führe Renderings dadurch aus.

1. Die Anfrage präzisieren

Frage nur, was du nicht standardmäßig annehmen kannst: das Thema, die Sprachen, wo es veröffentlicht wird. Standardeinstellung: 1920x1080, 24 fps, -15 LUFS, eine Länge, die sich aus dem Skript ergibt. Baue einen vollständigen Rohfilm, bevor du Teile verfeinerst. Leute beurteilen einen ganzen Film weit besser als zehn perfekte Sekunden, und sie sagen oft direkt, dass Spitzenqualität warten kann.

2. Referenz lesen, falls vorhanden

Messe sie, anstatt zu raten: Schnitte, Rhythmus, Palette, wie oft die Figur aktualisiert wird, Linienstärke, Körnung. Du kannst dies Frame für Frame in einem Browser tun, ohne das Video herunterzuladen. Lies references/reference-analysis.md. Schreibe die Zahlen als kurzes Style-Sheet in die README des Projekts.

Übernimm die Technik und lass den Inhalt zurück. Erfinde deine eigene Figur, Geschichte und Designs. Verwende keine Frames, Charaktere, Logos oder eine erkennbare Melodie aus der Referenz und erstelle kein bestimmtes Werk unter einem neuen Namen neu.

3. Einen 10-Sekunden-Test erstellen

Eine Einstellung im endgültigen Look, stumm. Feste Zeiten sind hier in Ordnung, da dies nur den Look testet. Sende es an den Benutzer. Dies ist der günstigste Moment im gesamten Projekt, um die Richtung zu ändern.

4. Fakten sammeln, das Skript schreiben

Lies references/script-and-voice.md. Teile den Film in Beats von 10 bis 35 Sekunden auf, jeder eine Idee und normalerweise eine Einstellung. Budgetiere Wörter: etwa 125 pro Minute auf Russisch und 150 auf Englisch, inklusive Pausen. Setze Cues auf die Wörter, an denen auf dem Bildschirm etwas passieren muss.

Halte genaue Fakten und Interpretationen sichtbar getrennt, im Film und nicht nur in deinen Notizen. Wenn du etwas berechnest, behalte die Daten in einer Datei, die der Film liest, sodass das, was auf dem Bildschirm ist, dem entspricht, was die Daten sagen.

Zeige das Skript dem Benutzer, wenn das Thema sensibel ist oder er es genehmigen möchte. Andernfalls fahre fort und lass ihn auf den Film reagieren.

5. Stimme, dann Zeitleiste

python tools/tts.py

Es gibt jeden Cue als name=wort@sekunden aus. Lies diese Zeilen: Ein Cue auf dem falschen Wort ist hier weitaus billiger zu erkennen. Überprüfe die Gesamtzeit mit dem Ziel. Wenn es zu lang läuft, kürze Text; beschleunige die Stimme nicht über etwa +10%.

6. Die Einstellungen schreiben

Lies references/picture.md. Alles auf dem Bildschirm ist eine Funktion von (g, t), und jede Zeit leitet sich von CUE oder BEAT ab. Flache Einstellungen zeichnen mit dem Canvas-Kit; 3D-Einstellungen rendern durch den Composer in dieselbe 2D-Leinwand. Ein Körnungsdurchgang am Ende jedes Frames und ein Satz Labels lassen die beiden wie einen Film wirken.

7. Standbilder ansehen, korrigieren, wiederholen

python render.py renders/check "lang=de×=25,66,241,273"
python tools/contact.py renders/check 4

Lies references/review-and-render.md, um zu erfahren, wie man Momente auswählt und worauf man achten soll. Öffne das Blatt und prüfe es wirklich: Die meisten Fehler sind im Code unsichtbar und im Bild offensichtlich. Bündele deine Fragen. Hintereinanderfolgende Überprüfungs-Renderings sind das, was einen Laptop heiß und eine Sitzung langsam macht.

8. Den Ton schreiben

Lies references/sound.md. Abschnitte beginnen mit Sprach-Beats, Effekte sitzen auf denselben Cue-Namen wie das Bild, die Musik duckt sich unter die Sprache, und der Mix landet bei -15 LUFS.

python audio/score.py de
python tools/bands.py de
python tools/qa_audio.py de whisper

Du kannst es nicht hören, also verwende die Zahlen. Strebe etwa 10 dB Sprache über dem Rest auf jedem Beat an; der echte Film lag bei 6,7 bis 14,2 dB, meist 7 bis 9, also unterschreite diesen Bereich nicht. Sage deutlich, dass noch niemand zugehört hat.

9. Standbilder in jeder Sprache, dann das vollständige Rendering

python render.py renders/check_en "lang=en&times=25,66,241,273"
THREADS=6 CRF=17 python render.py renders/film_de "lang=de&fps=24&file=film_de.mp4"

Führe die Standbilder zuerst in jeder Sprache durch. Ein falsches Dezimalkomma in einer Sprache kostet später ein komplettes Neu-Rendering. Führe jeweils einen schweren Job aus. Nur-Ton-Änderungen benötigen kein Bild-Rendering: Erstelle den Mix neu und führe finish_film.py erneut aus.

10. Liefern, aufräumen, berichten

python tools/finish_film.py de
python tools/telegram_copy.py de
python tools/chapters.py de

Lies references/delivery.md für Plattform-Kopien, Beschreibungen und den Bericht. Lade niemals im Namen des Benutzers hoch oder poste, es sei denn, er hat nach diesem spezifischen Beitrag gefragt. Verschiebe Entwürfe in den Papierkorb oder Mülleimer, anstatt sie zu löschen, und behalte die Finalfassungen und alles, was zu deren Neuerstellung benötigt wird.

Regeln, die die meiste Nacharbeit sparen

  • Ein Frame hängt nur von t ab. Keine Uhren, kein ungesäter Zufall, kein vom vorherigen Frame übernommener Zustand. Sonst stimmt ein Standbild nicht mit dem Film überein und ein teilweises Neu-Rendering passt nicht zu seinen Nachbarn.
  • Zeiten stammen von Cues. Ein Offset von einem Cue ist in Ordnung. Eine eingegebene absolute Sekunde bricht in der anderen Sprache und nach jeder Umschreibung.
  • Jeder Text auf dem Bildschirm geht durch T_, inklusive Zahlen. 29,5 Tage und 29.5 days sind unterschiedliche Zeichenketten. Dies ist der Fehler, der im englischen Master des echten Films ausgeliefert wurde: ein 23,4°.
  • Gehe nicht von der Cue-Reihenfolge über Sprachen hinweg aus. Die Wortreihenfolge unterscheidet sich, daher kann CUE.a < CUE.b nur in einer von beiden gelten. Schütze aus zwei Cues aufgebaute Spannen.
  • Labels sind 2D und werden mit project() platziert. Sie teilen dann Beschriftung, Körnung und Sprachverarbeitung mit den flachen Einstellungen.
  • Halte die Kamera außerhalb von allem, was sich dreht. Überprüfe die Extremwerte einer Bewegung auf einem Blatt, nicht nur ihre Mitte.
  • Statische Ebenen gehen in eine plate(). Das erneute Zeichnen eines detaillierten Hintergrunds für jeden Frame ist das, was ein Rendering langsam macht.
  • Ändern, dann ansehen, dann berichten. Bezeichne etwas erst dann als korrigiert, wenn du den Frame gesehen hast.

Was du nicht überprüfen kannst und sagen musst

  • Ton. Du siehst Lautstärke, Balance, Spektrogramme und ein Transkript. Du weißt nicht, wie es klingt.
  • Fluss. Du siehst Frames, nicht das Erlebnis eines Zuschauers, daher ist das Tempo deine schwächste Beurteilung. Frage den Benutzer speziell nach dem Rhythmus.
  • Plattformen. Du kannst nicht sehen, wie sich eine Datei innerhalb des Telegram- oder YouTube-Kontos des Benutzers verhält.

Berichte, was überprüft wurde und was nicht, in diesen Worten. Die Entscheidungen (Idee, Richtung, was weggelassen wird) liegen beim Benutzer.

Mitgelieferte Dateien

PfadWas es istWann lesen
references/reference-analysis.mdGetestete Browser-Snippets zum Messen eines Videos, Style-Sheet-VorlageEs gibt ein Referenzvideo
references/script-and-voice.mdscript.json, Cue-Grammatik, Wortbudget, Stimmen, FaktenVor dem Schreiben des Skripts
references/picture.mdZeitleiste, flaches Kit, Acting auf Cues, Text, Körnung, 3D-Kit, Übersicht über den BeispielcodeVor dem Schreiben der Einstellungen
references/sound.mdInstrumente, Partiturstruktur, Sprachkette, Mix-Zahlen, ÜberprüfungenVor dem Schreiben der Partitur
references/review-and-render.mdWorauf auf Blättern achten, Rendermodi und -optionen, AuslastungVor der ersten Überprüfung, vor dem vollständigen Rendering
references/delivery.mdMaster, Telefon, Telegram, YouTube, X, Untertitel, Bereinigung, der BerichtAm Ende
references/pitfalls.mdSymptom, Ursache, Behebung, über die gesamte PipelineWenn etwas falsch aussieht
scripts/check_env.pyWas die Maschine hatZuerst
scripts/new_project.pyErstellt ein Projekt aus der VorlageZweitens
assets/template/Das Projektskelett, eine funktionierende DemoKopiert von new_project.py
assets/examples/court-astronomer/Der Code des echten Films: 10 3D-Builder, flache Einstellungen, ein Hand-Rig, eine vollständige PartiturDurchsuche ihn nach einer Technik; er läuft nicht eigenständig

Verwandte Skills