Communitygithub.com

ScreenBeaver/ScreenBeaver

Der Benutzer möchte die Hände in den Schoß legen, während du sein Produkt steuerst (flüssiger Cursor + Klicks + echtes Tippen) und ein Screen Beaver Video erstellst.

Was ist ScreenBeaver?

Screen Beaver ist ein KI-gestütztes Tool zur Demo-Erstellung, das es einem KI-Agenten (wie Claude Code oder Cursor) ermöglicht, eine Produkt-UI selbstständig zu steuern, dabei ein Video aufzunehmen und automatisch mit Zooms, Untertiteln, Sprachausgabe und Hintergrundmusik zu versehen. Der Agent führt echte Mausbewegungen, Klicks und Tastatureingaben auf der Zielanwendung aus, während Screen Beaver im Hintergrund aufzeichnet – ohne dass der Benutzer den Bildschirm teilen oder manuell eingreifen muss. Die Integration erfolgt über ein MCP-Protokoll (Model Context Protocol) mit einem lokalen Bridge-Server, der die Befehle annimmt und direkt an die Desktop-App weiterleitet. Der Workflow kann vollständig automatisiert werden: von der Fensterauswahl über die Steuerung der Demo-Schritte bis hin zur Generierung von Voiceover, Musik und der automatischen Anpassung von Zooms. Die Lösung ist primär für Windows konzipiert und erfordert, dass das Screen Beaver Desktop-Programm läuft und der MCP-Server installiert ist. Für die Benutzung sind keine manuellen Skripte oder JSON-Dateien nötig – alles wird über die MCP-Tools gesteuert, was die Nutzung sowohl sicherer als auch effizienter macht.

Funktioniert mit~Claude Code~Codex CLI✓Cursor
npx skills add https://github.com/ScreenBeaver/ScreenBeaver/tree/main/.cursor/skills/screen-weaver-demo

In Ihrer bevorzugten KI fragen

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

Dokumentation

Screen Beaver Live-Demo-Builder

Der Benutzer möchte die Hände in den Schoß legen, während du ihr Produkt steuerst (flüssiger Cursor + Klicks + echtes Tippen) und ein Screen Beaver Video erstellst. Bevorzuge native Aufnahme (kein Windows-Share-Picker). Änderungen werden im Auto-Modus (ein Rezept) angewendet. Sie klicken selbst auf Exportieren.

Harte Regeln

  1. Verwende ausschließlich das screen-beaver MCP. Bevorzuge record_and_build (enthält Demo-Automatisierung). Verwende atomare demo_*-Tools oder run_demo für benutzerdefinierte Klickpfade.
  2. Wenn screen-beaver in der MCP-Tool-Liste dieser Sitzung fehlt, stoppe. Sage dem Benutzer, er soll es unter Anpassen → MCPs aktivieren, einmal npm run mcp:install ausführen und dann Cursor neu laden / einen neuen Chat starten. Verwende keine Rückfalllösung mit rohem HTTP, curl, fetch oder Shell gegen 127.0.0.1:17355.
  3. Schreibe oder führe niemals .ps1, .bat, .cmd oder andere Shell-Skripte aus, um mit Screen Beaver zu kommunizieren.
  4. Erstelle niemals JSON-Demo-/Rezept-Dateien auf der Festplatte als Workaround – übergib Schritte/Payloads direkt in den MCP-Tool-Argumenten.
  5. Rufe export_mp4 nur auf, wenn der Benutzer explizit nach dem Export fragt.
  6. Halte Screen Beaver Desktop geöffnet (npm run desktop:dev oder die installierte App). Bridge: http://127.0.0.1:17355 (wird nur vom MCP-Server verwendet). Falls ping_studio fehlschlägt, sage ihnen, sie sollen die App öffnen – hänge nicht.
  7. Bitte sie niemals, auf den OS-Bildschirm-Share-Picker zu klicken – verwende start_capture / record_and_build (native Fensterauswahl).
  8. Nimm niemals eine leere Seite auf und füge nur Untertitel hinzu. Steuere die UI während der Aufnahme immer aktiv.
  9. Halte Takes so kurz wie das Skript benötigt. Stoppe, sobald der letzte Klick/Tastendruck beendet ist (durationSec-Padding ≤ ~0,4s). Füge keine langen nachlaufenden Wartezeiten hinzu.
  10. Verwende demo_type / { op: "type", text } zum Tippen – Taste für Taste, kein Zwischenablage-Einfügen.
  11. Erzähle kurz im Chat, damit sie das Screen Beaver-Fenster beobachten.
  12. Koordinaten: Rufe get_window_layout auf (oder verwende contentNx/contentNy) – verlasse dich nie auf die eingebettete Browser-Größe von Cursor. Seitenrelative contentNx/contentNy werden automatisch durch den Browser-Chrome gemappt.
  13. Auto-Modus: Lass das Studio Zooms + Tipp-SFX aus echten Klicks/Tastenanschlägen ableiten. Platziere keine manuellen Agent-Zooms/-Sounds, die mit Auto kollidieren. record_and_build nur Untertitel + regenerateAutoZooms.
  14. Sprachaufnahme (Voiceover): Rufe nach den Untertiteln generate_voiceover auf (Standard: Englisch). Wenn der Benutzer eine andere Sprache wünscht, übergib targetLang (z.B. hi-IN) – die Untertitel werden zuerst übersetzt, dann per Edge TTS. Bevorzuge record_and_build({ voiceover: true, voiceoverLang }), das dies automatisch erledigt.
  15. Hintergrundmusik: Verwende Openverse via MCP (pick_background_music / record_and_build mit backgroundMusic: true). Kein Pixabay / .env-Keys. Glare- / Clear-Effekte spielen das gebündelte Shimmer-SFX (Shining.mp3).

Workflow A – komplett automatisiert (öffnet zuerst die Screen Beaver UI)

record_and_build macht jetzt:

  1. focus_studio – bringt Screen Beaver in den Vordergrund
  2. open_record_picker – öffnet die gleiche „Neue Aufnahme starten“ / Freigabeoptionen-UI
  3. Öffnet productUrl / App
  4. start_capture – wählt das Fenster nativ aus (Anwendung), zeigt „Aufnahme läuft…“
  5. Führt demoSteps aus
  6. Stoppt sofort + automatische Zooms/Untertitel aus dem Take
  7. generate_voiceover – Englisch standardmäßig; Übersetzung+TTS wenn voiceoverLang gesetzt ist
  8. pick_background_music – Openverse CC-Hintergrund (dezente Corporate-Instrumentalmusik)
ping_studio
  → record_and_build({
      productName, productUrl, titleContains: "Edge",
      voiceover: true,
      voiceoverLang: "en-US",   // oder "hi-IN" / "es-ES" etc.
      backgroundMusic: true,
      musicQuery: "upbeat corporate instrumental",
      demoSteps: [ ... ],
      introCaption: "...",
      features: [{ title: "Anmelden", atSeconds: 3 }]
    })
  → Sage dem Benutzer: Klicke auf Exportieren, wenn fertig

Oder auf einem bestehenden Take: generate_voiceover({ targetLang: "en-US" }) pick_background_music({ query: "ruhige Tech-Ambient-Instrumentalmusik" }) generate_voiceover({ speakLang: "en-US", targetLang: "hi-IN" })

Demo-Schritte

opBedeutung
wait{ ms } – kurz halten; keine langen End-Paddings
move / clickbevorzuge { contentNx, contentNy } 0..1 in der Webseite; oder { nx, ny } im äußeren Fenster
type{ text, delayMs? } Taste für Taste (erzeugt Tipp-SFX)
scroll / focus / right_clickwie gehabt

Grenzen

  • Native Aufnahme + Eingabeautomatisierung sind nur für Windows Desktop.
  • Demo-Maus-/Tastatureingabe funktioniert nur während die Aufnahme läuft.
  • Der OS-Share-Dialog wird den Agenten niemals gezeigt – Screen Beaver blendet die In-App-Freigabeoptionen ein und nimmt dann das Fenster nativ auf.

Verwandte Skills