Guía práctica · Paso a paso

Guía para crear videos para tu agencia con IA

Vas a montar tu propio estudio de video con IA. Se configura una sola vez; después produces videos publicitarios —con voz, música, subtítulos y tus pantallas reales— pidiéndoselos a Claude en palabras, sin editar nada a mano. Sigue los pasos en orden.

1

Abre Claude de escritorio y ve a Code

Descarga la app de Claude para computador, inicia sesión y entra a la pestaña Code. Desde ahí le vas a pedir a Claude que arme tu video — él hace el trabajo técnico por ti.

2

Instala Git una vez

Git es un programa gratuito que Claude necesita para trabajar. Descárgalo e instálalo con las opciones que trae por defecto (solo dale "siguiente"). Cuando termines, cierra y vuelve a abrir Claude.

Página oficial de Git — descarga la versión para tu sistema.
3

Consigue tu llave de Gemini una vez

La llave (API key) es como una contraseña que conecta a Claude con la IA que genera imágenes y video. Entra a Google AI Studio, crea tu API key de Gemini y guárdala.

Google AI Studio — crea y copia tu API key de Gemini.

Para generar video/imágenes necesitas activar la facturación en tu cuenta de Google.

4

Consigue tu llave de ElevenLabs (voz, música y efectos) una vez

ElevenLabs le pone la voz, la música y los efectos a tu video. Crea tu cuenta y sigue estos pasos para sacar tu llave:

  1. Entra a tu perfil (abajo a la izquierda) y abre el menú.
  2. Ve a la sección de API Keys y crea una nueva.
  3. Al crearla, activa los permisos de Texto-a-voz, Efectos de sonido y Música.
  4. Copia la llave y guárdala.
5

Copia tu Voice ID (la voz de tu marca)

Elige la voz que quieres para tus videos en la biblioteca de ElevenLabs y copia su Voice ID. Ese código le dice a Claude con qué voz narrar.

Copia el Voice ID de la voz elegida.
6

Ten lista tu carpeta de marca

Reúne en una carpeta tu logo, tu kit de marca (el que creaste en la guía de imágenes) y las pantallas o imágenes reales que quieras mostrar en el video. Se la darás a Claude para que todo salga con tu identidad.

7

Instala tu estudio de video una vez

Pega este prompt en Claude (pestaña Code). Con él, Claude instala solo todo el entorno de video (Remotion) y deja tu estudio listo. Cuando te pida las llaves, pégale las de Gemini y ElevenLabs.

Prompt · Instalar el estudio (Remotion)
# SETUP: Motion Design Video Pipeline (Remotion + AI)

Eres un Motion Design Technical Director. Tu primera tarea es montar un pipeline completo de produccion de video con Remotion + Gemini + ElevenLabs en este workspace. Sigue los pasos abajo SIN saltarte ninguno.

NO me preguntes nada hasta terminar el setup tecnico. Al final me preguntas por las API keys y datos de marca.

---

## 0. REGLAS DE OPERACION (LEELAS PRIMERO)

### Regla anti-suposicion
Nunca asumas, menciones ni preguntes por marcas internas (como ISAVISA, AVB u otras). Trabaja UNICAMENTE con los datos que el cliente entrega en su brief. Si falta un dato (nombre, paleta, voz), usa un valor neutro generico o preguntale al cliente por ESE dato puntual, nunca por una marca interna.

### Regla de contraste obligatoria
Apenas identifiques la paleta de la marca que vas a usar, fija esta regla y respetala en TODA la pieza:

El texto JAMAS va del mismo color (ni un tono cercano) del fondo. Todo debe contrastar de forma profesional: sobre fondos oscuros el texto va claro; sobre fondos claros, oscuro. Si un texto cae sobre una zona de bajo contraste o muy detallada, agregale un scrim/halo/sombra detras para garantizar legibilidad. El titular y el CTA llevan el mayor contraste. El mensaje debe leerse SIEMPRE, sin importar lo inusual de la paleta.

---

## 1. METODOLOGIA QUE DEBES INTERNALIZAR

Tu rol: producir reels verticales (1080x1920), cuadrados (1080x1080) y horizontales (1920x1080) con Remotion en estilo "editorial data-report" — tipografia pesada, datos animados, cortes ritmicos, sonido sincronizado.

Stack obligatorio:
- Remotion 4.0.448 — TODAS las @remotion/* pinneadas EXACTO (sin ^)
- React 19.2.3, TypeScript 5.9.3
- 30fps. npx tsc --noEmit antes de render
- Una Composition por video en Root.tsx
- Scenes en src/<projectName>/scenes.tsx

Animacion:
- interpolate(frame, [in,out], [a,b], {extrapolateLeft:"clamp", extrapolateRight:"clamp"})
- Easing.bezier(0.16, 1, 0.3, 1) para entradas
- spring() configs: smooth {damping:12, stiffness:110, mass:0.7}, slam {damping:9, stiffness:200, mass:0.5}
- Patron entrada: opacity 0->1 + translateY 20->0 + scale 0.85->1 con stagger

Retencion (innegociable):
- HOOK frame 1 con slam (scale 2.4->1 + flash + bass impact)
- Push-in continuo (scale 1.0->1.045) + snap-in entrada (1.06->1 en 8f)
- Ritmo variado, NO uniforme. Hook 2.5s -> datos 4s -> CTA con aire
- Cortes cada 3-4s
- Cierre CTA, logo <=2s
- Legible en mute

Estilo editorial:
- Contenido CENTRADO (no top-left)
- Componente Slide reutilizable: fondo + push-in + scrim direccional (textZone: top/bottom/left/right/center) + watermark gigante esquina + logo persistente
- Watermark opacity 0.05-0.10 en zona muerta
- Titular Inter Black + palabra clave en gradiente con WebkitTextStroke: 2px white + serif italic para enfasis emocional
- Contraste: sobre fondos navy-dominant u oscuros el texto va SIEMPRE claro (white/tint), nunca oscuro. Sobre fondos claros, texto oscuro. Cuando el fondo es muy detallado/medio-tono, agrega scrim direccional + textShadow halo para garantizar legibilidad

Audio (REGLAS LOCKEADAS):
- Voz: ElevenLabs modelo eleven_v3, stability 0.42, similarity_boost 0.78, style 0.6, speaker_boost on
- Silencios de la voz se eliminan con ffmpeg atrim + concat (Remotion's ffmpeg NO incluye silenceremove filter)
- Musica: SIEMPRE de frame 0 a frame final, sin silencios
- NO fade-in en musica. ElevenLabs Music produce 1-2s de rampa de volumen al inicio — SIEMPRE hard-trim los primeros 2s con ffmpeg -ss 2.0, sin importar lo que diga silencedetect
- Generar musica con music_length_ms = (duracionVideo + 12) * 1000 para dejar cola de 10s post-trim
- Fade-out de musica solo en ultimos ~60 frames (2s)
- Volumen musica: 0.18-0.24 (~10-14 dB bajo voz)
- SFX: peaks transitorios deben quedar 12+ dB bajo voz peak -> volumenes 0.10-0.18 tipicamente
- Mezcla final: video se renderiza normal, luego ffmpeg-static aplica setpts=PTS/1.1 + atempo=1.1 para acelerar 10%

Imagenes:
- Gemini nano-banana-pro-preview -> fallback gemini-2.5-flash-image (retry 2/4/6s backoff en 503)
- Para personajes consistentes: 1 master sheet -> usar como reference image en subsecuentes calls
- Prompt SIEMPRE termina con paleta de marca + "no text, no logos"
- Fondos low-key dark con zonas reservadas para tipografia
- Contraste: si el fondo es oscuro el texto sera claro; nunca generar imagen tan ocupada que tape la zona reservada de tipografia

Workflow por proyecto:
1. Clonar proyecto template (este setup)
2. Storyboard con timecodes (cortes 3-4s, duracion exacta calculada con transitions overlap)
3. Construir escenas + composition + SFX + musica
4. tsc --noEmit
5. Render STILLS clave en frames de hook/mid/CTA
6. Hand-off npm run dev para aprobacion en Studio
7. REGLA DE ORO: NUNCA renderizar MP4 final sin autorizacion explicita del usuario en Studio

---

## 2. ESTRUCTURA DE CARPETAS A CREAR

my-video-project/
- .env (placeholders sin keys reales)
- .env.example
- package.json
- tsconfig.json
- remotion.config.ts
- public/ (audio/ images/ logos/ sfx/)
- scripts/ (gen-music.mjs gen-voice.mjs gen-image.mjs gen-sfx.mjs tighten-voice.mjs)
- src/ (index.ts Root.tsx theme.ts Slide.tsx example/ExampleComposition.tsx example/scenes.tsx)
- out/

---

## 3. ARCHIVOS A CREAR (CONTENIDO EXACTO)

### package.json
{
  "name": "motion-pipeline",
  "version": "1.0.0",
  "private": true,
  "dependencies": {
    "@google/genai": "^2.2.0",
    "@remotion/cli": "4.0.448",
    "@remotion/google-fonts": "4.0.448",
    "@remotion/layout-utils": "4.0.448",
    "@remotion/noise": "4.0.448",
    "@remotion/transitions": "4.0.448",
    "dotenv": "^17.4.2",
    "react": "19.2.3",
    "react-dom": "19.2.3",
    "remotion": "4.0.448"
  },
  "devDependencies": {
    "@types/react": "19.2.7",
    "@types/web": "0.0.166",
    "ffmpeg-static": "^5.2.0",
    "typescript": "5.9.3"
  },
  "scripts": {
    "dev": "remotion studio",
    "start": "remotion studio",
    "image": "node scripts/gen-image.mjs",
    "music": "node scripts/gen-music.mjs",
    "sfx": "node scripts/gen-sfx.mjs",
    "voice": "node scripts/gen-voice.mjs",
    "tighten": "node scripts/tighten-voice.mjs"
  }
}

### .env.example
ELEVENLABS_API_KEY=
ELEVENLABS_VOICE_ID=
GEMINI_API_KEY=

### tsconfig.json
{
  "compilerOptions": {
    "target": "ES2022",
    "module": "ESNext",
    "moduleResolution": "Bundler",
    "jsx": "react-jsx",
    "strict": true,
    "esModuleInterop": true,
    "skipLibCheck": true,
    "forceConsistentCasingInFileNames": true,
    "noEmit": true,
    "lib": ["ES2022", "DOM"]
  },
  "include": ["src/**/*"]
}

### remotion.config.ts
import { Config } from "@remotion/cli/config";
Config.setVideoImageFormat("jpeg");
Config.setOverwriteOutput(true);
Config.setConcurrency(2);

### src/index.ts
import { registerRoot } from "remotion";
import { RemotionRoot } from "./Root";
registerRoot(RemotionRoot);

### src/Root.tsx
import React from "react";
import { Composition } from "remotion";
import { ExampleComposition } from "./example/ExampleComposition";

export const RemotionRoot: React.FC = () => (
  <>
    <Composition id="Example" component={ExampleComposition} durationInFrames={300} fps={30} width={1080} height={1920} />
  </>
);

### src/theme.ts
import { Easing } from "remotion";

// PLACEHOLDER PALETTE — REPLACE WITH CLIENT'S [PALETA_DE_MARCA] WHEN PROVIDED.
// Keep semantic keys; only swap hex values.
export const palette = {
  navy: "#0f2040",
  primary: "#1e40af",
  accent: "#3b82f6",
  tint: "#dbeafe",
  signature: "#c0f0c0",
  success: "#22c55e",
  white: "#ffffff",
  red: "#ef4444",
} as const;

export const fonts = {
  inter: "Inter, system-ui, sans-serif",
  playfair: '"Playfair Display", Georgia, serif',
  poppins: "Poppins, system-ui, sans-serif",
} as const;

export const logo = { full: "logos/logo-full.png", mark: "logos/logo-mark.png" } as const;

export const safe = {
  vertical: { top: 260, bottom: 1660 },
  square: { top: 80, bottom: 1000 },
  horizontal: { top: 80, bottom: 1000 },
} as const;

export const ease = { out: Easing.bezier(0.16, 1, 0.3, 1), inOut: Easing.bezier(0.65, 0, 0.35, 1) };

export const springs = {
  smooth: { damping: 12, stiffness: 110, mass: 0.7 },
  slam: { damping: 9, stiffness: 190, mass: 0.5 },
  pop: { damping: 14, stiffness: 160, mass: 0.6 },
};

export const grad = {
  base: `linear-gradient(135deg, ${palette.navy} 0%, ${palette.primary} 100%)`,
  accent: `linear-gradient(135deg, ${palette.signature} 0%, ${palette.accent} 100%)`,
  whiteAccent: `linear-gradient(135deg, ${palette.white} 0%, ${palette.accent} 100%)`,
};

export const text = {
  gradient: (g: string, strokeW = 2) => ({
    background: g,
    WebkitBackgroundClip: "text" as const,
    WebkitTextFillColor: "transparent" as const,
    WebkitTextStroke: `${strokeW}px #ffffff`,
    paintOrder: "stroke fill" as const,
  }),
};

(Slide.tsx, ExampleComposition.tsx y los scripts .mjs — gen-music, gen-voice, tighten-voice, gen-image, gen-sfx — se crean con el contenido tecnico estandar del pipeline. No alterar versiones ni reglas de audio.)

---

## 4. PASOS DE INSTALACION

Ejecuta en orden:

mkdir motion-pipeline && cd motion-pipeline
mkdir -p public/audio public/images public/logos public/sfx scripts src/example out
# crea cada archivo con el contenido de arriba
npm install
cp .env.example .env
npx tsc --noEmit

Si tsc --noEmit pasa sin errores -> setup tecnico OK.

---

## 5. DESPUES DEL SETUP, PREGUNTA AL USUARIO

Cuando termines el setup tecnico, preguntale al usuario:

> Setup tecnico completo. Para arrancar a producir videos necesito:
>
> 1. API Key de ElevenLabs — la guardas en .env como ELEVENLABS_API_KEY=. Si no la tienes, sacala en elevenlabs.io -> (menu izquierdo) Configurar -> Claves de API -> Crear clave. IMPORTANTE: al crear la clave, activa el acceso a "De texto a voz", "Efectos de sonido" y "Generacion de musica" (nacen en "Sin acceso").
>
> 2. Voice ID de ElevenLabs — el id de la voz que sera la narradora de [NOMBRE_DE_TU_MARCA]. Lo sacas en elevenlabs.io -> Voces -> los tres puntos (...) de la voz -> "Copiar ID de voz". Va en .env como ELEVENLABS_VOICE_ID=.
>
> 3. API Key de Gemini — para generar imagenes y backgrounds. Sacala en aistudio.google.com/app/apikey -> Create API key. Ojo: el modelo nano-banana-pro-preview requiere billing habilitado en la cuenta de Google Cloud (~$0.04 USD por imagen). Va en .env como GEMINI_API_KEY=.
>
> 4. Identidad de marca:
>    - [NOMBRE_DE_TU_MARCA]
>    - [PALETA_DE_MARCA] — entre 5 y 8 hex (yo edito src/theme.ts con tus colores)
>    - Fuentes (default ya cargo Inter, Playfair Display, Poppins via @remotion/google-fonts; si tienes otras, dimelas)
>    - Logos en PNG transparente — guardalos en public/logos/logo-full.png (logo completo) y public/logos/logo-mark.png (solo icono/marca)
>
> 5. Brief del primer video — tono, duracion, formato (vertical 1080x1920, square 1080x1080 o horizontal 1920x1080), guion, datos clave.
>
> Pasame estos 5 items y arranco. Las API keys NO me las muestres en chat — editalas tu directamente en .env y dime "listo" cuando esten puestas.

---

## 6. CUANDO PRODUZCAS UN VIDEO

1. Recibe el brief
2. Calcula storyboard: scenes x duraciones x transitions overlap = duracion exacta. Ritmo variado (cortes 3-4s, hook rapido, CTA con aire)
3. Edita theme.ts con la [PALETA_DE_MARCA] del usuario
4. Genera voz: edita scripts/gen-voice.mjs con el guion -> npm run voice
5. Tighten silencios: npm run tighten
6. Genera musica: edita scripts/gen-music.mjs con VIDEO_SECONDS = duracionFinalAntesDe1.1x -> npm run music (auto-trimea 2s)
7. Genera SFX library: npm run sfx (se reutiliza entre videos)
8. Genera imagenes/backgrounds segun storyboard: edita scripts/gen-image.mjs por imagen -> npm run image. Para personajes consistentes: 1 master sheet primero (guardalo como personaje-master.png), luego usalo como REF_PATH en cada scene
9. Construye src/<projectName>/scenes.tsx y src/<projectName>/<Name>Composition.tsx usando Slide y TransitionSeries
10. Registra en Root.tsx
11. npx tsc --noEmit
12. Renderiza STILLS clave: npx remotion still <Id> out/still-<frame>.png --frame=<n>
13. Hand-off al usuario: npm run dev -> composicion abre en Studio
14. NO renderices el MP4 final hasta que el usuario apruebe en Studio
15. Cuando apruebe: npx remotion render <Id> out/<name>.mp4 -> luego speedup 1.1x con ffmpeg-static:
    ffmpeg -y -i out/<name>.mp4 -filter_complex "[0:v]setpts=PTS/1.1[v];[0:a]atempo=1.1[a]" -map "[v]" -map "[a]" -c:v libx264 -preset medium -crf 18 -c:a aac -b:a 192k out/<name>-1.1x.mp4

---

## 7. GOTCHAS DOCUMENTADOS

- Emojis de bandera renderizan como texto en Chromium/Remotion. Usa CSS stamp
- WebkitBackgroundClip:text + emoji = invisible. Separa emoji del gradient-clip
- Hex alpha 1 digito invalido. Usa siempre 2 digitos
- Todos los assets en public/ ANTES de render o muere con 404
- FFmpeg silenceremove filter NO esta en Remotion's ffmpeg -> usa atrim+concat
- FFmpeg setpts filter (video) NO esta en Remotion's ffmpeg -> usa ffmpeg-static
- Render falla con "write EOF" en Windows -> mata zombies ffmpeg, limpia %LOCALAPPDATA%\remotion, retry con --concurrency=2
- Versiones @remotion DEBEN ser EXACTAS 4.0.448. Mezclar versiones rompe con React error #130

---

Procede con el setup. Cuando termines, pregunta al usuario por API keys + datos de marca.
8

Pega tu brief de video

El brief es lo que quieres que diga tu video. Pega este prompt en Claude y rellena la parte de tus datos (mensaje, escenas, qué mostrar). Claude produce el video con voz, música, subtítulos y tus pantallas reales.

Prompt · Brief de video
# 🎬 BRIEF DE VIDEO — INTAKE TEMPLATE

## 0. REGLAS DE OPERACION (LEELAS PRIMERO)

### Regla anti-suposicion
Nunca asumas, menciones ni preguntes por marcas internas (como ISAVISA, AVB u otras). Trabaja UNICAMENTE con los datos que el cliente entrega en su brief. Si falta un dato (nombre, paleta, voz), usa un valor neutro generico o preguntale al cliente por ESE dato puntual, nunca por una marca interna.

### Regla de contraste obligatoria
Apenas identifiques la paleta de la marca que vas a usar, fija esta regla y respetala en TODA la pieza:

El texto JAMAS va del mismo color (ni un tono cercano) del fondo. Todo debe contrastar de forma profesional: sobre fondos oscuros el texto va claro; sobre fondos claros, oscuro. Si un texto cae sobre una zona de bajo contraste o muy detallada, agregale un scrim/halo/sombra detras para garantizar legibilidad. El titular y el CTA llevan el mayor contraste. El mensaje debe leerse SIEMPRE, sin importar lo inusual de la paleta.

---

## 🟢 LO QUE EL CLIENTE PROVEE (solo esto)

### Obligatorio
1. Guion o idea de guion — texto que dira la voz, O una idea/concepto general que el agente traduzca a guion
2. Duracion objetivo — 15s, 20s, 30s, 45s, 60s, etc. (si no especifica, el agente recomienda segun el guion)
3. Formato — vertical 1080x1920, square 1080x1080, horizontal 1920x1080, o "los tres"
4. Objetivo del video — venta, retargeting, awareness, testimonio, educacional, etc.

### Opcional (mejora resultado pero no bloquea)
5. Tono — corporativo serio, joven divertido, cinematico dramatico, conversacional cercano, etc.
6. Personaje protagonista — ¿el video lleva un personaje recurrente? (si si, descripcion: nombre, edad, genero, profesion)
7. Estilo musical — corporate happy, cinematic, hip-hop chill, electronic upbeat, piano emotional, etc.
8. Referencias visuales — links a videos que le gustan al cliente (Apple, Stripe, Linear, Notion, etc.)
9. Restricciones de marca — palabras prohibidas, claims que no se pueden usar, disclaimers obligatorios
10. CTA exacto — URL, telefono, descarga app, etc.

### Lo que NUNCA pide al cliente
Estructura de escenas · Numero de cortes · Decisiones de tipografia · Volumenes de audio ·
Prompts de imagen · Settings de voz · Configs de transicion · Frames/fps

---

## 🛠️ LO QUE EL AGENTE HACE AUTOMATICAMENTE

### A. STORYBOARD (sin preguntar)
- Mapea el guion a escenas de 3-4 segundos cada una
- Aplica ritmo variado (no uniforme): hook rapido 2-2.5s · datos con aire 4s · CTA con 5-6s
- Calcula duracion exacta: Σ(durations) − Σ(transitions overlap) = duracion visible
- Frame 1 = HOOK SLAM: scale 2.4→1 + flash + bass impact, palabra o numero impactante
- Cierra con CTA accionable, logo corto (<=2s), no logo largo al final
- Mezcla emociones: setup → conflicto → descubrimiento → climax → valor → prueba → CTA

### B. PERSONAJE (si aplica)
- Genera 1 master sheet de personaje en estilo Pixar/Encanto/Soul via Gemini nano-banana-pro-preview
- Master sheet se queda guardado como personaje-master.png (o el nombre que sea)
- Lo muestra al cliente para aprobar antes de escalar
- Despues genera las N escenas usando master sheet como reference image → mismo personaje en todas

### C. IMAGENES (1 por escena, todas unicas)
- Cada escena tiene fondo unico — prohibido repetir imagen entre escenas
- Prompt template: estilo cinematico Pixar/Disney 3D, low-key lighting, fondo dominante en color base de la [PALETA_DE_MARCA], zona reservada para tipografia (left/right/top/bottom), paleta de marca estricta, no text, no logos
- Si el cliente no dio paleta → agente pregunta por la [PALETA_DE_MARCA] (no la inventa con marcas internas)
- Retry chain: nano-banana-pro-preview → fallback gemini-2.5-flash-image con backoff 2/4/6s en 503
- Contraste obligatorio: fondos oscuros llevan texto claro, nunca oscuro. Fondos claros llevan texto oscuro. La zona reservada para tipografia debe quedar limpia (sin detalle ocupado) para que el texto sea siempre legible

### D. VOZ
- Modelo eleven_v3 (el mas expresivo de ElevenLabs)
- Settings fijas: stability 0.42 · similarity 0.78 · style 0.6 · speaker_boost on
- Texto reescrito como narrativa con arco (no lista de datos)
- Nombres propios escritos con la tilde foneticamente correcta para el idioma del guion
- Despues de generar → tighten silencios con ffmpeg atrim+concat (gap maximo 150ms entre frases)
- Aplica regla "+1.1x speedup" al final del pipeline

### E. MUSICA (regla locked)
- Genera con ElevenLabs Music API desde frame 0
- Duracion: (videoSeconds + 12) * 1000 ms (cola de 10s post-trim)
- Prompt incluye: MAJOR KEY, full constant rhythm from second 0, no ambient intro, no buildup, no outro fade, sustained energy
- Auto-trim primeros 2s con ffmpeg -ss 2.0 — sin excepcion
- Toca de frame 0 al ultimo frame del video — sin silencios
- Fade-out solo en los ultimos 60 frames (2s) dentro de Remotion
- Volumen: 0.18-0.24 (~10-14 dB bajo voz)

### F. SFX (sound effects)
- Libreria reusable de 8 SFX via ElevenLabs sound-generation API: impact, whoosh, tick, pop, chime, cash, radar-ping, cta-swell
- Un cue por corte sincronizado al frame exacto del evento visual
- Volumenes 0.10-0.18 para que peaks transitorios queden ~12 dB bajo voz peak
- Hero hits (slam, CTA): 0.18 · Mid (cash, chime): 0.14 · Sutiles (tick, radar): 0.10

### G. TIPOGRAFIA
- Inter Black para headlines · Playfair Italic para palabra emocional · Poppins opcional para body
- Slams escalados al formato:
  - Vertical: 140-220pt slam, 60-92pt body, 22-32pt kicker
  - Square: 100-150pt slam, 40-60pt body, 16-22pt kicker
  - Horizontal: similar a vertical
- Palabra clave SIEMPRE en text.gradient(grad.accent, 2) con WebkitTextStroke: 2px white → pop contra cualquier fondo
- Numeros animados con interpolate (counters tipo 0 → valor final)
- textShadow: 0 2px 14px <fondoBase>cc, 0 0 30px <fondoBase>cc para halo de legibilidad
- Contraste obligatorio: sobre fondos oscuros el texto va claro (white/tint de la paleta), nunca oscuro. Sobre fondos claros, texto oscuro. Si el fondo es medio-tono o muy detallado, agregar scrim direccional + textShadow garantiza legibilidad

### H. SLIDE WRAPPER (componente reusable)
- Push-in continuo: scale(1.0 → 1.045) durante toda la escena
- Snap-in entrada: scale(1.06 → 1) en 8 frames con spring {damping:14, stiffness:180}
- Scrim direccional segun textZone prop: top/bottom/left/right/center → oscurece la mitad donde va el texto
- Watermark gigante (palabra/numero, 380-620pt) en esquina inferior derecha, opacity 0.05
- Logo persistente top-right, opacity 0.85, width 160-220px
- Exit fade opcional ultimos 10 frames (off cuando TransitionSeries maneja el corte)

### I. TRANSICIONES
- @remotion/transitions TransitionSeries
- Mezcla de fade (10f linear) + slide-from-right (12f spring) + wipe-from-bottom-right (14f linear)
- Variar tipo entre escenas — NO usar la misma transicion en todos los cortes
- Calcular: Σ(scene durations) − Σ(transitions) = duracion visible

### J. ZONA SEGURA POR FORMATO
- Vertical 1080x1920: contenido entre y=260 y y=1660
- Square 1080x1080: contenido entre y=80 y y=1000
- Horizontal 1920x1080: contenido entre y=80 y y=1000
- Rule of thirds aplicado en composiciones criticas (escena pivotal, CTA)

### K. RENDER PIPELINE
1. npx tsc --noEmit antes de cualquier render
2. Render 3-5 stills clave (npx remotion still) → mostrar al cliente
3. Hand-off npm run dev → cliente revisa en Studio
4. REGLA DE ORO: NO MP4 final hasta que el cliente apruebe explicitamente
5. Cuando aprueba: npx remotion render → MP4 base
6. Post-process 1.1x: ffmpeg setpts=PTS/1.1 + atempo=1.1 → <nombre>-1.1x.mp4
7. Entrega ruta del archivo final

### L. ENTREGABLES POR DEFECTO
Si el cliente solo dijo "vertical", igualmente entrega:
- MP4 base (sin speedup) — <nombre>.mp4
- MP4 final (1.1x) — <nombre>-1.1x.mp4
- Stills clave del video
- Caption Instagram (hook + cuerpo + CTA + hashtags)
- Caption TikTok (mas corto y punchy)
Si pidio multiples formatos: misma cosa para cada uno (vertical + square + horizontal).

---

## 📝 FORMATO QUE EL CLIENTE PEGA EN EL CHAT

GUION/IDEA:
[texto del guion o brief de la idea]

DURACION:
[15s / 20s / 30s / 45s / 60s o "tu decide"]

FORMATO:
[vertical / square / horizontal / los tres]

OBJETIVO:
[venta / retargeting / awareness / testimonio / etc.]

(Opcional)
TONO:
PERSONAJE:
MUSICA:
REFERENCIAS:
RESTRICCIONES:
CTA EXACTO:

---

## 🚦 DECISIONES QUE EL AGENTE TOMA SOLO (sin preguntar)
Cuantas escenas · Duracion de cada escena · Tipo de transicion por corte · Que palabra va en gradient ·
Que palabra va en italic Playfair · Composicion de cada imagen · Que SFX en cada beat ·
Volumen exacto de musica/voz/SFX · Frame exacto de cada SFX cue · Cuanto fade-out de musica ·
Que watermark gigante por escena · Tamaño tipografico exacto · Ritmo de cortes ·
Que color de texto usa sobre cada fondo (siempre garantizando contraste)

## ✋ DECISIONES QUE SI PREGUNTA AL CLIENTE
- Master sheet de personaje (si aplica) — antes de escalar a 10 escenas
- Texto exacto de cambios polemicos — ej. "el guion dice X pero la regla de marca prohibe X, lo reemplazo por Y, ¿OK?"
- Aprobacion en Studio — antes del MP4 final
- Voz del personaje — voice_id de ElevenLabs si la marca tiene voz oficial (sino el agente sugiere)
- [PALETA_DE_MARCA] — si el cliente no la dio y no esta definida en theme.ts
9

Revisa en Remotion Studio y pide ajustes

Claude abre una vista previa (Remotion Studio) donde ves tu video antes de exportarlo. ¿Algo no te gusta? No edites nada a mano: pídeselo a Claude en palabras"acorta la intro", "cambia la música", "que la voz hable más lento", "usa el logo de fondo oscuro"— y él lo ajusta. Repite hasta que quede como quieres.

Remotion Studio: tu video en vivo, listo para ajustar con palabras.
10

Exporta el video final y publica

Cuando estés conforme, pídele a Claude que exporte el video en MP4. Listo para publicar en tus redes — con tu voz, tu marca y tus pantallas reales, hecho por ti y sin editar nada a mano.