Cómo animar carruseles de Instagram con Claude y HyperFrames (4 estilos + prompts)

Este carrusel se mueve, lleva efectos de sonido sincronizados y no lo animé yo: lo hizo Claude. Sin tocar ni un keyframe, con Claude Code + HyperFrames, una herramienta gratuita de HeyGen que convierte código en vídeo.

Aquí tienes cómo instalarlo, los 4 estilos que viste y los prompts para hacer el tuyo.

Qué es HyperFrames

HyperFrames es un framework de código abierto (licencia Apache-2.0) creado por HeyGen. Su idea: un vídeo es una página HTML con animaciones, y HyperFrames la convierte en un MP4 fotograma a fotograma.

¿Por qué encaja tan bien con Claude? Porque Claude ya sabe escribir HTML. Con las skills de HyperFrames aprende el resto: cómo cronometrar cada escena, animar, añadir sonido, revisar que nada se salga del encuadre y renderizar.

Cómo instalarlo

Necesitas Claude Code, Node.js 22 o superior y FFmpeg. Si te falta algo, pídeselo a Claude y te lo instala.

Opción 1 · Como plugin de Claude Code (lo recomienda HeyGen):

claude plugin marketplace add heygen-com/hyperframes
claude plugin install hyperframes@hyperframes

Después lo usas escribiendo /hyperframes:hyperframes en Claude Code.

Opción 2 · Solo las skills, desde la terminal o pidiéndoselo a Claude:

npx hyperframes skills update

Los 4 estilos (y cuándo usar cada uno)

Los prompts

Empieza con el prompt general y después pide el estilo que quieras. Cambia lo que va entre corchetes.

Con HyperFrames, anima un carrusel de Instagram de [7] diapositivas en formato 4:5 (1080×1350).

Tema: [de qué va el carrusel].
Colores: [tus colores en hex]. Tipografía: [tu fuente o "elige una que pegue con el estilo"].
Estilo: [interfaz / cinética / sketch / collage].

Cada diapositiva dura unos 6-8 segundos y termina con "Desliza →" (menos la última, que es la llamada a la acción).
Sin música: solo efectos de sonido sincronizados con cada animación (pops, whooshes, tecleo, lápiz, papel).

Cuando esté, revisa que nada se salga del encuadre, renderiza un solo MP4 y córtalo en un clip por diapositiva con FFmpeg.

Estilo interfaz: una ventana de app en modo oscuro con mis colores de acento. El texto se escribe solo como si alguien tecleara, se abre un desplegable, se activan interruptores y un cursor hace clic. Efectos de sonido: tecleo, clics y toggles.

Estilo tipografía cinética: fondo liso, la tipografía es la protagonista. Las palabras entran con fuerza, alguna se tacha o se rodea con un trazo a mano, y las transiciones llevan desenfoque de movimiento. Efectos de sonido: whooshes y golpes secos en cada palabra clave.

Estilo sketch: fondo de papel, dibujos a lápiz que se van trazando solos, flechas y estrellas a mano, subrayados con rotulador de mi color de acento y notas pegadas como cintas. Efectos de sonido: lápiz, rotulador y papel.

Estilo collage: recortes de fotos en blanco y negro sobre papel rasgado, un círculo de mi color de acento detrás del protagonista y titulares hechos con letras recortadas tipo nota de rescate. Los objetos entran uno a uno como si los pegaran. Efectos de sonido: papel, tijeras y pegatinas.

Revisar, renderizar y subir

1. Vista previa: Claude la abre en el navegador. Pide cambios con tus palabras: "más lento", "el texto más grande", "cambia el efecto de sonido de la diapositiva 3".
2. Render: cuando te guste, Claude ejecuta npx hyperframes render y genera el MP4.
3. Corte: pídele que lo corte en un clip por diapositiva con FFmpeg, usando los tiempos de cada una.
4. Instagram: sube los clips en orden como un carrusel normal.

Créditos

HyperFrames es un proyecto de HeyGen, publicado con licencia Apache-2.0. Tienes la documentación en hyperframes.heygen.com y todo el código en GitHub.