Claude Code + Remotion: que la IA te haga todas las animaciones de tus vídeos

Las animaciones de mis vídeos no las hago yo. Le paso el guion a Claude Code y él decide qué tiene que salir en cada frase, lo programa con Remotion y me devuelve cada animación como un vídeo con el fondo transparente. Yo solo las arrastro a CapCut, encima de mi grabación.

Las ocho animaciones del vídeo en el que lo cuento están hechas así. Esta es la guía para que lo montes tú, y al final tienes la skill que uso, para copiar y pegar.

Qué es Remotion y por qué encaja tan bien con Claude

Remotion es una herramienta para hacer vídeos con código. En vez de mover fotogramas clave en una línea de tiempo, cada animación es un componente de React: "este texto entra en el frame 8, esta barra se llena entre el 20 y el 40". Luego Remotion lo renderiza a un vídeo de verdad.

Eso a una persona le cuesta. A Claude, no: escribir código es justo lo que mejor hace. Y como el resultado es código, si algo no te gusta se lo dices ("más lento", "el número más grande") y lo cambia al momento, sin rehacer nada a mano.

Lo que cuesta: Remotion es gratis para una persona sola y para equipos de hasta 3, también si vendes lo que haces con él. A partir de 4 personas necesitas su licencia de empresa. Lo explican en su página de licencia.

Lo que necesitas

• Claude Code instalado y funcionando.
• Node.js en su versión LTS. Compruébalo con node --version.
• Un editor que lea vídeo con transparencia. CapCut de escritorio, Premiere, DaVinci Resolve o Final Cut lo leen sin problema.

Paso 1 · Crea el proyecto de Remotion

Abre una terminal en la carpeta donde quieras guardarlo y lanza esto:

npx create-video@latest --yes --blank --no-tailwind mis-animaciones
cd mis-animaciones
npm i

Crea un proyecto en blanco llamado mis-animaciones. Hazlo en una carpeta que no sea un repositorio de Git: con --yes, el comando se niega a crearse dentro de uno.

Si prefieres que te lo pregunte todo, lanza solo npx create-video@latest y elige la plantilla en blanco.

Paso 2 · La skill oficial de Remotion

Remotion tiene sus propias skills para agentes como Claude Code: le enseñan cómo se escribe bien un proyecto de Remotion (animaciones, tiempos, tipografías, render). Desde dentro de la carpeta del proyecto:

npx skills add remotion-dev/skills

Con eso Claude ya sabe usar Remotion. Lo que todavía no sabe es qué animar, y eso es lo que resuelve el paso siguiente.

Paso 3 · La skill del método (la mía, para copiar)

La skill oficial le enseña a programar animaciones. Esta le enseña a decidir qué animación va en cada frase, que es donde está la diferencia entre un vídeo que se ve caro y uno que parece una presentación.

Crea el fichero .claude/skills/animaciones-para-reels/SKILL.md dentro del proyecto y pega esto:

---
name: animaciones-para-reels
description: Úsala cuando te pase un guion de vídeo corto (TikTok, Reels, Shorts) y te pida las animaciones. Convierte cada frase en un clip de Remotion listo para arrastrar a CapCut.
---

# Animaciones para reels

Convierte un guion en clips de vídeo con fondo transparente, uno por idea.

## Formato (no se negocia)

- 1080x1920, 30 fps.
- Cada clip entra con un barrido que arranca en el frame 0 y dura 8 frames,
  y sale con el barrido inverso en los últimos 7.
- html, body y #root con fondo transparente. Nada opaco detrás.
- Se renderiza en ProRes 4444 con canal alfa:
  npx remotion render ID out/ID.mov --codec=prores --prores-profile=4444 --image-format=png --pixel-format=yuva444p10le

## Antes de programar: el contrato de cada plano

Para cada frase del guion, escribe cuatro cosas:

- Frase: la línea del guion.
- Afirmación: qué sostiene, con tus palabras.
- Aporte: qué ve el espectador que NO oye.
- Forma: por qué esa forma visual y no un rótulo.

Si el Aporte dice lo mismo que la Frase, ese plano todavía no existe: el
espectador ya lo está oyendo. Poner en pantalla la frase que se narra no aporta.

## Reglas

- Convierte el adjetivo en cantidad y la comparación en escala compartida.
  "Muchísimo" no se ve; un hueco vacío sí. "Más potente" no se ve; dos cosas
  medidas con la misma regla sí.
- Mínimo 2,5 s por línea de texto, y medio segundo más por cada 10 caracteres.
  Todo clip acaba con 1,2 s quieto antes de salir.
- Una pieza nueva cada 2-3 segundos: que nada se quede parado más de 4.
- Nada de logos en los 3 primeros segundos del vídeo: parecen un anuncio.
- Dos tipos de clip: overlay (transparente, va encima del metraje) y plano
  entero (fondo opaco, sustituye al metraje). Di cuál es cada uno al entregar.

## Al terminar

- Comprueba que cada .mov tiene alfa de verdad:
  ffmpeg -v error -i out/ID.mov -vf "select=eq(n\,20),alphaextract" -frames:v 1 -y alfa.png
  Si falla, el clip no tiene transparencia y no sirve.
- Mira un fotograma de cada clip compuesto sobre gris antes de darlo por bueno.
- Entrega una tabla con cada clip: duración, tipo y la frase del guion que ilustra.

Cierra Claude Code y vuelve a abrirlo dentro de la carpeta del proyecto, para que cargue las dos skills.

Paso 4 · Pégale tu guion

Abre claude en la carpeta del proyecto y pégale el guion entero con una línea delante:

usa la skill de Remotion y la de animaciones-para-reels para animar este guion:

[pega aquí tu guion]

Claude va a trocear el guion, escribir el contrato de cada plano y crear un componente por animación. Si quieres ver cómo van quedando antes de renderizar nada, lanza npm run dev: se abre el Remotion Studio en el navegador y las ves moverse.

Lo que no te guste, se lo dices con palabras normales: "el C3 va muy rápido, que dure un segundo más", "el número del C5 más grande". Lo cambia en el código y listo.

Paso 5 · Renderiza con fondo transparente

Esta es la parte que más falla, así que merece su propio paso. Para que el vídeo salga con transparencia hacen falta estos cuatro ajustes a la vez:

npx remotion render ID out/ID.mov --codec=prores --prores-profile=4444 --image-format=png --pixel-format=yuva444p10le

Cambia ID por el nombre de cada animación (Claude te dice cuáles son). Si quitas cualquiera de los cuatro ajustes, el clip sale con fondo negro. Lo normal es pedirle a Claude que las renderice todas de una vez.

Paso 6 · A CapCut

Arrastra cada .mov a una pista por encima de tu vídeo, en el momento en que dices esa frase. Como el fondo es transparente, se ve tu grabación por detrás y la animación encima. No hay que quitar fondos ni convertir nada.

Si un clip es de "plano entero", va en la misma pista pero tapa tu grabación en ese tramo: es para las frases que no tienen nada que grabar.

Los fallos más comunes

"El clip sale con fondo negro en CapCut." Se renderizó sin alguno de los cuatro ajustes del paso 5, casi siempre porque salió en JPEG, que no tiene transparencia. Vuelve a renderizar con la línea completa.

"Claude no usa la skill." Comprueba que el fichero se llama exactamente SKILL.md y está en .claude/skills/animaciones-para-reels/, y reinicia Claude Code. En Windows el explorador esconde las extensiones y es fácil acabar con SKILL.md.txt.

"El texto va tan rápido que no se lee." Pídele que respete la regla de 2,5 segundos por línea. Si tienes que ralentizar un clip en el editor, el clip está mal hecho, no tu vista.

"Las animaciones son bonitas pero no dicen nada." Pídele que te enseñe el contrato de cada plano antes de programar. Si el "aporte" repite lo que dices en voz alta, ese plano sobra o hay que pensarlo otra vez.

"Quiero que suenen." Pídele que meta efectos de sonido sincronizados con cada movimiento. Los de kenney.nl son de dominio público y se pueden usar gratis, también en vídeos con los que ganas dinero.

En resumen

Un proyecto de Remotion, dos skills (la oficial y la del método), tu guion pegado y un comando de render. Claude programa las animaciones, Remotion las convierte en vídeos con fondo transparente, y tú las arrastras encima de tu grabación.

No sustituye a tener buen gusto: sigue siendo tu vídeo y tu guion. Pero te quita las horas de mover fotogramas clave.