Shrimer06/remotion-video-superpowers

Remotion Video Superpowers

Verwende diese Fähigkeit, um die Remotion-Videoproduktion als disziplinierten Spezifikations-, Planungs-, Ausführungs- und Qualitätssicherungs-Workflow durchzuführen. Springe nicht direkt in die Animation für nicht-triviale Videos.

Workflow

1. Erstelle oder aktualisiere eine Video-Spezifikation vor der Implementierung.

   • Lies references/writing-video-specs.md.
   • Speichere Spezifikationen unter docs/video/specs/YYYY-MM-DD-projektname.md im Projekt, falls praktikabel.
   • Erfasse Ziele, Nicht-Ziele, Zielgruppe, visuelle Richtung, Assets, Voiceover-Anforderungen, Einschränkungen und Abnahmekriterien.

2. Erstelle oder aktualisiere einen Produktionsplan.

   • Lies references/writing-video-plans.md.
   • Speichere Pläne unter docs/video/plans/YYYY-MM-DD-projektname.md im Projekt, falls praktikabel.
   • Verwende Aufgaben mit Kontrollkästchen. Jede Aufgabe muss Dateien, Schritte, Validierung und Abbruchbedingungen auflisten.

3. Schließe die Asset-Beschaffung vor der Animationsimplementierung ab.

   • Lies references/asset-sourcing.md.
   • Sammle und dokumentiere Produkt-Assets, Marken-Assets, UI-Referenzen, Screenshots, 3D-Modelle, Karten-/Geodaten-Ressourcen, Service-Token/Umgebungsnamen, Audio-Referenzen, Lizenzen, Quellenangaben, lokale Pfade und Fallbacks.
   • Beginne nicht mit der Szenenanimation, bis die erforderlichen Assets lokal verfügbar sind oder ein Fallback explizit dokumentiert ist.

4. Führe den Plan Aufgabe für Aufgabe aus.

   • Lies references/remotion-scene-execution.md, bevor du Remotion-Code bearbeitest.
   • Lies references/frontend-animation-system.md, wenn das Video Web-UI, Produktoberfläche, Dashboard, Frontend-Animationen, Three.js, Anime.js oder komplexe Animations-Choreografie enthält.
   • Lies references/3d-map-and-model-resources.md, wenn das Video Karten, Routen, Städte, Gelände, Gebäude, Wahrzeichen, digitale Zwillinge, Ausrüstung, Raumfahrzeuge, reale 3D-Objekte oder token-basierte Dienste wie Mapbox/Cesium ion benötigt.
   • Verwende useCurrentFrame() und interpolate() für suchpositionssichere Animation.
   • Vermeide CSS-Übergänge und nicht-deterministische Laufzeit-Animationen.
   • Halte Szenentext kurz; verlagere Erklärungen in das Voiceover.
   • Rendere Standbilder um Szenenanfänge, -höhepunkte und -übergänge vor dem endgültigen Render.

5. Behandle Voiceover als erstklassige Timeline-Quelle.

   • Lies references/elevenlabs-v3-scripting.md, bevor du ElevenLabs v3-Skripte schreibst.
   • Lies references/audio-sync-and-muxing.md, bevor du Audio importierst, synchronisierst oder muxte.
   • Überprüfe die tatsächliche Audio-Dauer mit dem Skript scripts/inspect-audio.sh dieser Fähigkeit.
   • Bevorzuge es, das Szenen-Timing an das endgültige Voiceover anzupassen, anstatt Audio zu schneiden.

6. Führe die finale Qualitätssicherung vor der Auslieferung durch.

   • Lies references/qa-checkpoints.md.
   • Führe das Projekt-Linting/Typechecking aus, wenn verfügbar.
   • Rendere Prüfstandbilder mit dem Skript scripts/render-checkpoints.sh dieser Fähigkeit oder expliziten npx remotion still-Befehlen.
   • Rendere das endgültige MP4.
   • Muxe Voiceover mit dem Skript scripts/mux-voiceover.sh dieser Fähigkeit, wenn Audio-Zuverlässigkeit wichtig ist.
   • Überprüfe Dauer, Audiostream und Lautstärke mit ffprobe/ffmpeg.

Superpowers-Regeln

• Behandle die Spezifikation als die Quelle der Wahrheit. Wenn die Implementierung von der Spezifikation abweicht, aktualisiere die Spezifikation oder stoppe und frage nach.
• Behandle den Plan als ausführbar. Markiere eine Aufgabe erst dann als abgeschlossen, wenn ihre Validierung bestanden ist.
• Stoppe bei fehlgeschlagener Validierung, die die endgültige Videoqualität beeinträchtigt: defektes Linting, unlesbarer Text, überlappende Szenen, fehlendes Audio, nicht übereinstimmende Dauer oder leere Schlüsselbilder.
• Bei Überarbeitungen identifiziere zuerst die betroffene Szene und den Frame-Bereich, rendere Vorher-/Nachher-Standbilder und patche dann nur den notwendigen Code.
• Bewahre vom Benutzer bereitgestellte Medien auf. Kopiere oder referenziere sie gezielt; überschreibe keine Quell-Downloads.
• Verwende Screenshots nicht als Hauptvisuelle Sprache für ein Promo-Video, es sei denn, der Benutzer wünscht explizit eine Bildschirm-Tour. Übersetze Produktideen in Bewegungsmetaphern und verwende Screenshots als Belege, Übergänge oder kurze Produktnachweise.

Referenz-Routing

• Benötigst du ein Videodesign: lies writing-video-specs.md.
• Benötigst du eine Planung der Implementierung: lies writing-video-plans.md.
• Benötigst du die Sammlung von Produkt-Assets, Modell-Assets, Screenshots, Token, Lizenzen oder Referenzen: lies asset-sourcing.md.
• Benötigst du die Programmierung von Remotion-Szenen oder -Übergängen: lies remotion-scene-execution.md.
• Benötigst du Design von umfangreichen Frontend-Animationen: lies frontend-animation-system.md.
• Benötigst du Karten, 3D-Stadt/Gelände, Routen oder externe 3D-Modelle: lies 3d-map-and-model-resources.md.
• Benötigst du ein Voiceover-Skript, insbesondere ElevenLabs v3: lies elevenlabs-v3-scripting.md.
• Benötigst du die Ausrichtung von MP3/WAV-Audio oder die Behebung von „kein Ton“: lies audio-sync-and-muxing.md.
• Benötigst du die Überprüfung der endgültigen Qualität: lies qa-checkpoints.md.

Wenn du gebündelte Skripte aus einem Projektverzeichnis ausführst, verwende den absoluten Pfad zum scripts/-Verzeichnis dieser Fähigkeit, es sei denn, es gibt gleichwertige projekteigene Skripte.