Tutoriales Agénticos
Curso · Recursos y prompts

Videos animados con Claude Code, de un prompt a un MP4

Describe el video con tus palabras; Claude lo escribe como código, lo anima con HyperFrames y te entrega un MP4. Sin editor de video y sin saber animar: preparas el taller, describes, corriges con palabras y exportas.

Portada del tutorial Videos animados con Claude Code y HyperFrames: de un prompt a un MP4
4:48de tutorial, en español
4 promptsde la idea al MP4
30 sde ejemplo real, generado con esos prompts
0 editoresde video abiertos
Antes de empezar

Lo que necesitas

Pensado para oficinistas, diseñadores, marketers, managers y developers. No necesitas saber animar, programar ni usar la terminal más allá de abrir Claude Code.

Claude Code listo

Instalado y con tu sesión iniciada. Consulta la instalación vigente en la guía oficial.

Tu computadora

HyperFrames corre en tu equipo y necesita Node.js 22 o superior y FFmpeg. Claude instala lo que falte y te pide permiso antes.

Lo que quieres contar

Un mensaje, tres o cuatro pasos y tus colores. La plantilla del kit te ayuda a ordenarlo antes de pedírselo a Claude.

Cómo funciona

Un video en tres capas

HyperFrames no inventa píxeles como un generador de video con inteligencia artificial: el video es una página web animada. Por eso todo es editable y una corrección cambia solo lo que pides.

Desliza el diagrama →

TÚ Describes mensaje · pasos · colores CLAUDE CODE + HYPERFRAMES Exportación una foto de cada instante Movimiento qué entra, cuándo y cómo Escena textos, formas e imágenes RESULTADO Tu MP4 listo para publicar

Si un número o un texto está mal, cambias ese detalle con una frase: no repites todo el video.

Paso a paso

Los prompts del tutorial

Abre Claude Code en una carpeta nueva y avanza en orden. Los cuatro pasos son probados al grabar el video: el resultado de Café Lumbre, una cafetería ficticia, salió de correr estos prompts tal cual. Cambia sus datos por los tuyos; el resultado de cada corrida puede variar.

01

Prepara el taller

probado al grabar el video
Instala HyperFrames y prepárame un proyecto de video horizontal para YouTube, de treinta segundos.

Claude instala la herramienta, crea el proyecto y te confirma que ya puede exportar. Si te pide permiso para instalar Node.js o FFmpeg, revísalo y apruébalo.

02

Describe el video

probado al grabar el video
Haz un video de treinta segundos para Café Lumbre que explique cómo pedir en línea en tres pasos: eliges, pagas y recoges sin hacer fila. Usa diagramas animados, colores café y crema, y el logo al final.

Tú pones lo que ya sabes: el mensaje, los pasos y tus colores. Claude arma primero un guion de escenas y después escribe cada escena y su movimiento.

03

Corrige con palabras

probado al grabar el video
Los nombres de los tres pasos se ven muy pequeños en un celular: hazlos el doble de grandes. Y en el cierre, centra el logo en la pantalla.

Mira la vista previa y di lo que no te convence. En el video fueron dos detalles reales del primer corte: etiquetas pequeñas para un celular y el logo alto. Claude cambia solo eso.

04

Revisa y exporta

probado al grabar el video
Revisa que ningún texto se corte ni se encime en ningún momento, y exporta el video en alta definición.

Claude revisa cada escena con las herramientas de HyperFrames, corrige lo que encuentre y te entrega el MP4.

05

Idea 1: tus cifras del mes

idea · compruébalo
Convierte mi reporte de ventas del mes en un video de cuarenta segundos con las tres cifras más importantes animadas.

Adjunta o señala tu reporte para que Claude tome las cifras reales.

06

Idea 2: anuncia tu taller

idea · compruébalo
Haz un video vertical de quince segundos que anuncie mi taller del sábado, con la fecha grande y mi logo.

Vertical sirve para Shorts, Reels y estados. Dale a Claude el archivo de tu logo.

07

Idea 3: explica un proceso

idea · compruébalo
Explica en un minuto cómo funciona nuestro proceso de entregas, con un diagrama que se arme paso a paso.

Describe los pasos de tu proceso con tus palabras; Claude los convierte en un diagrama animado.

Honestidad técnica

Qué hace y qué no

Lo que afirma el tutorial sale del repositorio y la documentación de HyperFrames y de la página oficial de Claude Motion, consultados el 22 de octubre de 2026.

Lo que sí hace

  • HyperFrames convierte composiciones HTML animadas en un MP4 con un render determinista.
  • Es un proyecto de código abierto de HeyGen (Apache 2.0), gratis, y corre en tu computadora.
  • Claude Code lo usa con sus skills: crea el proyecto, escribe las escenas, revisa y exporta.
  • Cada elemento es una línea editable: corregir un detalle no rehace el resto.

Límites que debes conocer

  • No genera imágenes ni video realista: anima textos, formas, gráficas e imágenes que ya tengas.
  • Cada corrida de Claude puede dar un resultado distinto; corrige con palabras lo que no te guste.
  • Claude Motion, de Anthropic, está en beta en los planes Team y Enterprise; este tutorial usa HyperFrames.
  • La música de fondo no viene incluida: si la agregas, que tenga licencia de uso comercial.
Materiales

Descargas

Sin registro. El kit trae los prompts, la plantilla para describir tu video y el proyecto real de Café Lumbre.

El video

Capítulos

Documentación oficial

Fuentes

Consultadas el 22 de octubre de 2026. Revisa la versión vigente antes de seguir el tutorial.

Dudas comunes

Preguntas frecuentes

¿Necesito saber animar o programar para hacer videos animados con Claude Code?

No. Describes el video con tu mensaje, tus pasos y tus colores; Claude escribe las escenas y el movimiento. Tú revisas la vista previa y corriges con palabras.

¿Qué es HyperFrames y cuánto cuesta?

Es un proyecto de código abierto de HeyGen (licencia Apache 2.0) que convierte composiciones HTML animadas en un MP4. Es gratis y corre en tu computadora con Node.js 22 o superior y FFmpeg.

¿En qué se distingue de un generador de video con inteligencia artificial?

Un generador inventa píxeles. Aquí el video es código: cada texto, flecha o número es una línea que se puede tocar, así que una corrección cambia solo ese detalle.

¿Y Claude Motion?

Es la versión de Anthropic de esta idea, en beta para los planes Team y Enterprise. En Claude Code puedes lograr lo mismo con HyperFrames.

Tutoriales Agénticos

Más tutoriales de Claude Code

Todos los tutoriales del canal, con sus prompts y recursos, en un solo lugar: tutorialesagenticos.ingenieria.dev.

Prompt copiado