La guía que prometí en el video: cómo lo hice 100% con IA (Claude + Remotion)

Si llegaste aquí porque comentaste "guía" en el reel, esta es. Voy a ir de cero, asumiendo que nunca has abierto un editor de código, porque la primera vez que yo armé uno de estos tampoco sabía por dónde empezar. Es largo porque es el paso a paso real, no el resumen.

La idea de fondo, antes de entrar en comandos: todo lo que ves y escuchas en el video lo generó la IA, pero nada de eso funciona sin que alguien —en este caso yo— le dé el guion, el estilo de marca y el criterio de qué sirve y qué no. Eso es lo que vas a estar haciendo en cada paso.

Lo que vas a necesitar

Un computador (Mac, Windows o Linux), una suscripción de pago a Claude (Pro, Max o superior — Claude Code lo requiere) y una cuenta en ElevenLabs para clonar tu voz. Todo lo demás es gratis.

Paso 1: instala VS Code y Node.js

VS Code es el editor donde vas a trabajar. Descárgalo e instálalo como cualquier programa, no tiene configuración especial que hacer en este punto.

Después instala Node.js (baja la versión LTS, la recomendada). Lo necesitas porque Remotion —la herramienta que convierte código en video— corre sobre Node. Para confirmar que quedó bien instalado, abre una terminal (en VS Code: menú Terminal → Nueva terminal) y escribe:

node --version

Si te devuelve un número de versión, estás listo.

Paso 2: instala Claude Code

Dentro de VS Code, abre el panel de extensiones (Cmd+Shift+X en Mac, Ctrl+Shift+X en Windows/Linux), busca "Claude Code" e instálalo. Es la extensión oficial de Anthropic: te da un panel de chat dentro del editor donde Claude puede leer tus archivos y escribir código directamente.

La primera vez que lo abras —hay un ícono de chispa arriba a la derecha del editor— te va a pedir iniciar sesión con tu cuenta de Claude. Hazlo y ya queda guardada.

Si prefieres trabajar desde la terminal en vez del panel (yo uso las dos cosas, según el momento), instala también la versión de línea de comandos:

curl -fsSL https://claude.ai/install.sh | bash

(En Windows, el comando equivalente está en la guía oficial de instalación.) Confirmas que quedó instalado con claude --version, y la inicias dentro de la carpeta de tu proyecto escribiendo simplemente claude.

Paso 3: crea el proyecto de Remotion

Remotion es lo que convierte código en video: cada escena es un componente de React, y Remotion lo renderiza cuadro por cuadro. Desde la terminal, crea el proyecto:

npx create-video --yes --blank mi-video
cd mi-video
npx skills add remotion-dev/skills
npm run dev

El primer comando crea una plantilla en blanco en la carpeta mi-video. El segundo —skills add— le instala a Claude un conjunto de guías específicas de Remotion (composiciones, animaciones, audio, subtítulos) para que no tengas que explicarle desde cero cómo funciona la herramienta. El tercero abre Remotion Studio, una vista previa en tu navegador donde vas a ver cada escena mientras la vas armando.

Paso 4: dale a Claude tu identidad visual

Este es el paso que de verdad marca la diferencia entre un video genérico y uno que se vea como tuyo. Crea un archivo llamado CLAUDE.md en la raíz del proyecto —Claude Code lo lee automáticamente cada vez que abres una sesión ahí, sin que tengas que repetirle nada—. Yo lo lleno así (adapta cada campo a tu marca):

# Identidad visual del proyecto
 
## Paleta de color
- Fondo oscuro: #1C1E22 (úsalo en gancho y CTA)
- Fondo claro: #F1F2F4 (úsalo en el contenido)
- Texto secundario: #5F636B
- Acento único: #176B53 sobre fondo claro, #35B893 sobre fondo oscuro
  (nunca agregues un segundo color de acento)
 
## Tipografía (Google Fonts)
- Títulos: [tu fuente de títulos]
- Cuerpo: [tu fuente de cuerpo]
- Datos/numeración: [tu fuente monoespaciada]
 
## Formato
- 1080×1920 px (9:16), 30 fps
- Numeración de escena visible, estilo discreto
 
## Reglas
- Sin gradientes, sin emojis dentro del diseño
- Una sola idea por escena
- El texto que acompaña la voz aparece sincronizado palabra por palabra

Con esto guardado, cualquier escena que le pidas a Claude ya va a salir con tus colores y tu tipografía por defecto, sin que tengas que repetirlo cada vez.

Paso 5: escribe el guion escena por escena

Antes de generar nada, define el guion completo: cuántas escenas, qué dice la voz en cada una, y una idea de qué se ve. No hace falta que lo escribas todo a mano — puedes pedirle a Claude (en el chat normal de claude.ai, o en el mismo Claude Code) que te ayude a estructurarlo, pero la decisión de qué contar y en qué orden sigue siendo tuya. Para cada escena, anota: duración aproximada, el texto exacto de la voz, y la indicación visual.

Paso 6: clona tu voz y genera el audio

En ElevenLabs, sube una muestra de tu voz (unos minutos de audio limpio bastan) para crear un clon con Instant Voice Cloning. Después, genera un archivo de audio por cada escena, usando el texto que escribiste en el paso anterior.

Dos trucos que uso para que suene más natural: los puntos suspensivos (…) generan una pausa, y las MAYÚSCULAS le dan énfasis a una palabra. Si usas un modelo v3 o más reciente, también puedes agregar etiquetas como [excited] o [curious] antes de una frase para cambiar el tono — pero con moderación, porque se nota si las usas de más.

Paso 7: transcribe cada audio con marcas de tiempo por palabra

Este paso es el que permite que el texto en pantalla aparezca exactamente cuando se dice esa palabra, no "más o menos" sincronizado. Usa la transcripción de ElevenLabs (su modelo Scribe) o Whisper sobre cada uno de los audios que generaste. El resultado es un archivo con el tiempo de inicio y fin de cada palabra — justo lo que Claude necesita para programar subtítulos y animaciones que entren al ritmo exacto de tu voz.

Paso 8: pídele a Claude que programe cada escena

Con el guion, los audios y las transcripciones listos, vuelve a Claude Code (en la carpeta del proyecto, donde ya está tu CLAUDE.md) y dale todo junto. Un prompt que funciona bien:

Aquí está el guion completo con el texto de cada escena, el audio
de cada una (en /audio) y su transcripción con marcas de tiempo
por palabra (en /transcripciones).
 
Programa la escena 1 como una composición de Remotion: el texto
aparece palabra por palabra sincronizado exactamente con los
tiempos de la transcripción. Sigue la identidad visual del
CLAUDE.md. Cuando termines, muéstramela en el preview antes de
seguir con la escena 2.

Pídele que vaya una escena a la vez, no las nueve de un solo golpe — así puedes corregir el rumbo temprano en vez de descubrir en la escena 7 que algo no está funcionando desde la escena 2.

Paso 9: revisa en Remotion Studio y pide ajustes

Con npm run dev corriendo, cada escena que Claude programa aparece en la vista previa del navegador, donde puedes mover la línea de tiempo cuadro por cuadro. Cuando algo no te convenza —un texto que tapa el logo, una transición muy rápida, un color que no es el acento correcto— dile a Claude exactamente qué ves y qué esperabas. Entre más específico seas ("el texto de la escena 3 se superpone con el ícono de la esquina" en vez de "la escena 3 se ve rara"), mejor corrige.

Paso 10: renderiza el video final

Cuando las nueve escenas estén listas, renderiza el archivo final:

npx remotion render src/index.ts MiComposicion out/video.mp4 --codec=h264

El video queda en la carpeta out. Ábrelo en tu celular antes de publicarlo — se ve distinto en una pantalla de 6 pulgadas que en el monitor donde lo armaste.

Consejos finales

Revisa todo antes de publicar, no por desconfianza genérica hacia la IA, sino porque esto tiene dos tipos de errores que no se notan solos: datos o afirmaciones que suenan seguras y están mal, y detalles de marca que un modelo no tiene por qué saber que te importan (un espaciado, un tono de voz, una palabra que tú jamás usarías). Ninguno de los dos lo detecta Claude por ti.

Si quieres que el siguiente video te salga más rápido, guarda en tu CLAUDE.md cualquier corrección que hayas tenido que repetir más de una vez — eso significa que es una regla de tu marca, no un capricho de esa escena puntual. Ya escribí sobre armar contexto de marca para que la IA no te dé resultados genéricos; aplica exactamente igual aquí, solo que en video en vez de carrusel.

El código lo escribe la IA. El guion, la paleta y el criterio de qué se ve bien siguen siendo tuyos. Esa parte no se automatiza, y es justo la que hace que el video se vea como tuyo y no como el de cualquiera.