Editing Master

¿Qué hace Editing Master?

Convierte un producto en un vídeo corto y animado. El usuario da una línea ("cómo usarlo, 2 minutos") y lo que tenga sobre el producto; tú preguntas, ellos eligen, tú construyes, ellos aprueban, tú renderizas.

Desde dónde puede empezar el usuario (cualquiera es suficiente; más es mejor):

Fuente	Cómo la usas
Un código base (la carpeta actual o una ruta)	Lee la fuente de la interfaz y reconstruye las pantallas reales.
Un enlace a la app o sitio web en vivo	npx hyperframes capture <url> --json para capturas de pantalla, colores, fuentes y texto; reconstruye las pantallas a partir de ellas. Pide un inicio de sesión de prueba si las páginas están detrás de un inicio de sesión; nunca uses credenciales reales.
Capturas de pantalla o una grabación de pantalla	Reconstruye cada pantalla a partir de las imágenes; usa clips de la grabación como metraje de apoyo (B-roll) dentro de un dispositivo enmarcado.
Solo una descripción	Diseña pantallas limpias y verosímiles en los colores de la marca a partir de la descripción, y dímelo en el guion.

Herramientas. Por defecto, construye con los skills de HyperFrames (hyperframes, hyperframes-cli, hyperframes-registry) y usa media-use para voz, música y efectos de sonido. Si faltan, dile al usuario los comandos de instalación (consulta el README) y detente. Di en una línea qué skills usarás antes de empezar.

Starter. starter/ es un proyecto HyperFrames funcional con los componentes básicos a continuación (pantallas de una palabra, tarjeta de capítulo, enfoque de cámara con clic de cursor, transiciones, outro). Cópialo en una nueva carpeta video/ y adáptalo; no empieces desde una página en blanco.

Motor. Todo lo que construye este skill (pantallas de una palabra, tarjetas de gancho y capítulo, cámara, cursor, starter) es HyperFrames, y HyperFrames es el valor predeterminado. Otros skills de vídeo ofrecen otros tipos de vídeo (cámara de una sola toma, collage de papel, acuarela, dibujos animados en 2D, explicadores de pizarra narrados, animación matemática, gráficos en movimiento con React, montajes de metraje de archivo, animaciones de app, cortos extraídos de grabaciones largas); cada uno tiene su propio flujo de trabajo. Consulta references/video-skills.md y el paso 2.

La regla de oro: nada sin el usuario

Cualquier cosa que se escuche o vea en el vídeo (voz, música, efectos de sonido, guion, aspecto) se muestra o reproduce al usuario antes de que la película sea final, y nada se renderiza sin que el usuario apruebe la vista previa. La frecuencia con la que te detienes a preguntar depende del modo que elija el usuario: rápido o paso a paso.

Dos modos: rápido o paso a paso

El trabajo de máquina es rápido (≈ 1 min para poner voz a un guion de 2 minutos, ≈ 1 min para encontrar música, ≈ 3 min para renderizar una película de 2 minutos). Lo que hace lento un vídeo es el número de veces que el usuario tiene que detenerse y responder. En tu primer mensaje, ofrece los dos modos y recomienda el rápido:

	Rápido (recomendado)	Paso a paso
Paradas antes del renderizado	3, luego "renderizar"	alrededor de 11, una por paso
Preguntas	todas en un mensaje, cada una con un valor predeterminado	un paso a la vez
Muestras	voz, música, mezcla y efectos en un solo paquete de escucha	voz, música, efectos en rondas separadas
Mejor para	la mayoría de los vídeos, usuarios que confían en los valores predeterminados	usuarios que quieren dirigir cada detalle

El usuario puede cambiar en cualquier momento ("más despacio", "más rápido").

Rápido: tres paradas, luego renderizar

Los pasos 1–11 a continuación siguen diciendo cómo hacer cada pieza; el modo rápido los agrupa en tres paradas y hace el trabajo de máquina entre ellas sin preguntar.

Parada 1 · El plan (un mensaje, pasos 1–3). Haz las preguntas breves (paso 1), muestra el menú de skills de vídeo con tu recomendación (paso 2), y haz las preguntas de estilo con tu respuesta recomendada para cada una (paso 3, incluidos sonidos de palabras, transiciones y subtítulos). Termina con: "Responde qué quieres cambiar, o di usa tus selecciones." Una respuesta lo resuelve todo. Repite el plan final en unas pocas líneas, con el tiempo total hasta la vista previa, y continúa sin otra parada.

Entre las paradas 1 y 2, sin preguntar: estudia el producto (paso 7), escribe el guion (paso 8) y prepara el paquete de escucha: la línea de gancho en 3 voces, muestras de 15–20 s de 3 pistas musicales, una mezcla de voz + música en el nivel planificado usando tu voz y pista recomendadas, el reel de efectos de sonido, y una demo de 5–10 s de una pantalla de una palabra con voz palabra por palabra y sus sonidos de palabra (pasos 4–6). Di cuánto tiempo lleva esto antes de empezar (generalmente unos minutos), y ejecuta el trabajo de voz y música en paralelo con el estudio.

Parada 2 · Guion, pantallas y sonidos (un mensaje). Envía la tabla del guion, la lista de pasos que muestra el vídeo con una pantalla reconstruida (una instantánea), y el paquete de escucha, con tu voz, pista y efectos recomendados marcados. Pide una respuesta: "Aprobá el guion y las pantallas, y elegí una voz, una pista y los efectos (o decí usa tus selecciones)."

Entre las paradas 2 y 3, sin preguntar: pon voz al guion aprobado, transcríbelo, construye la vista previa (paso 9) y revísala.

Parada 3 · Vista previa. Envía el enlace de la vista previa con marcas de tiempo. La narración completa, la música y los efectos se escuchan aquí por primera vez juntos. Aplica cambios y envíala de nuevo hasta que el usuario la apruebe. Las rondas de vista previa no se cuentan como paradas adicionales.

Renderiza solo cuando el usuario diga "renderizar" (paso 10), luego entrega el control (paso 11).

Si el usuario dice "hazlo no más" en modo rápido, usa tus selecciones recomendadas en las paradas 1 y 2, pero sigue enviando el guion, las pantallas y el paquete de escucha para que puedan escuchar, y continúa construyendo la vista previa sin esperar. La parada 3 nunca se omite: no hay render sin una vista previa aprobada.

Paso a paso

Recorre los pasos 1–11 uno a la vez. Cada paso: di cuánto tiempo llevará, hazlo, muestra el resultado, pregunta "¿OK para continuar?", espera. Nunca encadenes dos pasos sin la autorización del usuario; si el usuario dice "hazlo no más", ofrécete a cambiar al modo rápido en su lugar.

En ambos modos

Empieza diciendo al usuario las paradas y los tiempos aproximados (consulta "Presupuesto de tiempo"). Antes de cualquier espera de más de unos segundos, di cuánto tiempo llevará. Usa los tiempos medidos en "Presupuesto de tiempo"; cuando no haya un número medido, dímelo ("varios minutos en una CPU") en lugar de inventar uno.

Los pasos

1 · ¿Qué vídeo quieres? (pregunta siempre primero)

Incluso si el usuario solo dijo "haz un vídeo", pregunta, con ejemplos y una recomendación (en modo rápido, en el mismo mensaje que los pasos 2 y 3, junto con la pregunta del modo):

• ¿Para qué es? (cómo usarlo, qué hace, un teaser de lanzamiento, un recorrido de funciones, un anuncio…)
• ¿Quién lo ve? (nuevos usuarios, clientes, inversores, un equipo…)
• Duración y formato: 30 s / 60 s / 2 min; 16:9 o 9:16 vertical.
• El único mensaje que deben recordar.
• ¿Qué tienes sobre el producto: un código base, un enlace, capturas de pantalla, una grabación, o solo una descripción? (Omisión si es obvio, por ejemplo, si estás en su repositorio.)

Paso a paso: repite la información breve en tres líneas y espera a que diga "sí".

2 · ¿Qué skill de vídeo? (recomienda uno, luego pregunta)

Lee references/video-skills.md, luego muestra al usuario su menú como una tabla: el nombre de cada skill, cómo se ve el vídeo, para qué es mejor, cuánto tiempo lleva y cuánto cuesta, en palabras que alguien nuevo entienda. Agrúpalo como "construir un vídeo desde cero" (HyperFrames, onetake, Collage B-roll, Clawd Animation, Lemo Opuscar, explainroo, skills de iart explainer, Manim, Remotion, Animate, Guizang product video, OpenMontage, Lottie) y "editar un vídeo que ya tienes" (Clipify, Cut Video).

Luego recomienda uno para este proyecto de la tabla "¿Cuál para qué proyecto?", en una o dos líneas: por qué se ajusta a la información, su coste y licencia, su tiempo. Nombra un segundo cercano si lo hay. Señala las licencias que importan para vídeos de empresa (onetake, Remotion, skills AGPL) y cualquier cosa que necesite una clave de pago, una GPU o macOS.

Di que los componentes básicos de este skill y el starter son HyperFrames; con otro motor, sigue el flujo de trabajo de ese skill y mantén el modo y las reglas de este skill (rápido o paso a paso, deja que el usuario escuche todo, vista previa antes de renderizar). Si el skill elegido no está instalado, da su comando de instalación y espera.

3 · Preguntas de estilo (un mensaje, opciones + recomendación para cada una)

1. Presentador: ninguno, el logotipo pulsando con la voz en un marco de esquinas redondeadas (gratuito), o un avatar parlante (de pago).
2. ¿Sonidos de cursor y clic en cada acción? (recomiendo sí)
3. Cámara: zooms suaves / medios / fuertes (recomiendo medio).
4. Texto cinético: ¿pantallas de una palabra para el gancho, tarjetas de capítulo, una tarjeta de gancho "esta es la parte más fácil"? ¿En qué momentos? (Muestra ejemplos de docs/img o descríbelos).
5. Sonidos en pantallas de una palabra y transiciones: ¿un sonido corto en cada palabra al aterrizar (pop, golpe, tic, chasquido, un boom en la palabra clave, un crescendo hacia una revelación, o ninguno)? ¿El mismo sonido en cada palabra, o uno diferente en la palabra clave? ¿Un sonido en cada transición (swoosh, whoosh, impacto)? Recomiendo, por ejemplo, "pop en cada palabra, golpe en la palabra clave, swoosh en los wipe de capítulo". La voz dice cada palabra de la pantalla de una palabra por sí misma, acentuada, en el tono de la pantalla. Consulta references/music-sfx-subtitles.md.
6. Subtítulos: ninguno, quemados en el vídeo, o archivos de subtítulos separados? ¿Luego qué idiomas?
   • Quemados: siempre visibles, en todas las plataformas y con el sonido apagado (feeds sociales, anuncios), pero solo un idioma y un cambio significa un nuevo renderizado.
   • Archivos separados: .srt (reproductores, YouTube, LinkedIn) y/o .vtt (reproductores web), uno por idioma, editables a mano, los espectadores los activan y desactivan; una plataforma o reproductor que los ignore no muestra ninguno.
   • Recomiendo quemados para clips sociales cortos que se reproducen automáticamente en silencio, archivos separados para tutoriales y cualquier cosa en varios idiomas. Ambos está bien (quemar el idioma principal, enviar archivos para todos).
7. Marca: lee colores, logotipo y fuentes de la fuente; solo pregunta lo que falta y muestra la paleta que usarás.

4 · Voz: escucha, luego elige

Di primero el tiempo: las voces gratuitas de Kokoro toman ≈ 5 s por línea (principalmente cargando el modelo) y ≈ 1 min para todo un guion de 2 minutos; las voces de pago son rápidas pero necesitan una cuenta y una clave API.

1. Ofrece las herramientas: gratuitas en esta máquina (Kokoro, npx hyperframes tts, sin cuenta) o de pago (HeyGen, ElevenLabs: di qué necesita cada una y cuánto cuesta).
2. Pon voz a la misma línea de gancho en 3 voces (por ejemplo, hombre estadounidense enérgico, mujer estadounidense cálida, hombre británico tranquilo) y envía los archivos para que el usuario pueda escuchar.
3. Espera la elección. Ofrece más muestras u otra velocidad si ninguna se ajusta.

5 · Música: escucha, luego elige

Di primero el tiempo: una pista CC gratuita toma ≈ 1 min para encontrar y descargar, más unos segundos por corte de muestra; generar música localmente (MusicGen) es gratuito pero lento en una CPU, varios minutos por clip; un catálogo de pago (música de HeyGen) es instantáneo pero necesita una cuenta.

1. Encuentra 3 pistas candidatas que se ajusten al estado de ánimo (pistas CC gratuitas primero; di la licencia y si se necesita una línea de crédito).
2. Corta una muestra de 15–20 s de cada una de la parte que usarías, y envíalas.
3. Espera la elección (o "sin música"). Luego di el nivel que usarás (≈ 16 % por debajo de la voz) y envía una mezcla de 15 s de voz + música para que se pueda escuchar el equilibrio.

6 · Efectos de sonido: escucha, luego confirma

Envía los sonidos de clic, pop, whoosh y tecleo que planeas usar (un archivo corto cada uno, o un archivo con todos ellos en secuencia), más los sonidos de palabra y transición elegidos en el paso 3. Luego envía una demo de 5–10 s de una pantalla de una palabra: cada palabra con voz por sí misma con su sonido en su tiempo de palabra, para que se escuchen voz y sonidos juntos. Pregunta: mantener, cambiar (por palabra si quieren), o sin efectos.

7 · Estudia el producto

A partir de lo que el usuario te haya dado, enumera las 5–8 cosas que un usuario realmente hace, en orden:

• Código base: lee el README, la fuente de la interfaz (marcado, tokens CSS, texto, iconos) y los activos de la marca; reconstruye la interfaz real a partir de su fuente.
• Enlace: captura las páginas que importan (npx hyperframes capture <url> --json), recorre el flujo principal en un navegador si es necesario, y reconstruye las pantallas a partir de las capturas (mismas etiquetas, colores, radios, espaciado). No grabes la pantalla de un sitio en vivo para la película a menos que el usuario lo pida.
• Capturas de pantalla / grabación: reconstruye cada pantalla a partir de las imágenes; mantén clips de la grabación para metraje de apoyo (B-roll) en un marco de dispositivo.
• Solo descripción: diseña las pantallas a partir de la descripción y la marca; mantenlas simples y márcalas como ilustrativas en el guion.

Nunca inventes funciones que el producto no tenga. Los nombres desconocidos o privados se vuelven neutros ("Modelo A, B, C"); los secretos de muestra son obviamente falsos y se dividen en la fuente (ghp_<i></i>…). Si el aspecto no está claro, pide una captura de pantalla en lugar de adivinar.

Muestra al usuario la lista de pasos que mostrarás en el vídeo, y una pantalla reconstruida (una instantánea), y pregunta: "¿Así es como se ve, y estos son los pasos correctos?" Espera.

8 · Guion (espera a que esté "aprobado")

Una tabla de escenas: tiempo · en pantalla · voz en off · efecto (pantalla de una palabra, zoom, tarjeta de gancho…) · sonido (por palabra en pantallas de una palabra, por transición). Escribe líneas de una palabra con puntos entre las palabras ("Pega. Enmascara. Envía.") para que la voz acentúe cada palabra. Reglas en references/kinetic-type-and-hooks.md (gancho en 5 s, una idea por escena, 15–20 palabras por escena, cada oración mostrada en pantalla, un reinicio de atención cada 20–30 s). Envíalo y espera a que esté "aprobado"; cámbialo tantas veces como te pidan. Pon voz a las líneas solo después de la aprobación (≈ 1 min para un guion de 2 minutos con Kokoro; dímelo), luego envía la narración completa para escuchar y preguntar antes de construir sobre ella.

9 · Construye la vista previa

• Voz: un archivo por línea; transcribe la narración completa (npx hyperframes transcribe, ≈ 20 s para una película de 4 minutos) para los tiempos de las palabras. Cada acción aterriza en su palabra (tiempo de palabra + 0.2 s).
• Subtítulos según lo elegido en el paso 3: subtítulos quemados como una capa de HyperFrames (visibles en la vista previa), o archivos SRT/VTT a partir de la transcripción. Consulta references/music-sfx-subtitles.md.
• Cámara, transiciones, cursor: references/transitions-and-camera.md.
• Ritmo y tiempo de lectura: references/pacing-and-voice.md.
• Música, efectos, subtítulos, portada: references/music-sfx-subtitles.md.
• Verifica: npx hyperframes check, luego npx hyperframes snapshot --at … en cada paso y corte; mira los fotogramas y corrige superposiciones.

… [truncado para la traducción]