¿Y si pudieras editar video escribiendo instrucciones, como le hablas a un asistente? Eso es lo que permite Remotion combinado con un agente de IA como Claude Code, Codex o Antigravity: tú describes lo que imaginas, el agente escribe el código y Remotion lo convierte en un video MP4.
El video de abajo se hizo exactamente así, sin abrir un editor de video tradicional. En esta guía te explico el paso a paso para que lo repitas con tu propio contenido.
Qué es Remotion
Remotion es un framework que permite crear videos con código React. En vez de arrastrar clips en una línea de tiempo, cada escena es un componente: lo que se ve en cada instante depende del número de fotograma actual. Eso tiene una ventaja enorme: como todo es código, un agente de IA puede escribirlo, corregirlo y modificarlo por ti.
Qué necesitas
- Node.js instalado en tu computador.
- Una terminal (la de macOS, Windows o la integrada de tu editor).
- Un agente de IA con acceso a tu carpeta de proyecto: Claude Code, Codex o Antigravity.
Paso 1: crea el proyecto
En la terminal, ejecuta:
npx create-video@latest
El asistente te deja una plantilla lista para usar. Entra a la carpeta del proyecto cuando termine.
Paso 2: enséñale Remotion a tu agente
Remotion publica skills oficiales: instrucciones con las buenas prácticas para que el agente trabaje bien en proyectos de Remotion (crear composiciones, animar, agregar subtítulos, renderizar, etc.). Se instalan con:
npx skills add remotion-dev/skills
Según la documentación de Remotion, están pensadas para agentes como Claude Code, Codex y Cursor. Si usas otro, igual puedes pedirle que lea la documentación en remotion.dev/docs.
Paso 3: abre el agente y pídele lo que imaginas
Abre tu agente dentro de la carpeta del proyecto y escribe tu primera instrucción. Por ejemplo:
Crea una intro de 5 segundos con el título “Mi negocio”, fondo animado en azul y magenta, y una transición suave a la siguiente escena.
Para ver el resultado en vivo, abre el Studio de Remotion:
npx remotion studio
Ahí puedes reproducir el video, moverte por la línea de tiempo y ver cada cambio apenas el agente guarda el código. Pide ajustes en lenguaje normal: “más rápido”, “el texto más grande”, “cambia el color de fondo”.
Lo que puedes pedirle a tu agente
Subtítulos automáticos, palabra por palabra
Remotion incluye @remotion/install-whisper-cpp, que instala Whisper.cpp en tu máquina y transcribe el audio localmente con marcas de tiempo, y @remotion/captions para trabajar esos subtítulos. Prueba con:
Transcribe el audio de mi video con Whisper y agrega subtítulos grandes en la parte inferior, resaltando en amarillo la palabra que se está diciendo.
Gráficos animados con tus datos
Con estas ventas mensuales (pega tus datos), crea un gráfico de barras animado que crezca de izquierda a derecha y muestre el porcentaje de crecimiento al final.
Voz con IA y música de fondo
El audio se agrega con el componente <Audio />. Puedes usar una voz generada con IA o tu propia grabación, y pedirle al agente que baje el volumen de la música cuando se escucha la narración:
Agrega la narración de la carpeta public/voz y una música de fondo que baje de volumen mientras se habla. Ajusta la duración de cada escena a la duración real de cada audio.
Consejo práctico: mide la duración real de cada audio (por ejemplo con ffprobe) y haz que el agente calcule la duración de cada escena a partir de ese dato. Así la imagen siempre queda sincronizada con la voz.
Borrar silencios automáticamente
La función getSilentParts(), del paquete @remotion/renderer, analiza un video o audio y devuelve qué tramos son silencio y cuáles se escuchan:
import { getSilentParts } from '@remotion/renderer';
const { silentParts, audibleParts, durationInSeconds } = await getSilentParts({
src: 'public/mi-video.mp4',
noiseThresholdInDecibels: -30,
minDurationInSeconds: 0.5,
});
Con esa lista, el agente puede armar el video usando solo los tramos audibles, unidos uno tras otro:
Usa getSilentParts para detectar los silencios de public/mi-video.mp4 y crea una composición que solo contenga los tramos con voz, unidos sin pausas largas.
Paso 4: renderiza tu MP4
Cuando estés conforme, un solo comando genera el archivo final:
npx remotion render MiComposicion out/video.mp4
Reemplaza MiComposicion por el identificador de tu composición. Para publicar en redes en otro formato (por ejemplo vertical 9:16 para TikTok o Reels), pídele al agente una segunda composición de 1080×1920 con el layout adaptado y renderízala igual.
Consejos para trabajar mejor con el agente
- Divide el video en escenas y pide una a la vez; es más fácil de corregir.
- Mira el Studio después de cada cambio, en vez de acumular muchas instrucciones.
- Sé específico con colores, tamaños y tiempos (“2 segundos”, “texto de 80 px”).
- Guarda versiones de tu proyecto (por ejemplo con Git) antes de cambios grandes.
Sobre la licencia de Remotion
Según la licencia publicada por Remotion, su uso es gratuito para personas, para organizaciones con fines de lucro de hasta 3 empleados y para organizaciones sin fines de lucro. Las empresas con 4 o más empleados necesitan una licencia de empresa. Revisa siempre los términos vigentes en remotion.dev/docs/license antes de usarlo en tu negocio.
Preguntas frecuentes
¿Necesito saber programar?
No para empezar: el agente escribe el código por ti. Aun así, ayuda entender lo básico (qué es una escena, qué es un fotograma) para pedir cosas con precisión.
¿Funciona solo con Claude Code?
No. Funciona con cualquier agente capaz de leer y editar archivos de tu proyecto y ejecutar comandos, como Claude Code, Codex o Antigravity.
¿Puedo usarlo para videos de mi negocio?
Sí, respetando los términos de licencia explicados arriba. Es ideal para videos repetitivos: tutoriales, promociones, reportes con datos o contenido para redes.
¿Quieres automatizar la creación de videos o contenido para tu negocio? En iComercial ayudamos a pymes en Chile con sitios web, hosting e inteligencia artificial aplicada. Escríbenos y conversamos tu caso.
Agregar un comentario