Communitygithub.com

ahmadrashad1/video

Produzieren Sie ein fertiges, vertontes Loom-ähnliches Bildschirmaufnahme-Video (MP4, 1080p, mit der eigenen Stimme des Benutzers per Fish Audio, Untertiteln, ohne Webcam), das eine Website oder Web-App demonstriert. Verwenden Sie dies, wenn der Benutzer /loom:video ausführt oder darum bittet, eine Anwendung aufzuzeichnen, zu demonstrieren oder ein Walkthrough-/Tutorial-Video zu erstellen.

Was ist video?

Das `ahmadrashad1/video` Skill ist ein professionelles Werkzeug für KI-Agenten (wie Claude Code), um vollständig produzierte, vertonte Bildschirmaufnahme-Videos im Loom-Stil zu erstellen. Es plant, führt aus und rendert Demonstrationen von Websites oder Web-Apps in 1080p MP4 mit der eigenen, geklonten Stimme des Benutzers über Fish Audio und optional eingebrannten Untertiteln, ohne Webcam-Feed. Der Skill arbeitet über ein CLI-Tool namens `loom` und stellt dabei mehrere nicht verhandelbare Regeln auf, darunter die Pflicht zur Genehmigung des Plans vor der Aufnahme und das Verbot von gefälschtem Filmmaterial. Der Workflow umfasst acht Schritte: Einrichten der Stimme, Verstehen der Anwendung und Zielgruppe, Inspizieren der echten App und Sammeln von Selektoren, Erstellen und Validieren eines Szenenplans (4-10 Szenen), Vertonen mit der geklonten Stimme, Aufnehmen der Bildschirmaktionen, Rendern des Videos mit Untertiteln und abschließende Überprüfung aller Standbilder auf Korrektheit und sensible Daten. Das Skill unterstützt sowohl Browser- als auch experimentelle Desktop-Demos (via OBS) und enthält eine detaillierte Fehlerbehandlung für häufige Probleme wie fehlende Abhängigkeiten oder Authentifizierungsfehler bei Fish Audio.

Funktioniert mit✓Claude Code~Codex CLI~Cursor
npx skills add https://github.com/ahmadrashad1/loom-skill/tree/HEAD/skills/video

In Ihrer bevorzugten KI fragen

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

Dokumentation

Vertontes Demovideo

Sie planen und steuern die Demonstration. Der Befehl loom (bei aktiviertem Plugin in Ihrem PATH verfügbar) übernimmt die Vertonung, Aufnahme, das Rendern und die Überprüfung. Führen Sie ihn einfach als loom … aus einem beliebigen Verzeichnis aus. Videos werden im Aufnahmeordner gespeichert, den Sie mit loom status sehen (standardmäßig ~/Videos/loom/<slug>/). Im Folgenden steht <rec> für diesen Ordner.

Anforderung: $ARGUMENTS

Wenn die Anforderung der Slug einer vorhandenen Aufnahme ist (loom status listet sie auf), setzen Sie die Arbeit ab dem ersten unerledigten Schritt unten fort. Ein nicht genehmigter Plan muss noch genehmigt werden.

Nicht verhandelbare Regeln

  1. Nie einen nicht genehmigten Plan aufnehmen. Schreiben Sie den Plan mit "approved": false, zeigen Sie ihn dem Benutzer und setzen Sie ihn erst auf true, nachdem der Benutzer ihn genehmigt hat (oder er ausdrücklich gesagt hat, dass Sie ohne Überprüfung fortfahren sollen).
  2. Destruktive oder irreversible Aktionen (Löschen, Kaufen, Bereitstellen, Senden, Zahlung, Ändern von Produktionseinstellungen) müssen mit "destructive": true gekennzeichnet werden und benötigen die ausdrückliche Zustimmung des Benutzers für dieses Video, bevor Sie --allow-destructive übergeben.
  3. Keine Geheimnisse in plan.json oder Vertonung. Eingetippte Passwörter/Tokens verwenden "secret_env": "VAR"; auf dem Bildschirm sichtbare Schlüssel, E-Mails, Tokens, Kontonummern kommen in "redact" (CSS-Selektoren, für das gesamte Video unscharf). Geben Sie niemals den Inhalt von ~/.config/loom/*.env aus.
  4. Kein gefälschtes Filmmaterial. Jede Szene muss vom Recorder echt ausgeführt werden. Wenn eine Szene fehlschlägt, korrigieren Sie den Plan und nehmen Sie sie neu auf. Fälschen Sie niemals ein Ergebnis und präsentieren Sie niemals ein Video, das loom verify nicht bestanden hat, als fertig.
  5. Keine Webcam, nur eigene Stimme. Die Vertonung verwendet das eigene Fish-Audio-Stimmmodell des Benutzers. Verwenden oder schlagen Sie niemals die Stimme einer anderen Person ohne deren Erlaubnis vor.

Arbeitsablauf

0. Stimmeinrichtung (erster Start)

Führen Sie loom status aus. Wenn dort VOICE NOT CONFIGURED steht, richten Sie die Stimme vor allem anderen ein; befolgen Sie das /loom:setup Skill (${CLAUDE_PLUGIN_ROOT}/skills/setup/SKILL.md). Fragen Sie den Benutzer nach seiner eigenen Fish-Audio-Stimmmodell-ID; erfinden oder verwenden Sie nie eine fremde. Wenn der Benutzer die Stimme jetzt nicht einrichten möchte, können Sie mit --provider espeak als roboterhafte Vorschau-Stimme fortfahren und deutlich sagen, dass es nicht seine Stimme ist.

A. Verstehen

Ermitteln Sie: welche App/URL, welches Ergebnis der Betrachter erzielen soll, die Zielgruppe und ob eine Anmeldung erforderlich ist. Wenn einer dieser Punkte unklar ist, stellen Sie eine präzise Frage; andernfalls fahren Sie mit sinnvollen Annahmen fort und nennen Sie diese.

B. Die echte App inspizieren

loom inspect <url> --out <rec>/<slug>/inspect

Lesen Sie den Screenshot (<rec>/<slug>/inspect/page.png) und verwenden Sie die gedruckten Selektoren. Inspizieren Sie jede Seite, die die Demo besuchen wird (folgen Sie dem Ablauf), damit die Selektoren echt und nicht geraten sind. Bevorzugen Sie #id, [data-testid=…], dann role=button[name="…"], dann text=…. Lokale Dateien funktionieren als file:///…-URLs.

C. Den Plan schreiben

Erstellen Sie <rec>/<slug>/plan.json gemäß ${CLAUDE_PLUGIN_ROOT}/skills/video/reference/plan-schema.md. Richtlinien:

  • 4–10 Szenen; beginnen Sie mit einer title-Szene, enden Sie mit einer kurzen Zusammenfassungsszene.
  • Vertonung: erste Person, gesprächig, wie ein Kollege, der ein Loom aufnimmt. 1–3 Sätze pro Szene (≈ 6–20 s). Beschreiben Sie, was der Betrachter sieht, während es passiert; lesen Sie keine Selektoren oder URLs Zeichen für Zeichen vor.
  • Aktionen werden ausgeführt, während die Vertonung dieser Szene läuft; halten Sie sie kurz genug, damit sie hineinpasst (≈ 2,6 Wörter pro Sekunde Sprache). Teilen Sie lange Abläufe in mehr Szenen auf.
  • Fügen Sie expect zu jeder Szene hinzu, die den Zustand ändert, damit Fehler erkannt werden.
  • loom validate <slug> ausführen, bis es erfolgreich ist.

Präsentieren Sie dem Benutzer den Plan als Tabelle (Szene · was auf dem Bildschirm passiert · Vertonung) plus alles Destruktive, benötigte Geheimnisse und die geschätzte Länge. Halten Sie an und warten Sie auf die Genehmigung. Nach der Genehmigung setzen Sie "approved": true.

D. Vertonen

loom voice <slug>: eine WAV-Datei pro Szene in der geklonten Stimme (zwischengespeichert; nur geänderte Szenen werden neu generiert). Prüfen Sie, ob die Dauern sinnvoll sind.

E. Aufnehmen

loom record <slug> (fügen Sie --allow-destructive nur gemäß Regel 2 hinzu). Wenn es fehlschlägt, lesen Sie den Fehler und <rec>/<slug>/raw/failure-<scene>.png, korrigieren Sie Selektoren/Wartezeiten im Plan und führen Sie es erneut aus. Inspizieren Sie Seiten bei Bedarf neu.

F. Produzieren

loom render <slug> (--captions burn, wenn der Benutzer eingebrannte Untertitel wünscht; Standard ist ein eingebetteter Untertitel-Track plus subtitles/captions.srt).

G. Überprüfen (immer)

loom verify <slug>, dann betrachten Sie jedes Vorschaubild in <rec>/<slug>/scenes/*.jpg mit dem Lesewerkzeug: Ist der erwartete Bildschirmzustand sichtbar? Ist etwas Sensibles nicht geschwärzt? Gibt es Fehlerseiten oder Cookie-Banner, die Inhalte verdecken? Wenn eine Warnung besagt, dass Aktionen die Vertonung überholt haben, ziehen Sie in Betracht, diese Szene aufzuteilen. Korrigieren und wiederholen Sie die notwendigen Schritte, bis die Überprüfung bestanden ist.

H. Berichten

Geben Sie den Pfad zu <rec>/<slug>/final_video.mp4, dessen Länge, die Szenenliste und etwaige Einschränkungen (z. B. verwendete Vorschau-Stimme) an. Erwähnen Sie, dass die integrierte Vorschau von VS Code MP4s ohne Ton abspielt; verwenden Sie einen normalen Videoplayer. Abkürzung für die Schritte D–G, sobald ein Plan genehmigt ist: loom run <slug>.

Fehlerbehebung

  • loom: command not found → das bin/ des Plugins ist nicht im PATH; führen Sie stattdessen ${CLAUDE_PLUGIN_ROOT}/bin/loom aus.
  • loom needs uv → teilen Sie dem Benutzer mit, uv zu installieren (der Befehl wird angezeigt).
  • Element nicht gefunden → führen Sie loom inspect für diese Seite erneut aus; fügen Sie wait_for hinzu.
  • Cookie-/Einwilligungsbanner → fügen Sie in der ersten Szene ein click auf die Schaltfläche zum Akzeptieren hinzu.
  • Anmeldung → type mit secret_env; bitten Sie den Benutzer, die Variable zu exportieren.
  • Fish Audio 401 → falscher API-Schlüssel. 402 → kein API-Guthaben für dieses Modell; schlagen Sie vor, Guthaben aufzuladen oder die Modelleinstellung des Plugins auf s2.1-pro-free zu ändern.
  • Desktop-Demos (außerhalb des Browsers) → --recorder obs (OBS muss mit aktiviertem WebSocket und einer Bildschirmaufnahme-Szene laufen). Dieser Pfad ist experimentell.

Verwandte Skills