Communitygithub.com

cubeplexai/auto-demo-video

Szenario → Skript → Playwright-Kinorecording → Highlight-Pipeline für automatische Demovideos.

Was ist auto-demo-video?

auto-demo-video ist eine generische Pipeline zur Erstellung von Live-Produktdemos, die ein Szenario (z.B. in YAML) über Playwright in kinematografische Aufnahmen umwandelt. Sie eignet sich für Entwicklerteams, die wiederkehrende manuelle Demoaufnahmen automatisieren möchten, und unterstützt Plattformen wie Claude Code, Cursor, oder Codex. Die Pipeline trennt strikt produktspezifische Logik, die im jeweiligen Produkt-Repository verbleibt, von generischen Schritten wie Planung, Aufnahme, Schnitt und Rendering. Der Workflow umfasst die Befehle `adv plan`, `adv record`, `adv edit`, `adv render` und `adv all`, die nacheinander ausgeführt werden. Adapter werden für die Anmeldung und benutzerdefinierte Interaktionen verwendet, wobei `generic-web` der eingebaute Standardadapter ist. Das Ergebnis ist eine finale MP4-Datei, die optional in Remotion-Projekte integriert werden kann.

Funktioniert mit~Claude Code~Codex CLI~Cursor
npx skills add cubeplexai/auto-demo-video

In Ihrer bevorzugten KI fragen

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

Dokumentation

Was macht auto-demo-video?

Generische Pipeline für Live-Produktdemos.

Harte Regel

Füge keine produktspezifische Logik in das auto-demo-video-Repository ein (Workspace-Namen, Brand-Prompts, Tenancy-Picker, App-Testids).
Behalte diese im Consumer-App- / Marketing-Repository und übergebe sie via:

  • scenario.yaml (Schritte, Bildunterschriften, Prompts)
  • adapter: ./pfad/zu/adapter.mjs + adapterOptions
  • env-Anmeldedaten / storage-state.json

Befehle

adv plan   --scenario <yaml> [--code-root <verzeichnis>]
adv record --script <script.json>
adv edit   --meta <meta.json> [--target-sec 90]
adv render --plan <edit-plan.json>
adv all    --scenario <yaml> --out runs/job

Adapter

Eingebaut: generic-web nur.

Extern:

adapter: ./demos/adapter.mjs
adapterOptions:
  # frei für Ihren Adapter

Form: export default { loginPath?, isAuthed?, afterLogin?, custom?, composerPlaceholders? }.

Workflow

  1. Szenario + optionalen externen Adapter im Produkt-Repository verfassen.
  2. adv plan → script.json prüfen.
  3. BASE_URL + Anmeldedaten (oder Storage-Zustand) setzen.
  4. adv record → Meta/Screenshots inspizieren.
  5. adv edit → adv render → final.mp4.
  6. Optionales Remotion-Packaging in einem anderen Projekt.

Dokumentation

  • docs/pipeline.md
  • docs/shotcraft-notes.md
  • schemas/*.json

Verwandte Skills