Communitygithub.com

Editing Master

Erstelle Schritt für Schritt ein fesselndes Produktvideo (How-to, Demo, Launch-Teaser, Erklärvideo) mit Claude Code und HyperFrames – basierend auf Codebasis, Live-App-Link, Screenshots, Screen-Recording oder einer Beschreibung.

Was ist Editing Master?

Editing Master ist eine KI-Agentenfertigkeit, die Entwickler und Produktmanager dabei unterstützt, aus einer Codebasis, einem Live-App-Link, Screenshots, einer Bildschirmaufnahme oder einer bloßen Beschreibung ein kurzes, lebendiges Produktvideo zu erstellen – Schritt für Schritt mit Freigabeschleifen. Es verwendet standardmäßig HyperFrames für den Aufbau (mit Funktionen wie Ein-Wort-Bildschirmen, Kamerazoom, Cursor-Klicks, Übergängen und Untertiteln) und bietet einen Schnelldurchlauf (drei Stopps vor dem Rendern) oder einen detaillierten Schritt-für-Schritt-Modus. Der Agent fragt nach dem Zweck des Videos, empfiehlt einen Videostil aus einer Referenzliste (einschließlich HyperFrames, Onetake, Collage B-Roll, Manim und anderen), bietet Hörproben für Stimme, Musik und Soundeffekte zur Auswahl nach Gehör, schreibt ein Drehbuch zur Freigabe, baut eine Vorschau mit allen Elementen und rendert erst nach Genehmigung. Er respektiert die Markenrichtlinien (Farben, Logo, Schriftarten) und gibt während des gesamten Prozesses Zeitangaben, sodass die Benutzer einen klaren Zeitplan haben. Diese Fertigkeit ist ideal für die schnelle Erstellung von App-Demos, Launch-Teasern und Erklärvideos ohne manuelle Bearbeitung.

Funktioniert mit✓Claude Code~Codex CLI✓Cursor
npx skills add https://github.com/Maher-bouchrara/Editing-Master-skill/tree/main/skills/editing-master

In Ihrer bevorzugten KI fragen

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

Dokumentation

Was macht Editing Master?

Verwandle ein Produkt in ein kurzes, lebendiges Video. Der Benutzer gibt eine Zeile („Wie benutzt man es, 2 Minuten“) und alles, was er zum Produkt hat; Du fragst, er wählt, Du baust, er genehmigt, Du renderst.

Womit der Benutzer beginnen kann (eines reicht; mehr ist besser):

QuelleWie Du sie verwendest
Eine Codebasis (der aktuelle Ordner oder ein Pfad)Lese den UI-Quellcode und baue die echten Bildschirme nach.
Ein Link zur Live-App oder -Websitenpx hyperframes capture <url> --json für Screenshots, Farben, Schriftarten und Texte; baue die Bildschirme daraus nach. Frage nach einem Test-Login, wenn Seiten hinter einer Anmeldung liegen; verwende niemals echte Zugangsdaten.
Screenshots oder eine BildschirmaufnahmeBaue jeden Bildschirm aus den Bildern nach; verwende Aufnahmeclips als B-Roll in einem gerahmten Gerät.
Nur eine BeschreibungEntwerfe saubere, plausible Bildschirme in den Markenfarben aus der Beschreibung und erwähne dies im Drehbuch.

Werkzeuge. Standardmäßig erstelle mit den HyperFrames-Fertigkeiten (hyperframes, hyperframes-cli, hyperframes-registry) und verwende media-use für Stimme, Musik und Soundeffekte. Wenn sie fehlen, teile dem Benutzer die Installationsbefehle mit (siehe README) und stoppe. Sage in einer Zeile, welche Fertigkeiten Du verwenden wirst, bevor Du beginnst.

Starter. starter/ ist ein funktionierendes HyperFrames-Projekt mit den folgenden Bausteinen (Ein-Wort-Bildschirme, Kapitelkarte, Kamerafokus mit Cursor-Klick, Übergänge, Outro). Kopiere es in einen neuen video/-Ordner und passe es an; beginne nicht mit einer leeren Seite.

Engine. Alles, was diese Fertigkeit erstellt (Ein-Wort-Bildschirme, Hook- und Kapitelkarten, Kamera, Cursor, Starter), ist HyperFrames, und HyperFrames ist der Standard. Andere Video-Fertigkeiten erzeugen andere Arten von Videos (One-Shot-Kamera, Papiercollage, Aquarell, 2D-Cartoons, erzählte Whiteboard-Erklärvideos, Mathematik-Animation, React-Bewegungsgrafiken, Stock-Footage-Montagen, App-Animationen, Kurzclips aus langen Aufnahmen); jede hat ihren eigenen Workflow. Siehe references/video-skills.md und Schritt 2.

Die goldene Regel: nichts ohne den Benutzer

Alles, was im Video gehört oder gesehen wird (Stimme, Musik, Soundeffekte, Drehbuch, Aussehen), wird dem Benutzer gezeigt oder abgespielt, bevor der Film fertig ist, und es wird nichts gerendert, bevor der Benutzer die Vorschau genehmigt hat. Wie oft Du anhältst, um zu fragen, hängt vom gewählten Modus ab: Schnelldurchlauf oder Schritt für Schritt.

Zwei Modi: Schnelldurchlauf oder Schritt für Schritt

Die Maschinenarbeit ist schnell (≈ 1 Min., um ein 2-minütiges Drehbuch zu vertonen, ≈ 1 Min., um Musik zu finden, ≈ 3 Min., um einen 2-minütigen Film zu rendern). Was ein Video verlangsamt, ist die Anzahl der Male, die der Benutzer anhalten und antworten muss. Biete in Deiner ersten Nachricht die beiden Modi an und empfehle den Schnelldurchlauf:

Schnelldurchlauf (empfohlen)Schritt für Schritt
Stopps vor dem Rendern3, dann „rendern“etwa 11, einer pro Schritt
Fragenalle in einer Nachricht, jede mit einem Standardwertein Schritt nach dem anderen
ProbenStimme, Musik, Mix und Effekte in einem HörpaketStimme, Musik, Effekte in getrennten Runden
Am besten geeignet fürdie meisten Videos, Benutzer, die den Standardeinstellungen vertrauenBenutzer, die jedes Detail steuern möchten

Der Benutzer kann jederzeit wechseln („langsamer“, „schneller“).

Schnelldurchlauf: drei Stopps, dann rendern

Die Schritte 1–11 unten beschreiben weiterhin, wie jedes Teil gemacht wird; der Schnelldurchlauf gruppiert sie in drei Stopps und erledigt die Maschinenarbeit dazwischen ohne Nachfrage.

Stopp 1 · Der Plan (eine Nachricht, Schritte 1–3). Stelle die kurzen Fragen (Schritt 1), zeige das Menü der Video-Fertigkeiten mit Deiner Empfehlung (Schritt 2) und stelle die Stilfragen mit Deiner empfohlenen Antwort für jede (Schritt 3, einschließlich Wort- und Übergangsgeräusche sowie Untertitel). Beende mit: „Antworte, was Du ändern möchtest, oder sage verwende Deine Auswahl.“ Eine Antwort klärt alles. Wiederhole den endgültigen Plan in ein paar Zeilen, mit der Gesamtzeit bis zur Vorschau, und fahre ohne weiteren Stopp fort.

Zwischen Stopp 1 und 2, ohne zu fragen: studiere das Produkt (Schritt 7), schreibe das Drehbuch (Schritt 8) und bereite das Hörpaket vor: die Hook-Zeile in 3 Stimmen, 15–20 s Proben von 3 Musiktiteln, einen Sprach-+ Musik-Mix mit der geplanten Lautstärke unter Verwendung Deiner empfohlenen Stimme und Spur, die Soundeffekt-Zusammenstellung und eine 5–10 s Demo eines Ein-Wort-Bildschirms, der Wort für Wort mit seinen Wortgeräuschen vertont ist (Schritte 4–6). Sage, wie lange dies dauert, bevor Du beginnst (normalerweise ein paar Minuten), und führe die Sprach- und Musikarbeit parallel zum Studium durch.

Stopp 2 · Drehbuch, Bildschirme und Sounds (eine Nachricht). Sende die Drehbuch-Tabelle, die Liste der Schritte, die das Video zeigt, mit einem wiederaufgebauten Bildschirm (ein Schnappschuss), und das Hörpaket, mit Deiner empfohlenen Stimme, Spur und Effekten markiert. Fordere eine Antwort an: „Genehmige das Drehbuch und die Bildschirme und wähle eine Stimme, eine Spur und die Effekte (oder sage verwende Deine Auswahl).“

Zwischen Stopp 2 und 3, ohne zu fragen: vertone das genehmigte Drehbuch, transkribiere es, erstelle die Vorschau (Schritt 9) und überprüfe sie.

Stopp 3 · Vorschau. Sende den Vorschaulink mit Zeitstempeln. Die vollständige Erzählung, Musik und Effekte werden hier zum ersten Mal zusammen gehört. Wende Änderungen an und sende sie erneut, bis der Benutzer genehmigt. Vorschaurunden zählen nicht als zusätzliche Stopps.

Rendern nur, wenn der Benutzer „rendern“ sagt (Schritt 10), dann übergib (Schritt 11).

Wenn der Benutzer im Schnelldurchlauf „mach einfach“ sagt, verwende Deine empfohlenen Auswahlen bei Stopps 1 und 2, sende dennoch das Drehbuch, die Bildschirme und das Hörpaket, damit er zuhören kann, und fahre mit dem Bau der Vorschau fort, ohne zu warten. Stopp 3 wird niemals übersprungen: kein Rendern ohne genehmigte Vorschau.

Schritt für Schritt

Gehe die Schritte 1–11 einzeln durch. Jeder Schritt: sage, wie lange es dauern wird, mache es, zeige das Ergebnis, frage „OK, weiter?“, warte. Verkette niemals zwei Schritte ohne die Zustimmung des Benutzers; wenn der Benutzer „mach einfach“ sagt, biete stattdessen an, zum Schnelldurchlauf zu wechseln.

In beiden Modi

Beginne, indem Du dem Benutzer die Stopps und ungefähren Zeiten nennst (siehe „Zeitbudget“). Sage vor jedem Warten, das länger als ein paar Sekunden dauert, wie lange es dauern wird. Verwende die gemessenen Zeiten im „Zeitbudget“; wenn es keine gemessene Zahl gibt, sage dies („mehrere Minuten auf einer CPU“), anstatt eine zu erfinden.

Die Schritte

1 · Welches Video möchtest Du? (immer zuerst fragen)

Auch wenn der Benutzer nur „mach ein Video“ gesagt hat, frage mit Beispielen und einer Empfehlung (im Schnelldurchlauf in derselben Nachricht wie Schritt 2 und 3, zusammen mit der Modus-Frage):

  • Wofür ist es? (Wie benutzt man es, was es tut, ein Launch-Teaser, eine Feature-Tour, eine Werbung…)
  • Wer schaut es? (Neue Benutzer, Kunden, Investoren, ein Team…)
  • Länge und Format: 30 s / 60 s / 2 min; 16:9 oder 9:16 vertikal.
  • Die eine Botschaft, die sie sich merken sollen.
  • Was hast Du zum Produkt: eine Codebasis, einen Link, Screenshots, eine Aufnahme oder nur eine Beschreibung? (Überspringe, wenn es offensichtlich ist, z. B. wenn Du dich in seinem Repository befindest.)

Schritt für Schritt: wiederhole die Kurzbeschreibung in drei Zeilen und warte auf „ja“.

2 · Welche Video-Fertigkeit? (eine empfehlen, dann fragen)

Lies references/video-skills.md, zeige dem Benutzer dann dessen Menü als eine Tabelle: Name jeder Fertigkeit, wie das Video aussieht, wofür es am besten geeignet ist, wie lange es dauert und was es kostet, in Worten, die jemand Neues versteht. Gruppiere es in „Video von Grund auf neu erstellen“ (HyperFrames, Onetake, Collage B-Roll, Clawd Animation, Lemo Opuscar, explainroo, iart explainer skills, Manim, Remotion, Animate, Guizang product video, OpenMontage, Lottie) und „Ein bereits vorhandenes Video bearbeiten“ (Clipify, Cut Video).

Empfehle dann eine für dieses Projekt aus der Tabelle „Welche für welches Projekt?“, in ein oder zwei Zeilen: warum sie zur Kurzbeschreibung passt, ihre Kosten und Lizenz, ihre Zeit. Nenne einen knappen Zweitplatzierten, falls vorhanden. Kennzeichne Lizenzen, die für Unternehmensvideos wichtig sind (Onetake, Remotion, AGPL-Fertigkeiten) und alles, was einen bezahlten Schlüssel, eine GPU oder macOS benötigt.

Sage, dass die Bausteine dieser Fertigkeit und der Starter HyperFrames sind; bei einer anderen Engine folge dem eigenen Workflow dieser Fertigkeit und behalte den Modus und die Regeln dieser Fertigkeit bei (Schnelldurchlauf oder Schritt für Schritt, lass den Benutzer alles hören, Vorschau vor dem Rendern). Wenn die gewählte Fertigkeit nicht installiert ist, gib ihren Installationsbefehl und warte.

3 · Stilfragen (eine Nachricht, Optionen + Empfehlung für jede)

  1. Präsentator: keiner, das mit der Stimme pulsierende Logo in einem abgerundeten Rahmen (kostenlos) oder ein sprechender Avatar (kostenpflichtig).
  2. Cursor- und Klickgeräusche bei jeder Aktion? (empfehle ja)
  3. Kamera: leichte / mittlere / starke Zooms (empfohlen: mittel).
  4. Kinetischer Text: Ein-Wort-Bildschirme für den Hook, Kapitelkarten, eine „Das ist der einfachste Teil“-Hook-Karte? Welche Momente? (Zeige Beispiele aus docs/img oder beschreibe sie.)
  5. Geräusche auf Ein-Wort-Bildschirmen und Übergängen: ein kurzes Geräusch bei jedem Wort, wenn es landet (Pop, Hit, Tick, Snap, ein Boom auf dem Schlüsselwort, ein Riser in eine Enthüllung, oder keines)? Das gleiche Geräusch bei jedem Wort oder ein anderes beim Schlüsselwort? Ein Geräusch bei jedem Übergang (Swoosh, Whoosh, Impact)? Empfehle z. B. „Pop bei jedem Wort, Hit beim Schlüsselwort, Swoosh bei Kapitelüberblendungen“. Die Stimme sagt jedes Ein-Wort-Bildschirm-Wort einzeln, betont, im Ton des Bildschirms. Siehe references/music-sfx-subtitles.md.
  6. Untertitel: keine, im Video eingebrannt oder separate Untertiteldateien? Dann welche Sprachen?
    • Eingebrannt: immer sichtbar, auf jeder Plattform und bei ausgeschaltetem Ton (Social Feeds, Anzeigen), aber nur eine Sprache und eine Änderung bedeutet ein erneutes Rendern.
    • Separate Dateien: .srt (Player, YouTube, LinkedIn) und/oder .vtt (Web-Player), eine pro Sprache, von Hand bearbeitbar, Zuschauer schalten sie ein und aus; eine Plattform oder ein Player, der sie ignoriert, zeigt keine an.
    • Empfehle eingebrannt für kurze Social-Clips, die stumm automatisch abgespielt werden, separate Dateien für Anleitungen und alles in mehreren Sprachen. Beides ist in Ordnung (brenne die Hauptsprache ein, liefere Dateien für alle).
  7. Marke: lese Farben, Logo und Schriftarten aus der Quelle; frage nur nach dem, was fehlt, und zeige die Palette, die Du verwenden wirst.

4 · Stimme: zuhören, dann wählen

Sage zuerst die Zeit: Kostenlose Kokoro-Stimmen brauchen ≈ 5 s pro Zeile (meistens zum Laden des Modells) und ≈ 1 Min. für ein ganzes 2-minütiges Drehbuch; kostenpflichtige Stimmen sind schnell, benötigen aber ein Konto und einen API-Schlüssel.

  1. Biete die Werkzeuge an: kostenlos auf diesem Rechner (Kokoro, npx hyperframes tts, kein Konto) oder kostenpflichtig (HeyGen, ElevenLabs: sage, was jedes benötigt und kostet).
  2. Vertone dieselbe Hook-Zeile in 3 Stimmen (z. B. energiegeladener US-Mann, warme US-Frau, ruhiger britischer Mann) und sende die Dateien, damit der Benutzer zuhören kann.
  3. Warte auf die Wahl. Biete weitere Proben oder eine andere Geschwindigkeit an, wenn keine passt.

5 · Musik: zuhören, dann wählen

Sage zuerst die Zeit: Ein kostenloser CC-Titel dauert ≈ 1 Min. zum Finden und Herunterladen, plus ein paar Sekunden pro Probenausschnitt; Musik lokal generieren (MusicGen) ist kostenlos, aber auf einer CPU langsam, mehrere Minuten pro Clip; ein kostenpflichtiger Katalog (HeyGen Music) ist sofort verfügbar, benötigt aber ein Konto.

  1. Finde 3 Kandidaten-Titel, die zur Stimmung passen (zuerst kostenlose CC-Titel; sage die Lizenz und ob eine Quellenangabe erforderlich ist).
  2. Schneide eine 15–20 s Probe von jedem aus dem Teil, den Du verwenden würdest, und sende sie.
  3. Warte auf die Wahl (oder „keine Musik“). Sage dann die Lautstärke, die Du verwenden wirst (≈ 16 % unter der Stimme) und sende einen 15 s Mix aus Stimme + Musik, damit die Balance gehört werden kann.

6 · Soundeffekte: zuhören, dann bestätigen

Sende die Klick-, Pop-, Whoosh- und Tippgeräusche, die Du verwenden möchtest (eine kurze Datei pro Stück oder eine Datei mit allen hintereinander), plus die in Schritt 3 gewählten Wort- und Übergangsgeräusche. Sende dann eine 5–10 s Demo eines Ein-Wort-Bildschirms: jedes Wort einzeln vertont mit seinem Geräusch auf seiner Wortzeit, sodass Stimme und Geräusche zusammen gehört werden. Frage: behalten, ändern (pro Wort, falls gewünscht) oder keine Effekte.

7 · Das Produkt studieren

Aus dem, was der Benutzer Dir gegeben hat, liste die 5–8 Dinge auf, die ein Benutzer tatsächlich tut, in der Reihenfolge:

  • Codebasis: lies die README, den UI-Quellcode (Markup, CSS-Token, Texte, Icons) und Marken-Assets; erstelle die echte Benutzeroberfläche aus ihrem Quellcode neu.
  • Link: erfasse die wichtigen Seiten (npx hyperframes capture <url> --json), durchlaufe den Hauptfluss in einem Browser, falls nötig, und erstelle die Bildschirme aus den Aufnahmen neu (gleiche Bezeichnungen, Farben, Radien, Abstände). Nimm keine Live-Site für den Film auf, es sei denn, der Benutzer verlangt es.
  • Screenshots / Aufnahme: erstelle jeden Bildschirm aus den Bildern neu; behalte Aufnahmeclips für B-Roll in einem Geräterahmen.
  • Nur Beschreibung: entwerfe die Bildschirme aus der Beschreibung und der Marke; halte sie einfach und kennzeichne sie im Drehbuch als illustrativ.

Erfinde niemals Funktionen, die das Produkt nicht hat. Unbekannte oder private Namen werden neutral („Modell A, B, C“); Beispiel-Geheimnisse sind offensichtlich falsch und im Quellcode getrennt (ghp_<i></i>…). Wenn das Aussehen unklar ist, frage nach einem Screenshot, anstatt zu raten.

Zeige dem Benutzer die Liste der Schritte, die Du im Video zeigen wirst, und einen wiederaufgebauten Bildschirm (einen Schnappschuss), und frage: „Sieht es so aus, und sind dies die richtigen Schritte?“ Warte.

8 · Drehbuch (auf „genehmigt“ warten)

Eine Szenentabelle: Zeit · auf dem Bildschirm · Voiceover · Effekt (Ein-Wort-Bildschirm, Zoom, Hook-Karte…) · Geräusch (pro Wort auf Ein-Wort-Bildschirmen, pro Übergang). Schreibe Ein-Wort-Zeilen mit Punkten zwischen den Wörtern („Einfügen. Maskieren. Senden.“), damit die Stimme jedes Wort betont. Regeln in references/kinetic-type-and-hooks.md (Hook in 5 s, eine Idee pro Szene, 15–20 Wörter pro Szene, jeder Satz wird auf dem Bildschirm gezeigt, ein Aufmerksamkeits-Reset alle 20–30 s). Sende es und warte auf „genehmigt“; ändere es so oft wie verlangt. Vertone die Zeilen erst nach der Genehmigung (≈ 1 Min. für ein 2-minütiges Drehbuch mit Kokoro; sage dies), sende dann die vollständige Erzählung zum Anhören und frage, bevor Du darauf aufbaust.

9 · Die Vorschau erstellen

  • Stimme: eine Datei pro Zeile; transkribiere die vollständige Erzählung (npx hyperframes transcribe, ≈ 20 s für einen 4-minütigen Film) für Wortzeiten. Jede Aktion trifft auf ihr Wort (Wortzeit + 0,2 s).
  • Untertitel wie in Schritt 3 gewählt: eingebrannte Untertitel als eine HyperFrames-Ebene (in der Vorschau sichtbar) oder SRT/VTT-Dateien aus dem Transkript. Siehe references/music-sfx-subtitles.md.
  • Kamera, Übergänge, Cursor: references/transitions-and-camera.md.
  • Tempo und Lesezeit: references/pacing-and-voice.md.
  • Musik, Effekte, Untertitel, Cover: references/music-sfx-subtitles.md.
  • Überprüfung: npx hyperframes check, dann npx hyperframes snapshot --at … bei jedem Schritt und Schnitt; betrachte die Frames und behebe Überlappungen.

Verwandte Skills