makerjackie/short-film

Programmatischer Kurzfilm (short-film)

Verwandle ein Thema in einen Kurzfilm: etwa 30 Sekunden (15–90 Sekunden möglich), vertikales Format 1080×1920, 24 fps; Szenen im handgezeichneten Tintenstil auf Papieruntergrund (paper plate) wechseln sich mit Szenen auf tiefblauem Blaupausen-Untergrund (blueprint plate) ab; jedes Ereignis liegt auf einem Taktraster (BPM → Beat → Frame); jedes Pixel und jedes Audio-Sample wird mit reinem Browser-JavaScript berechnet. Die Auslieferung besteht aus dist/<slug>.html (einem eigenständigen Player), exports/<slug>.mp4 (sowie den umgewandelten Versionen für Smartphone und Vorschau) und einem Veröffentlichungspaket: TikTok-Cover (HTML-Screenshot), empfohlener Titel und Beschreibung.

Dieses Skill kapselt eine bereits bewährte Pipeline. Es bringt drei Dinge mit:

• foundation/ – Engine und Werkzeuge, die in jedes neue Projekt kopiert werden: src/core.js, src/lib.js, src/player.js, src/music.js (Engine + eine Beispielmusik) und tools/ (Build, Prüfung, Screenshot, Rendern, Stub-Generierung, Audio-Analyse, Veröffentlichungspaket, Test-Fixtures). Alles wird von src/timeline.js gesteuert, sodass jedes Filmprojekt keinen Tool-Code ändern muss.
• templates/ – Vier Planungsdokumente als Startvorlage für jeden Film.
• reference/ – Bei Bedarf nachschlagen: Aufnahmetypen, Szenenaufbau, Musik, Plattformvorgaben; zuerst die drei Referenzbilder ansehen.

Sieh dir zuerst reference/ an: contact-sheet.jpg ist das gesamte Kontaktbild des Beispielfilms (examples/llm-evolution, ein eigener „ATLAS“-Stil) – dieses Detailniveau und diese Fertigungsqualität sind die Messlatte; paper-frame.jpg und blueprint-frame.jpg sind je ein Vollbild der standardmäßigen, bereits vorhandenen Stile (gerendert von tools/fixtures) – Filme im Standardstil orientieren sich visuell an diesen.

Ein vollständiges Beispiel findest du in examples/llm-evolution/: ein 24-Szenen-Film von Neuronen bis zu großen KI-Modellen, mit Planungsdokumenten, Quellcode, dist/ und Veröffentlichungspaket. Beachte, dass es sich um ein eigenes Stil-Endprodukt handelt (durch Referenzanalyse vom Standard-Stil abgewichen), das die volle Bandbreite dieses Skills zeigt. Wenn eine Vorlage dich unsicher lässt, wie ein ausgefülltes Dokument aussehen soll, lies das entsprechende Gegenstück dort.

Die Hürde (The Gate)

node tools/check.cjs ist die Hürde: sechs Prüfungen (Medien-Scan, Determiniertheit, Quellcode-Scan, Zeitachse, Zeichnung, Frame-Laufzeit), Exit-Code 0 bedeutet bestanden. Ab der Stub-Phase gilt kein Schritt als abgeschlossen, solange die Hürde rot ist. Für echte Szenen dauert sie unter einer Minute – lass sie vollständig laufen.

Pipeline

0. Briefing (Brief)

Stelle nur eine Runde Fragen: Was ist das Thema, was muss der Film darüber unbedingt enthalten, die Länge (Standard 30 Sekunden) und auf welcher Plattform er veröffentlicht werden soll (bestimmt Bildformat und Sicherheitszonen, siehe reference/platform-presets.md). Den Rest erfindest du selbst und erklärst, was du erfunden hast.

Abschlusskriterium: Das Thema ist als Satz formuliert, den der Nutzer bereits gesehen hat, und Länge sowie Plattform sind festgelegt.

1. Einrichtung (Setup)

Erstelle einen Projektordner, benannt nach dem Slug des Films, und kopiere foundation/ hinein. Führe npm install in tools/ aus (Playwright; falls der Browser fehlt, ergänze npx playwright install chromium). Stelle sicher, dass ffmpeg im PATH ist, oder setze die Umgebungsvariable FFMPEG auf den Binärpfad. Kopiere die Vorlagen in docs/ und schreibe das Thema in das Ziel von docs/CONTRACT.md.

Abschlusskriterium: node tools/smoke.cjs ist grün, node tools/check.cjs --fixtures ist grün, und node tools/render.cjs --fixtures --scale 0.5 erzeugt exports/fixtures.mp4 mit Ton. Dieser fixtures-Minifilm beweist, dass die Toolkette funktioniert, bevor Zeit in die Planung investiert wird.

2. Recherche (Research)

Liste die einzelnen Phasen der Thematik auf, führe für jede offene Frage eine Websuche durch und speichere zwei bis vier maßgebliche Volltextquellen in .tmp/research/. Die Recherche mündet nur an zwei Stellen: in den Themenreferenzen der künstlerischen Bibel und in den Unterabschnitten „Subject“ jeder Szene.

Abschlusskriterium: Jede Phase der Geschichte kann auf eine heruntergeladene Quelle zurückgeführt werden.

3. Künstlerische Bibel (Art Bible)

Fülle docs/art-bible.md nach Vorlage aus. Die Abschnitte 1–9 sind der bereits festgelegte Standardstil; Abschnitt 2.2 (Themenpalette, jede Farbe als benanntes Hex, gespiegelt im annotierten Block von src/lib.js), 2.3 (Identitätsfarben) und Abschnitt 10 (Themenreferenzen) werden für jeden Film neu geschrieben. Abschnitt 10 endet mit einer Liste „zu vermeidender Fehler“, jeweils illustriert mit der korrekten Darstellung.

Falls der Nutzer ein anderes Aussehen als den Standardstil wünscht, führe zuerst eine Referenzanalyse gemäß templates/reference-analysis.md durch und aktualisiere die Abschnitte 1–9 entsprechend.

Abschlusskriterium: Jedes Element, das im Storyboard gezeichnet wird, hat eine Zeichenregel und einen Palettennamen; src/lib.js stimmt mit Abschnitt 2.2 überein; die Fehlerliste existiert; und node tools/snap.cjs --fixtures --shot palette --samples 5 --sheet wurde bereits ausgeführt.

4. Storyboard (Storyboard)

Lies reference/shot-types.md, fülle docs/storyboard.md nach Vorlage aus: Logline; Zahlen (zuerst BPM wählen, Beat = 60/BPM Sekunden, Dauer auf ganze Takte gerundet); Übersichtstabelle; Akte, auf die Takte abgebildet; eine gemeinsame Geometrietabelle für alle Formen, die über einen Match-Cut hinweg existieren; dann ein Eintrag pro Aufnahme – 1 bis 3 Sekunden, Grenzen auf dem Taktraster, abwechselnde Untergründe – mit allen acht Unterabschnitten; Sound-Hinweise mit Zeitstempeln auf dem Raster.

Abschlusskriterium: Die Aufnahmen decken lückenlos das Intervall [0, Dauer] ab; jede Aufnahme hat alle acht Unterabschnitte; jede Match-Cut-Form hat einen Eintrag in der gemeinsamen Geometrietabelle; das Dokument besteht eine Selbstprüfung aus der Perspektive eines Filmkritikers (Zahlen im Text stimmen mit den Tabellen überein, Pflichtinhalte liegen innerhalb der Sicherheitszonen – auch arithmetische Inhalte). Storyboard-Fehler multiplizieren sich in jede Szene hinein; dies ist der günstigste Moment, sie zu finden.

5. Zeitachse (Timeline)

Schreibe src/timeline.js gemäß Storyboard (Aufbau siehe Storyboard-Vorlage): Titel, BPM, Dauer, shots-Array (id, file, start, end, mode, title, transitionIn, brief) und die flache Liste der cues, die aus den Sound-Unterabschnitten gesammelt wurden. Die Stub-Phase ist der Test für diesen Schritt – ein falsches Zeitachsenformat führt zu einem lauten Fehlerabbruch.

6. Stub-Phase (Stub pass)

node tools/stubgen.cjs generiert Platzhalter-Szenen für jede Aufnahme. Führe die Hürde aus, dann node tools/render.cjs --scale 0.5 --out exports/draft-stubs.mp4 und sieh dir den Entwurf von Anfang bis Ende an. Dies ist der Leuchtspur-Schuss: Bevor eine echte Szene gezeichnet wird, wird bewiesen, dass die Zeitachse, die Szenen, die Hürde, das Rendern und der Ton alle funktionieren.

Abschlusskriterium: Die Hürde ist grün, und die Entwurfs-MP4 zeigt jede Aufnahme in der richtigen Reihenfolge, jeder Übergang liegt auf dem Raster.

7. Szenen (Scenes)

Jede Szenendatei wird von einem eigenen Agenten verwaltet – Dateibesitz ist Gesetz (docs/CONTRACT.md). Jeder Szenen-Agent liest reference/scene-anatomy.md, den zugehörigen Storyboard-Eintrag, die künstlerische Bibel und die gemeinsame Geometrie, schreibt dann src/scenes/NN-<id>.js, erstellt ein Kontaktbild (node tools/snap.cjs --shot <id> --samples 6 --sheet), betrachtet jeden Frame und iteriert, bis er dem Briefing entspricht. Mit snap --only kann eine einzelne Aufnahme gerendert werden, während Geschwisterdateien erst halb geschrieben sind – Szenen-Agenten können also frei parallel arbeiten.

Aufnahmen können sich auch ein gemeinsames Zeichenmodul teilen (zentralisiertes Layout, siehe docs/CONTRACT.md unter „Zwei Layouts für Szenencode“) – dann ist jede src/scenes/NN-*.js nur ein paar Zeilen Registrierungswrapper, und das Zeichnen konzentriert sich in FILM.art. Das Beispiel examples/llm-evolution verwendet diese Variante; sie ist effizienter, wenn Aufnahmen dieselbe Geometrie teilen und sich nur in Parametern unterscheiden.

Abschlusskriterium: Das Kontaktbild jeder Aufnahme wurde persönlich geprüft und als dem Briefing entsprechend beurteilt, und die Hürde ist grün.

8. Musik (Music)

Schreibe src/music.js gemäß reference/music.md: Behalte die Engine, ersetze die CH-Akkordtabelle, die MIX.ride-Automation und die gesamte score()-Funktion. Setze jeden einzelnen Cue auf den exakten Zeitstempel in FILM.TIMELINE.cues und sorge dafür, dass Akzente auf den Übergängen liegen.

Abschlusskriterium: Nach node tools/audio/render-audio.cjs zeigt node tools/audio/analyze.cjs .tmp/audio/score.wav --cues, dass Einsätze und Cues innerhalb von 10 ms übereinstimmen; node tools/audio/peaks.cjs .tmp/audio/score.wav zeigt Headroom unterhalb der Limiter-Obergrenze; und die Hürde ist grün.

9. Kritiker-Wellen (Critic waves)

Bringe zuerst den gesamten Film auf eine Tafel: node tools/snap.cjs --samples 24 --sheet --scale 0.25. Aufnahmen, die bei dieser Größe unlesbar sind, sind P1 – korrigiere durch Komposition, nicht durch Hinzufügen von Details.

Überprüfe dann jede Aufnahme anhand gerenderter Frames: Erstelle neue Kontaktbilder und lasse einen Kritiker-Unteragenten die Komposition, die Treue zum Storyboard, die Bewegung und die Dichte bewerten. Kritiker müssen pixelgenaue proportionale Schlüsselgeometrie messen (Band-Scores, Drittel-Regel, Sicherheitszonen-Arithmetik, Positionen der gemeinsamen Geometrie) und nicht nur nach Augenmaß urteilen; schneide für jeden Match-Cut beide Seiten heraus und vergleiche sie.

Korrigiere wellenweise – P1 zuerst, jede Korrektur mit Beweis-Frames, respektiere Dateibesitz (stelle den Agenten der Datei wieder her), erstelle nach jeder Korrektur neue Screenshots. Der Regisseur stichprobenartig überprüft jede P1-Korrektur auf neuen Frames. Überprüfe die Determiniertheit, indem du dieselben Frames in zwei verschiedenen Durchläufen aufnimmst und die Datei-Hashes vergleichst.

Abschlusskriterium: Jede P1- und P2-Korrektur wurde auf neuen Frames verifiziert, und die Hürde ist grün.

10. Auslieferung (Deliver)

node tools/render.cjs schreibt das Master (crf 16). Dann transkodiere:

ffmpeg -i exports/<slug>.mp4 -vf scale=720:1280 -c:v libx264 -crf 23 -preset medium -c:a aac -b:a 128k exports/<slug>-phone.mp4
ffmpeg -i exports/<slug>.mp4 -c:v libx264 -crf 23 -preset medium -c:a copy exports/<slug>-preview.mp4

node tools/build.cjs schreibt dist/<slug>.html. Sieh dir dann das Master mit Ton von Anfang bis Ende an und öffne einmal den HTML-Player (Klicken oder Leertaste zum Abspielen, Pfeiltasten für Einzelschritte, ?shot=<id> für Einzelschleife einer Aufnahme).

Schreibe exports/<slug>-shots.md: eine Zeile pro Aufnahme, die erklärt, was sie zeigt.

Abschlusskriterium: Master, Telefon-Transkodierung, HTML-Datei und exports/<slug>-shots.md existieren, die Hürde ist grün, und die finale Durchsicht hat keine zu korrigierenden Mängel ergeben.

11. Veröffentlichungspaket (Publish pack)

Generiere mit tools/publish.cjs ein veröffentlichungsreifes Cover und Textvorlagen:

node tools/publish.cjs                          # Standardmäßig den Hook-Frame der ersten Aufnahme für das Cover verwenden
node tools/publish.cjs --at 2.5 --title "Von einem Neuron zu einer Sprachmaschine" --platform tiktok

Es tut zwei Dinge:

1. Cover-Bild (HTML-Screenshot, Standard 1080×1920): Rendert einen Frame des Films zum Zeitpunkt --at als Hauptmotiv, überlagert Titel/Untertitel/ Eckmarke und gibt exports/<slug>-cover.png aus. Die Cover-Seite darf Systemschriften und Bilder verwenden, da sie nicht in das ausgelieferte HTML eingeht und nicht gegen die „Keine Medien“-Regel verstößt.
2. Textvorlage exports/<slug>-publish.md: Titelvorschläge, Beschreibung, Hashtags, Aufnahmeliste, Dauer/Bildformat/Plattform usw. Titel und Beschreibung sind Ausgangspunkte, die du gemäß den Regeln in reference/publish.md zu finalen Empfehlungen verfeinerst.

Abschlusskriterium: exports/<slug>-cover.png wurde generiert und persönlich begutachtet (Titel in den Sicherheitszonen, lesbar, mit Hook); Titel und Beschreibung in exports/<slug>-publish.md wurden von dir zu finalen Empfehlungen verfeinert; Plattform und Bildformat stimmen mit dem Briefing aus Schritt 0 überein.