Communitygithub.com

Sagart-cactus/codex-skills

Erstellen Sie ausgefeilte, programmatische Produkt-Demo-Videos aus Softwareprojekten unter Verwendung einer gebündelten Remotion-Vorlage, Storyboard-Generierung und TTS-Erzählung. Verwenden Sie dies, wenn Codex eine App, Bibliothek, CLI oder API in ein Demo-Video ohne Bildschirmaufnahme umwandeln muss oder wenn Sie an Storyboard-Szenen, Erzählungen oder Renderings iterieren.

Was ist codex-skills?

Diese Codex-Fähigkeit ermöglicht es, automatisch professionelle Produkt-Demo-Videos aus bestehenden Softwareprojekten zu erstellen. Sie nutzt eine gebündelte Remotion-Vorlage, um Szenen programmatisch zu rendern, ein Storyboard-Generierungssystem, um den Ablauf zu skizzieren, und Text-to-Speech (TTS) für die Sprachausgabe. Die Fähigkeit ist besonders nützlich, wenn Codex ein interaktives oder visuelles Demo-Video ohne manuelle Bildschirmaufnahme benötigt, z.B. für APIs, CLIs oder Bibliotheken. Der Workflow umfasst das Scannen des Projekts, das Erstellen eines Storyboards auf Basis einer Szenen-Katalog-Referenz, das Generieren von Narration-MP3s und das abschließende Rendern des Videos. Die Fähigkeit unterstützt macOS `say`, OpenAI TTS und ElevenLabs und erfordert keine expliziten Slash-Befehle, sondern wird durch direkte Anweisungen an Codex gesteuert.

Funktioniert mit✓Claude Code✓Codex CLI~Cursor
npx skills add https://github.com/Sagart-cactus/codex-skills/tree/HEAD/skills/product-demo-video

In Ihrer bevorzugten KI fragen

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

Dokumentation

Produkt-Demo-Video

Dies ist der Codex-Skill-Port des Claude-Plugins. Es gibt keinen Slash-Befehl, daher sollte Codex den Workflow explizit steuern und die gebündelte Remotion-Vorlage unter assets/remotion-template/ verwenden.

Vorlagen-Setup

  • Falls das Ziel-Workspace noch kein Remotion-Projekt enthält, kopieren Sie assets/remotion-template/ in ein Arbeitsverzeichnis wie demo-video/.
  • Führen Sie npm install in diesem Arbeitsverzeichnis aus.
  • Die Vorlage enthält Szenenkomponenten, Einstiegspunkte, ein Skript für die Erzählung und eine Startdatei src/storyboard.ts.

Workflow

  1. Scannen Sie die README des Zielprojekts, die Dokumentation, Manifeste, den Quellbaum und eventuell vorhandene Screenshots.
  2. Fragen Sie, welche Funktionen hervorgehoben werden sollen, die bevorzugte Länge, den Ton, die Markenfarbe und ob bestimmte Screenshots verwendet werden sollen.
  3. Erstellen Sie ein Storyboard mit references/scene-catalog.md.
  4. Zeigen Sie das Storyboard zur Genehmigung an, es sei denn, der Benutzer fordert explizit den Übersprung dieses Checkpoints.
  5. Schreiben oder aktualisieren Sie src/storyboard.ts.
  6. Generieren Sie MP3s für die Sprachausgabe in public/narration/, indem Sie scripts/generate-narration.sh für jede Szene über ein kleines Hilfsskript aufrufen.
  7. Falls ffprobe verfügbar ist, messen Sie jedes MP3 und setzen Sie durationInSeconds auf die Audiolänge plus etwa 0,8 Sekunden.
  8. Vorschau mit npx remotion studio und rendern mit npx remotion render DemoVideo output/demo.mp4.

Storyboard-Regeln

  • Beginnen Sie immer mit intro und enden Sie mit outro.
  • Halten Sie die meisten Szenen zwischen 8 und 12 Sekunden.
  • Fügen Sie mindestens eine klar animierte Szene wie workflow, comparison oder eine dynamische feature ein.
  • Verwenden Sie echten Code und konkrete Produktdetails aus dem Zielprojekt.
  • Halten Sie die Erzählung in gesprochener Sprache, etwa 120 bis 150 Wörter pro Minute.

Hinweise

  • Das gebündelte TTS-Skript unterstützt macOS say, OpenAI TTS und ElevenLabs.
  • Falls der Benutzer bereits ein Remotion-Projekt besitzt, kopieren Sie nur die benötigten Komponenten, src/storyboard.ts oder das Erzählungsskript anstelle der gesamten Vorlage.

Verwandte Skills