Tu editor de código se convierte en un estudio
· 3 min de lectura

Quien mejor conoce un producto suele ser quien lo construye, y pasa el día en un editor, muchas veces con Claude Code al lado. El 15 de septiembre dejamos de tratar nuestra extensión de VS Code como una pequeña ayuda para capturar. Se convirtió en PageToVid Studio: el lugar donde se preparan los vídeos de un producto, se graba tras su inicio de sesión y se mantienen al día.
Ir donde los equipos ya trabajan
Los desarrolladores casi nunca quieren otro panel más. Nuestra conexión para asistentes ya permitía a una IA crear y editar vídeos; faltaba una configuración de un minuto que se sintiera natural en un proyecto de código.
Así que Claude Code se convirtió en la herramienta de configuración. La extensión prepara el espacio de trabajo, Claude Code maneja PageToVid con sus herramientas y una persona confirma cada render antes de gastar nada. Describes el vídeo que quieres con palabras sencillas y el asistente hace los clics.
Un comando monta el estudio
Un solo comando, «Install studio pack», escribe lo que un proyecto necesita:
- un archivo de configuración que conecta Claude Code con las herramientas de PageToVid;
- comandos slash listos para montar el estudio, planificar una captura, crear un programa recurrente, trabajar un formato, escribir un tutorial y guardar recursos de marca;
- una guía breve en el repositorio que explica qué hace cada comando.
El panel muestra el estudio, los programas del sitio (lanzar, confirmar, pausar) y su plan de captura. Lee los mismos endpoints que la web y la extensión del navegador, nunca un formato propio, así que los tres siempre coinciden.
Tu clave se queda fuera de tus archivos
Un archivo de configuración en un repositorio se sube por error con facilidad, así que nos aseguramos de que no contenga nada valioso. El archivo generado nombra tu clave; la clave nunca toca el disco. La extensión la guarda en el almacenamiento secreto del editor y la pasa a sus terminales como variable de entorno, actualizada cada vez que se refresca el panel.
Una comprobación automática verifica que el archivo generado no contiene ninguna clave. Y si personalizas un comando slash, reinstalar el pack conserva tu versión en lugar de sobrescribirla.
Grabar el producto tras su inicio de sesión
Casi todo un software vive detrás de un inicio de sesión, y eso es justo lo que una demo debe enseñar. Esta versión añade las sesiones de captura: las cookies propias de un sitio, registradas una vez para su dirección y su gemela con www, guardadas de uno a tres días y luego olvidadas.
El proceso de grabación ya asociaba las sesiones por sitio, así que en cuanto existe una, cada render de ese sitio graba con la sesión iniciada, empiece desde la web, la API o un asistente. Puedes registrar una sesión desde un estado de navegador guardado, una cuenta de prueba o la extensión del navegador. El servidor solo guarda las cookies de ese sitio, nunca las devuelve y las borra si lo pides. Con un estado de navegador guardado, PageToVid nunca ve ninguna contraseña.
Tutoriales hechos con PageToVid
Un estudio necesita instrucciones, y hicimos las nuestras como harías tú las tuyas: tres animaciones cortas renderizadas en PageToVid. Una cubre la configuración en VS Code, otra la grabación de un producto tras su inicio de sesión y la última un programa recurrente creado desde un repositorio por Claude Code.
Cada una es un vídeo público normal, con su página, sus subtítulos y su barra para compartir, enlazado desde la página de la extensión en cuatro idiomas. Para el vídeo del inicio de sesión elegimos una lista sencilla de pasos en vez de una comparación lado a lado: un flujo simple se explica mejor de forma simple.
Qué cambia
Un desarrollador puede pasar ahora de un proyecto vacío a un recorrido grabado de su propia aplicación, tras su inicio de sesión, sin salir del editor, y mantener ese vídeo al día según cambie el producto. El asistente hace la configuración; la persona tiene la última palabra en cada render.
Lo siguiente: que iniciar sesión sea aún más directo, entrando en un navegador real abierto desde el editor, sin dejar nada en la máquina. Puedes instalar la extensión desde la página de la extensión de VS Code y leer cómo se conectan los asistentes en la página de asistentes.
Míralo en tu propia web
Pega una página y obtén el vídeo narrado del que habla este blog. El primero es gratis.
Sigue leyendo


