Communitygithub.com

ScreenBeaver/ScreenBeaver

Constructor de demostraciones en vivo de Screen Beaver

¿Qué es ScreenBeaver?

Este skill permite construir videos de demostración de productos mediante Screen Beaver con mínima intervención del usuario. El asistente de IA controla el cursor, los clics y la escritura para simular una interacción real con el producto. Está diseñado para funcionar con el protocolo MCP de Screen Beaver, utilizando herramientas como `record_and_build` para automatizar todo el flujo: captura de ventana nativa, ejecución de pasos de demostración, generación de subtítulos, locuciones y música de fondo. Soporta principalmente Windows para captura nativa y automatización de entrada, y depende de que el MCP de Screen Beaver esté habilitado en la sesión del agente (Cursor, Codex, etc.). Incluye reglas estrictas para evitar workarounds como scripts locales, archivos JSON en disco o llamadas HTTP directas. Ideal para creadores de contenido, equipos de producto o documentación que quieran generar demos rápidas y pulidas sin grabar manualmente.

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

Preguntar en tu IA favorita

Abre un nuevo chat con esta habilidad de agente ya precargada.

Documentación

Screen Beaver: Constructor de demostraciones en vivo

El usuario quiere permanecer inactivo mientras tú manejas su producto (cursor suave + clics + escritura real) y construyes un video de Screen Beaver. Prefiere captura nativa (sin el selector de compartir de Windows). Las ediciones se aplican en modo automático (una receta). El usuario hace clic en Exportar por sí mismo.

Reglas estrictas

  1. Usa solo el MCP screen-beaver. Prefiere record_and_build (incluye automatización de demo). Usa herramientas atómicas demo_* o run_demo para rutas de clic personalizadas.
  2. Si screen-beaver no aparece en la lista de herramientas MCP de esta sesión, detente. Indícale al usuario que lo active en Customize → MCPs, ejecute npm run mcp:install una vez, y luego recargue Cursor / inicie un nuevo chat. No recurras a HTTP, curl, fetch o Shell contra 127.0.0.1:17355.
  3. Nunca escribas ni ejecutes scripts .ps1, .bat, .cmd u otros para comunicarte con Screen Beaver.
  4. Nunca crees archivos JSON de demo/receta en disco como solución alternativa — pasa los pasos/payloads en los argumentos de las herramientas MCP.
  5. No llames a export_mp4 a menos que el usuario lo pida explícitamente.
  6. Mantén Screen Beaver abierto (npm run desktop:dev o la app instalada). Bridge: http://127.0.0.1:17355 (usado solo por el servidor MCP). Si ping_studio falla, dile que abra la app — no te quedes colgado.
  7. Nunca le pidas que haga clic en el selector de compartir pantalla del sistema operativo — usa start_capture / record_and_build (selección nativa de ventana).
  8. Nunca grabes en inactividad una página en blanco y solo añadas subtítulos. Siempre maneja la interfaz durante la captura.
  9. Mantén las tomas tan cortas como el guión lo requiera. Detente tan pronto como termine el último clic/escritura (duraciónSec padding ≤ ~0,4 s). No añadas largas esperas al final.
  10. Usa demo_type / { op: "type", text } para escribir — tecla por tecla, nunca pegar desde el portapapeles.
  11. Narra brevemente en el chat para que el usuario observe la ventana de Screen Beaver.
  12. Coordenadas: llama a get_window_layout (o usa contentNx/contentNy) — nunca confíes en el tamaño del navegador embebido de Cursor. Las contentNx/contentNy relativas a la página se mapean automáticamente a través del marco del navegador.
  13. Modo automático: deja que el estudio derive los zooms y efectos de sonido de escritura a partir de clics y teclas reales. No coloques manualmente zooms/sonidos de agente que compitan con Auto. record_and_build solo subtítulos + regenerateAutoZooms.
  14. Locución: después de los subtítulos, llama a generate_voiceover (inglés por defecto). Si el usuario pide otro idioma, pasa targetLang (ej. hi-IN) — los subtítulos se traducen primero, luego Edge TTS. Prefiere record_and_build({ voiceover: true, voiceoverLang }) que hace esto automáticamente.
  15. Música de fondo: usa Openverse a través del MCP (pick_background_music / record_and_build con backgroundMusic: true). Sin Pixabay / claves .env. Los efectos de destello/transparencia reproducen el SFX shimmer incluido (Shining.mp3).

Flujo A — completamente automático (abre la interfaz de Screen Beaver primero)

record_and_build ahora:

  1. focus_studio — trae Screen Beaver al frente
  2. open_record_picker — abre la misma interfaz "Iniciar nueva grabación" / opciones de compartir
  3. Abre productUrl / app
  4. start_capture — selecciona la ventana de forma nativa (Aplicación), muestra Grabando…
  5. Ejecuta demoSteps
  6. Se detiene inmediatamente + zooms/subtítulos automáticos desde la toma
  7. generate_voiceover — inglés por defecto; traduce + TTS cuando voiceoverLang está configurado
  8. pick_background_music — pista CC de Openverse (instrumental corporativa suave)
ping_studio
  → record_and_build({
      productName, productUrl, titleContains: "Edge",
      voiceover: true,
      voiceoverLang: "en-US",   // o "hi-IN" / "es-ES" etc.
      backgroundMusic: true,
      musicQuery: "instrumental corporativa alegre",
      demoSteps: [ ... ],
      introCaption: "...",
      features: [{ title: "Iniciar sesión", atSeconds: 3 }]
    })
  → Dile al usuario: haz clic en Exportar cuando esté listo

O en una toma existente: generate_voiceover({ targetLang: "en-US" }) pick_background_music({ query: "instrumental ambiental tecnológica tranquila" }) generate_voiceover({ speakLang: "en-US", targetLang: "hi-IN" })

Pasos de la demo

opsignificado
wait{ ms } — mantenlo corto; sin rellenos largos al final
move / clickprefiere { contentNx, contentNy } 0..1 en la página web; o { nx, ny } en la ventana exterior
type{ text, delayMs? } tecla por tecla (emite SFX de escritura)
scroll / focus / right_clickcomo antes

Límites

  • La captura nativa y la automatización de entrada son solo para escritorio Windows.
  • La entrada de ratón/teclado de la demo solo funciona mientras la captura está activa.
  • El diálogo de compartir del sistema operativo nunca se muestra a los agentes — Screen Beaver muestra las opciones de compartir dentro de la aplicación, luego captura la ventana de forma nativa.

Skills relacionados