Communitygithub.com

3D-Animator

Verwandelt Claude in einen echten 3D-Animator, der kinematografische 3D-Filme komplett über Code erstellt – inklusive Kamera, Licht, Texturen, Bewegung und Sound – und als MP4 ausgibt. Alles läuft ohne Blender, basierend auf Three.js und HyperFrames.

Was ist 3D-Animator?

Das Skill '3D-Animator' befähigt Claude, vollständig programmatisch kinoreife 3D-Filme zu erstellen – ohne eine traditionelle 3D-Software wie Blender. Es nutzt HyperFrames und Three.js, um jede Szene frame-genau über Code zu definieren: von realweltlich skalierten Sets (1 Einheit = 1 Meter) über motivierte Beleuchtung, physikalisch basierte Texturen (M.*-Materialien), Kameraführung mit Linsenwahl, Charakteranimationen (Gehen, Laufen, Fahrzeuge lenken) bis hin zu echtem Sound (realistische Aufnahmen, Musik, Voice-Over). Der Workflow ist streng sequenziell: zuerst die Planung (shot-plan.md), dann Projektinitialisierung via 'npx hyperframes init', danach Audioaufbau mit automatischer Mix-Analyse, dann die Szenenprogrammierung mit spezifischen Helfern (createCharacter, walker, driver, createCar, etc.), gefolgt von Vorschauen, Qualitätssicherung (inklusive Automatisierung mit Whisper und EarShot) und schließlich der finale Render mit wählbarer Sample-Rate. Das Skill liefert zwei Beispielprojekte mit: eine Straßenszene (mit Charakteren, Fahrzeugen, Physik) und eine erklärende Chip-Szene (für Konzepte und Voice-Over). Es unterstützt Plattformen wie Claude Code, Cursor und Codex. Die Grenzen sind klar definiert: stilisierte Menschen (keine Fotorealismus-Gesichter, keine Lippen-Synchronisation), kunstvoll gesteuerte Physik (keine echte Simulation von Stoff, Haaren oder Flüssigkeiten) und synthetischer Sound (echte Aufnahmen sind lizenziert einzubinden).

Funktioniert mit✓Claude Code~Codex CLI~Cursor
npx skills add https://github.com/metehan2236/3d-animator/tree/HEAD

In Ihrer bevorzugten KI fragen

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

Dokumentation

Was macht 3D-Animator?

Die Eingabe „Mach ein cooles 3D-Video“ erzeugt eine Szene mit grauem, flachem Licht und einer starren Kamera – weil das Modell ohne kinematografische Entscheidungen auf die Standardwerte zurückfällt. Dieses Skill zwingt dazu, diese Entscheidungen vor dem Programmieren zu treffen, und liefert die Infrastruktur, um sie umzusetzen.

Ziel: Ein Film, der bei der ersten Abgabe keine technischen Fehler enthält und mit wenigen Überarbeitungen fertig wird. Keine Perfektion, sondern ein solider, überarbeitbarer Start. Was dies ermöglicht, ist nicht die Infrastruktur, sondern die folgende Reihenfolge – keine Schritte auslassen.

Das Projektformat ist HyperFrames. Für Kompositionsregeln gilt hyperframes-core.

Mit welchem Beispiel beginnt man

AnfrageStartLesen
Mensch, Fahrzeug, Objektbewegung, Action, Geschichteassets/example-street-film/references/motion.md
Voice-Over-Erzählung, Konzepterklärung, Präsentationassets/example-chip-film/references/film-grammar.md
BeidesNimm das Straßenfilm-Beispiel, füge die Erzählsprache hinzuBeide

Immer lesen: references/materials.md, references/craft.md, references/sound.md.

Die Struktur bewahren, den Inhalt themenbasiert neu schreiben. Die Straße, den Ball oder den Chip aus dem Beispiel nicht auf neue Aufgaben übertragen. Wenn ein Referenzvideo gegeben wird, dessen Technik lernen, aber Text und Schnitt nicht kopieren. scene.js Abschnitte: Set, Schauspieler, Choreografie, Kamera, Erscheinungsbild.

Die Anforderungen an den Film

Fehlt eine, sieht es aus wie eine „3D-Demo“, nicht wie ein Film:

  1. Echter Maßstab: 1 Einheit = 1 Meter. Linsenunschärfe, Schatten und Texturen werden damit korrekt.
  2. Voller und tiefer Raum: Vorder-, Mittel-, Hintergrund und darüber hinaus. Mindestens 25 Objekte. Die Hauptfigur wird stückweise modelliert.
  3. Natürliches Licht: Motiviertes Hauptlicht + skyDome. Ein Objekt ohne Schatten schwebt.
  4. Korrekte Textur: Jede Oberfläche verwendet M.* oder gleichwertig sorgfältig. Keine Oberfläche ist einfarbig.
  5. Eine Geschichte und ein Grund: Jede Bewegung hat einen Grund. Etwa alle 3 Sekunden ein neues Ereignis.
  6. Kamera-Autorschaft: Jede Einstellung hat eine einzige Aufgabe. Linse und Bewegung sind dieser Aufgabe untergeordnet.
  7. Ton: Echte Aufnahmen, Musik, Voice-Over. Jeder Ton ist im Bild an einen Grund gebunden.

Ablauf

1. Planung (shot-plan.md)

Bevor Code geschrieben wird: Ein-Satz-Botschaft, Hauptfigur, Ortsliste, Lichtidee, Farbschema, Texturliste und Einstellungstabelle.

DauerEreignisKamera (Linse, Bewegung)TonUntertitel
9.1–10.2Der Ball rutscht dem Kind aus der Hand46mm, Untersicht, f/3.2Kurzer AtemzugNiemand sieht den Ball.

Wenn kein Format gewünscht ist: 16:9 1920×1080. Für vertikale Reels 1080×1920 einrichten und Bildausschnitte neu planen. Wenn der Benutzer ein Thema vorgibt, nicht auf Bestätigung warten, den Plan kurz zeigen und fortfahren. Wenn eine Entscheidung den Film grundlegend ändert (Format, Sprache, Anforderung realistischer Menschen), vorher fragen.

2. Projekt einrichten

npx hyperframes init <name> --resolution landscape --non-interactive

Alle Dateien unter assets/rig/ und die Dateien des gewählten Beispiels in das Projektstammverzeichnis kopieren.

3. Ton, dann Bild

Die Zeitangaben stammen aus der Sprache; die Kamera-Zeiten sind davon abhängig. Zuerst den Ton einrichten.

node <skill-verzeichnis>/scripts/make-sfx.mjs assets/sfx <dauer-sek>
node <skill-verzeichnis>/scripts/build-audio.mjs .

Das Skript schreibt voiceToMusicDb, overrun, voiceClash, overlap und den Mix-Pegel. Wenn es mit einem Fehlercode endet, die Zeitangaben korrigieren. Quellenfindung, Lizenz und Mix: siehe references/sound.md. Wenn keine Musik gefunden wird oder die Lizenz nicht passt, erzeugt scripts/make-music.mjs eine grundlegende aus Code. Die Aufnahmen des Straßenfilms sind nicht im Skill enthalten; die Liste steht in assets/example-street-film/SOURCES.md. Bei der ersten Einrichtung:

py -3.12 -m venv "%USERPROFILE%\.cache\3d-animator-venv"
"%USERPROFILE%\.cache\3d-animator-venv\Scripts\python" -m pip install kokoro-onnx soundfile faster-whisper "av<16"

Die Umgebungsvariable HYPERFRAMES_PYTHON auf diese python-Datei verweisen. Kokoro kann kein Türkisch: Für Türkisch mit Erlaubnis des Benutzers Audiodateien von einem anderen Anbieter erzeugen, als voice/NN.wav und mit demselben Text als voice/NN.txt ablegen. Das Skript erzeugt dieses Paar nicht erneut.

4. Szene

WerkzeugAufgabe
createFilm({canvas, width, height, fps, samples, bloom, environment, background})Render-Pipeline
film.setShots([...])Aufnahmeliste; jedes at ist ein Schnitt. track: (t) => ({pos, look, lens, fstop, focus, roll}) verfolgt ein bewegtes Subjekt
film.setKeys([...])Einzelkamera ohne Schnitte
film.onUpdate(t => ...)Objekt- und Charakterbewegung. Wird pro Unterframe aufgerufen
film.onFrame(T => ...)Licht, look, Mod-Entscheidungen. Einmal pro Frame
film.lookexposure, saturation, contrast, blackPoint, lift, shadowTint, midTint, highlightTint, flash, grain, vignette, aberration, fade, invert, bloom, stylize
film.skyDome, film.softLight, film.skyBackdrop, film.bakeEnvironmentNatürliches Licht und Reflexion
film.mirrorFloor(mesh)Echte Reflexion für nasse Böden und Wasser
film.sunThroughBlinds, film.shaft, film.dust, film.burst, film.sparks, film.screen, film.wireEffekte und Details
M.*, skinned, boxUVTexturen (references/materials.md)
createCharacter, walker, createCar, driver, createBicycle, rider, loadRiggedSchauspieler (references/motion.md)
speedProfile, groundPath, bounces, springTrack, track, noise1, rng, EASEBewegungshilfen
addCaptions(tl, el, LINES)Wort-für-Wort-Untertitel

Unveränderliche Regel: Alles Sichtbare ist eine reine Funktion der Zeit. Nicht rotation.y += 0.01 schreiben, sondern rotation.y = t * 0.6. Frames werden in zufälliger Reihenfolge und mehrfach angefordert. Date.now(), performance.now(), requestAnimationFrame und Math.random ohne Seed nicht verwenden.

5. Vorschau-Test

SAMPLES = 4 setzen und Frames von jedem Schlüsselmoment des Films aufnehmen. Nicht weniger als 15 Frames. setTextureScale(SAMPLES < 16 ? 0.5 : 1) verkürzt die Testzeiten erheblich, da jeder Render-Worker alle Texturen von Grund auf neu erzeugt:

npx hyperframes check
npx hyperframes snapshot --at <t1>,<t2>,... --timeout 240000

Für Überlappungen --angle top verwenden. Bei SAMPLES 1–4 täuschen Himmelslicht und Schärfentiefe: Schatten erscheinen hart, Fokus punktförmig. Textur- und Lichtentscheidungen mit 16 treffen.

Frames öffnen und prüfen. Texturen: Ist die Reliefstruktur übertrieben, gibt es Dehnungen, ist jede Oberfläche texturiert? Bildausschnitt: Werden Subjekt und Kopf abgeschnitten, ist die Aufgabe jeder Einstellung lesbar? Licht: Richtung, Kontaktschatten, Ausblendung. Bewegung: Fußschlupf, Durchdringung, in der Luft schwebende Objekte. Text: Ist der Untertitel auf hellem Hintergrund lesbar?

Wenn ein Referenzvideo vorhanden ist, die gleichen Momente nebeneinanderlegen (scripts/look-stats.mjs liefert einen numerischen Tonvergleich); die Analysemethode des Referenzvideos ist in references/film-grammar.md beschrieben.

6. Entwurf, Scan, Korrektur

npx hyperframes render --quality draft --output draft.mp4
node <skill-verzeichnis>/scripts/qa-film.mjs draft.mp4 --script script.json --whisper <python> --earshot <python>

Der Browser gibt Einzelbilder als qa/sheet-*.jpg aus (4 Bilder pro Sekunde) und meldet schwarze Frames, eingefrorene Frames, Einzelframe-Blitze, Lautstärke, unverständliche Wörter und die earshot-Bewertung. Jede Seite einzeln prüfen. Selbst wenn die Maschine sauber meldet, sind Fehler dort sichtbar. Dann jede Nahaufnahme in voller Größe öffnen (references/materials.md, Frame für Frame prüfen): Ein auf der kleinen Seite sauber aussehendes Bild ist in voller Größe meistens nicht sauber. Die meisten Fehler in diesem Film werden nur so sichtbar.

Vor dem Wechsel zur vollen Qualität jeden Befund schließen. Nur den defekten Teil neu rendern:

npx hyperframes render --quality draft --start 18 --end 21 --output teil.mp4

7. Final

SAMPLES 24–32. Eine Szene im Maßstab des Straßenfilms dauert auf einer RTX 4060 einige Minuten; wenn in der Zusammenfassungszeile software gpu erscheint, dauert es viel länger – dem Benutzer von Anfang an mitteilen.

npx hyperframes render --quality delivery --output final.mp4

Den Scan im endgültigen Film wiederholen, denn niedrige SAMPLES verbergen Fokusfehler. Wenn earshot fehlt, um Erlaubnis zur Installation bitten (ca. 1–3 GB). Das earshot auf PyPI ist ein anderes Paket; die korrekte Quelle ist github.com/Leonxlnx/earshot. Unter Windows das virtuelle Environment in einen kurzen Pfad installieren, da torch mit langen Pfaden Probleme hat.

Abgabe

Folgendes mitteilen: Was wurde gemacht, was wurde geprüft, was konnte nicht geprüft werden und was fehlt noch. Die verwendeten Audio- und Musikquellen mit Lizenzen auflisten. Selbst wenn die Bewertung hoch ist, bedeutet launch-grade nicht, dass der Film schön ist. Geschmack und Natürlichkeit des Voice-Over obliegen dem Benutzer.

Überarbeitung

Wenn der Benutzer eine Überarbeitung wünscht:

  1. Die Notiz in einen Plan umwandeln: In welcher Einstellung, was, wie soll es aussehen. Bei Unklarheit die wahrscheinlichste Interpretation wählen und mitteilen, nicht zu jeder Notiz eine Frage stellen.
  2. Die richtige Stelle ändern: Textur mit M.*, Kamera mit setShots, Timing mit einer einzigen Konstanten (BRAKE_T), Ton mit film.look, Audio mit script.json. Alles, was von einer Konstanten abhängt, verschiebt sich gemeinsam.
  3. Nur diesen Teil rendern: Mit --start und --end. Wenn sich nur der Ton geändert hat, das Bild nicht neu rendern (references/sound.md).
  4. Das Segment nebeneinander mit der vorherigen Version zeigen, nach Bestätigung den vollständigen Render durchführen.
  5. Die dauerhafte Lektion ins Skill schreiben: Wenn eine Fehlerart ein zweites Mal auftritt, in diese Datei oder die entsprechende Referenz aufnehmen.

Realistische Menschen: Referenz + KI-Video

Dieser Film dient als Referenz für ein KI-Video-Tool; das endgültige Bild wird von diesem Tool erzeugt. Die Einrichtung wurde noch nicht Ende-zu-Ende getestet; bei der ersten Verwendung mit einer einzigen Einstellung testen und das Ergebnis dem Benutzer zeigen.

  1. Nur das Blocking einrichten: Bildausschnitt, Kamerabewegung, wer wo, wann. Keine Zeit in Charakterdetails oder feine Texturen investieren.
  2. Jede Einstellung separat ausgeben: KI-Tools sind bei kurzen Clips konsistenter. Mit --start und --end Einstellung für Einstellung rendern. Untertitel ausschalten; grain, aberration und vignette auf null setzen. Das Tool hält Text und Effekte für reale Bilder.
  3. Das Erscheinungsbild fixieren: Zuerst das erste Bild der Einstellung in ein realistisches Bild umwandeln. Charakter- und Ortsreferenzen über alle Einstellungen hinweg gleich halten, nach Bestätigung zum Video übergehen.
  4. Die Kosten vorher nennen: Welches Tool, für wie viele Einstellungen und den geschätzten Kredit angeben, Zustimmung einholen. Die verbundenen Tools zum jeweiligen Zeitpunkt überprüfen; nicht im Voraus annehmen.
  5. Prüfen: Bilder in voller Größe und Schnittstellen: Gesicht, Hand, Schilder- und Tafelbeschriftung, Kleidungswechsel von Einstellung zu Einstellung. Wenn die Bewegung von der Choreografie abweicht, die Transformationsstärke reduzieren.
  6. Den Ton hier abschließen: Ton und Untertitel bleiben mit script.json in dieser Spur. Die Dauer der ausgegebenen Clips prüfen, bei Verschiebung die Tonzeiten an die neue Dauer anpassen.

Grenzen

Gleich zu Beginn sagen, nicht am Ende:

  • Menschen sind stilisiert: Animationsfilm-Qualität. Keine Fotorealismus-Gesichter, Gesichtsschauspiel oder sprechende Münder. In Nahaufnahmen wirkt es albern. Wenn realistische Menschen benötigt werden, den Referenzpfad unten verwenden; in menschenlosen Filmen die Hauptfigur als Objekt oder Fahrzeug gestalten, Menschen im Hintergrund halten.
  • Physik ist kunstgesteuert: Wird nach der Geschichte geschrieben, keine echte Simulation. Keine Stoff-, Haar- oder Flüssigkeitssimulation; Wasser wird mit Partikeln nachgeahmt.
  • Synthetischer Ton klingt synthetisch, wenn er per Code erzeugt wird. Echte Aufnahmen erfordern eine Genehmigung.
  • Türkisches Voice-Over erfordert eine externe Stimme.

Verwandte Skills