Lo que necesitás
Claude Code
Con un plan Pro o Max, en la app de escritorio o en la terminal.
Node.js y ffmpeg
Si no los tenés, pedile a Claude que los instale.
Tu producto
Lo ideal es la carpeta con el código. Si no, sirve el link de tu web y capturas de las pantallas.
Paso a paso
- 1
Instalá HyperFrames
Es un framework gratis y de código abierto (lo hizo HeyGen) que convierte HTML en video. Corré esto en la terminal, elegí las skills del grupo Core y reiniciá Claude Code para que las cargue.
$ npx skills add heygen-com/hyperframes - 2
Abrí Claude Code en la carpeta de tu producto
Elegí el modelo Opus 5.5 y poné el esfuerzo en máximo. Sonnet 5.5 también funciona y gasta menos.
- 3
Pegá el prompt
Está abajo. Claude va a leer tu producto, armar un brief, hacer el video, revisarlo y entregarte el MP4. Puede tardar un buen rato: dejalo trabajar.
- 4
Corregí con el segundo exacto
Si algo no te gusta, decíselo así: en el 0:08 el texto entra muy lento, o la escena del 0:12 tiene mucho texto. Con dos o tres rondas queda.
El prompt
Cambiá lo que está entre corchetes por lo de tu producto.
Quiero que hagás un video de motion design de lanzamiento para [NOMBRE DEL PRODUCTO]. Tiene que mostrar lo mejor que podés hacer. Hacelo como si fuera tu showreel de motion designer para una hoja de vida. Go all out. ## 1. Marca y producto (sacalo del código o de la web, no lo inventes) Antes de diseñar, revisá [la carpeta del proyecto o el link de la web] y armá un brief.md con esto: - La paleta exacta en hex, las tipografías, el logo y el ícono. - La propuesta de valor en una frase y las 3 o 4 funcionalidades que hoy funcionan de verdad. - Las 3 o 4 pantallas más vistosas. Recrealas en HTML y CSS fieles a las reales: mismos colores, radios, íconos y jerarquía. - Un storyboard escena por escena con los segundos. Los datos de ejemplo tienen que ser inventados y verosímiles. No uses datos reales de clientes. ## 2. Herramienta Usá HyperFrames (HTML y GSAP con render determinista a MP4). Arrancá por la skill /hyperframes y seguí su flujo (init, preview, render). El video va en una carpeta nueva al lado del código. No toques el código del producto. ## 3. Formato - [1920x1080 horizontal o 1080x1920 vertical], 60 fps, entre 15 y 30 segundos. - Nada importante pegado a los bordes: dejá un margen del 5 % en todos los lados. - Textos cortos que se entiendan sin sonido. - El último frame empalma con el primero para que el loop no se note. ## 4. Dirección - Estructura: un gancho visual fuerte desde el frame 0, el problema en una línea, una funcionalidad por escena con la UI animándose como si alguien la estuviera usando, y un cierre con el logo y una frase que salga de la propuesta de valor. - Algo cambia cada 1.5 a 3 segundos. Los cortes y los acentos caen en los beats de la música. - Nivel profesional: easings con intención (nada lineal), overshoot sutil, transiciones match-cut donde un elemento de una escena se convierte en el de la siguiente, cámara con profundidad, tipografía cinética con la fuente de la marca, números que cuentan y gráficas que se dibujan. - Que no parezca hecho con IA: nada de gradientes morados genéricos, glows, partículas sin motivo, emojis, texto pequeño ni más de una idea por pantalla. Solo la paleta de la marca. ## 5. Audio Usá la canción que está en [ruta de la canción]. Medí el BPM y los beats y armá todo el timing sobre eso. Poné efectos de sonido puntuales (whoosh, pop, click) en los acentos, sin saturar. Mezcla final a -14 LUFS. Si no hay canción, armá el timing a 120 BPM y entregá el video sin música. ## 6. Revisión antes de entregar Renderizá un preview y sacá un fotograma por segundo en una hoja de contacto. Miralos de verdad: textos cortados, saltos raros, escenas vacías, cosas pegadas al borde. Corregí y repetí al menos dos rondas antes del render final. ## 7. Entrega El MP4 final en H.264, una versión sin música y una portada en JPG. Al final contame qué hiciste en cada escena y cuántas rondas de corrección hiciste.
Tres cosas que hacen la diferencia
Lo de un solo prompt es verdad a medias
Lo que más sube la calidad es que Claude tenga el código o los assets reales de tu marca. Con un prompt genérico el video queda bonito pero con cara de IA.
La música, con derechos
Si lo vas a subir a Instagram y la canción no es tuya, subí la versión sin música y elegí la canción desde la app.
No es un generador como Sora o Veo
Claude no inventa imágenes: dibuja con código. Sirve para interfaces, tipografía, datos y logos. Para tomas reales necesitás otra herramienta.
Si hacés el tuyo, mandámelo.
Quiero verlo. Y si querés que tu empresa use la IA así de en serio, en Divine Machinery construimos software a la medida con IA.