Dirige los vídeos de tu producto desde tu editor
PageToVid Studio conecta tu proyecto con su sitio y con Claude Code. Planifica recorridos a partir del código, lanza series recurrentes y previsualiza cada vídeo antes de gastar un crédito.
¿Sin conexión, o en Cursor, Windsurf o VSCodium? Descarga el .vsix
Gratis · VS Code, Cursor, Windsurf y VSCodium · nunca ejecuta tu código
Una carpeta, un puesto de producción
- Conexión en un clic
Aprueba en tu navegador y la clave vuelve al editor. Nada que copiar, y se queda en el almacenamiento seguro de VS Code.
- Una carpeta, un sitio
Asocia una vez el proyecto con su sitio de PageToVid. El ajuste pertenece a la carpeta, nunca a todo tu editor.
- El pack de estudio
Escribe el .mcp.json para Claude Code sin tu clave — llega a la terminal como variable de entorno — más los comandos slash y una guía breve.
- El panel de estudio
Las cifras y los créditos de tu sitio, las horas que le quedan al acceso de la grabadora, tus series y sus episodios, el plan de captura y lo ya grabado.
- Un acceso para los screencasts
Deja que la grabadora inicie sesión en tu producto con un storage state de Playwright, una cuenta de prueba o tu sesión del navegador. Desde el plan Scale.
- Envía recursos de marca
Elige logos e imágenes de producto del repositorio y envíalos a tu biblioteca de medios, etiquetados brand.
Seis comandos slash para Claude Code
Cada render cuesta 40 créditos, y cada comando previsualiza antes de gastar. Nada se renderiza hasta que lo dices.
/pagetovid-studioRevisa todo el puesto — créditos, sitio, acceso, plan, series, feed — y te dice qué falta. Gratis./pagetovid-capture-planLee el código y escribe los recorridos que vale la pena grabar. La extensión de Chrome los graba; cada paso se convierte en una escena./pagetovid-showCrea una serie recurrente a partir de lo que publica tu repositorio y previsualiza el primer episodio antes de que lo confirmes./pagetovid-formatEscribe o revisa un formato de vídeo y previsualiza un episodio real antes de guardar una nueva versión./pagetovid-howtoConvierte tu documentación en vídeos tutoriales grabados sobre el producto, y pregunta antes de cada render./pagetovid-assetsEncuentra los logos y las imágenes de producto del repositorio y te dice cuáles enviar.
Los comandos slash necesitan la extensión de Claude Code o la CLI claude.
Se configura una vez
- 1Instala la extensión desde el Marketplace.
- 2Ejecuta «PageToVid: Connect» desde la paleta de comandos y aprueba en tu navegador.
- 3Elige el sitio al que pertenece esta carpeta.
- 4Ejecuta «PageToVid: Install studio pack», inicia claude en la terminal integrada y aprueba una vez el servidor pagetovid.
- 5¿Tu producto requiere iniciar sesión? Ejecuta «PageToVid: Connect a login for screencasts» (desde el plan Scale).
Tu código se queda en tu máquina
- Nunca captura nada ni ejecuta el código de tu espacio de trabajo. Lee el proyecto solo para escribir prompts.
- Tu clave se queda en el almacenamiento seguro de VS Code. El .mcp.json que escribe nunca la contiene.
- Un storage state se lee una vez y se envía una vez. Una contraseña de prueba se envía una vez y no se guarda en ningún sitio de tu máquina.
- El acceso de la grabadora queda ligado a un único sitio y caduca tras el tiempo que elijas: 72 horas como máximo.
Se combina con la extensión de Chrome
Escribe el plan de captura en tu editor y grábalo en Chrome. El panel marca cada recorrido como grabado en cuanto la extensión del navegador lo envía a tu biblioteca de medios.
Ver la extensión de Chrome →Vídeos tutoriales
Tres vídeos cortos hechos con el propio PageToVid: la configuración del estudio en VS Code, cómo grabar tu producto tras un inicio de sesión y una serie recurrente creada desde tu repositorio por Claude Code.
Preguntas
¿Es gratis?
La extensión es gratis. Los vídeos usan tus créditos — 40 por render — y cada comando muestra lo que va a hacer antes de gastar nada.
¿Funciona en Cursor, Windsurf o VSCodium?
Sí. Esos editores no leen el Marketplace de VS Code, así que instala el archivo .vsix. La conexión en un clic funciona en todos ellos.
¿Necesito Claude Code?
Para los comandos slash, sí: la extensión de Claude Code o la CLI claude. Sin ella, el pack escribe igualmente sus archivos y el panel sigue mostrando tu sitio.
¿Mi clave de API está en .mcp.json?
No. El archivo nombra una variable de entorno, y la extensión la define en cada terminal que abre VS Code.
¿Puede grabar mi app tras un inicio de sesión?
Sí, desde el plan Scale: da a la grabadora un storage state de Playwright, una cuenta de prueba o tu sesión del navegador mediante la extensión de Chrome. El acceso queda ligado a ese sitio y caduca en 72 horas como máximo.
Haz tu próximo vídeo sin salir del editor
Instalación gratuita. Funciona con Claude Code.