Probé Fable 5.2 para crear vídeos… ¿mejor que Opus 5.5?

En este proyecto el «código» es el prompt. Aquí lo tienes completo para copiarlo y pegarlo en Claude Code. Cambia el audio, el logo y la paleta por los de tu marca, y el cierre por tu propio enlace.

# Comercial animado de Hostinger

Crea y renderiza un comercial de Hostinger con motion graphics usando
Hyperframes, a partir del audio de narración que adjunto. Necesito un
MP4 terminado, no solo un storyboard, código sin ejecutar o una vista
previa HTML.

## 1. Herramientas y contexto

- Trabaja en una sesión nueva, dentro de la carpeta `hostinger` de mi
  Escritorio.
- La única skill autorizada es Hyperframes. No consultes ni utilices mis
  otras skills, plantillas personales, agentes personalizados o
  proyectos anteriores.
- No consultes ni actualices memoria persistente, recuerdos de otras
  conversaciones, auto-memory de Claude, archivos `MEMORY.md`,
  `CLAUDE.md`, `CLAUDE.local.md`, `AGENTS.md` ni directorios de memoria
  del usuario.
- Puedes utilizar herramientas de archivos, terminal, código, análisis
  de audio y navegador, además de la documentación de Hyperframes.
- Puedes delegar tareas a subagentes. Decide cómo organizar el trabajo;
  todos deben respetar las mismas restricciones de skills y memoria.
- No explores carpetas personales ajenas a este encargo, no cambies
  configuraciones globales ni elimines memorias. Si recibiste contexto
  personal precargado, decláralo sin afirmar que lo has eliminado.
  Respeta las instrucciones de mayor prioridad.
- Usa la versión disponible de Hyperframes y su documentación
  correspondiente. Si no está disponible, informa del bloqueo; no
  inventes su API ni sustituyas el framework.

## 2. Narración y recursos

Utiliza el audio adjunto. Si no puedes acceder a él, pídelo antes de
comenzar; no generes una voz de reemplazo.

Mide su duración y prepara una transcripción con tiempos. La narración
es el guion definitivo: no la reescribas, recortes, reordenes, aceleres
ni sustituyas. Puedes ajustar su nivel de reproducción sin cambiar su
contenido.

La duración del vídeo debe coincidir con la del audio. Organiza las
animaciones alrededor de la voz. Si una palabra importante no se
entiende, indícalo en lugar de inventarla.

Tienes disponible un logo de Hostinger en:

`assets/logos/hostinger.svg`

Puedes utilizarlo como parte de tu propuesta. El logo no limita los
recursos visuales que puedes emplear: tienes libertad para crear
ilustraciones, iconos, objetos, interfaces y otros elementos, o
incorporar recursos adicionales cuando aporten valor. Decide qué
necesita tu concepto.

Si incorporas recursos externos, verifica y documenta su procedencia y
permiso de uso; no asumas que una imagen encontrada en internet está
autorizada. Conserva las proporciones y trazados del logo cuando lo
utilices.

## 3. Dirección de arte: Claro editorial

Busca un lenguaje visual claro y explicativo: fondos claros, composición
editorial, jerarquía precisa y movimiento que ayude a entender.

### Paleta

- Fondo: `#F5F6FF`
- Texto principal: `#251951`
- Acento de marca: `#673DE6`
- Superficies secundarias: `#D9DBFF`

### Tipografía

Utiliza DM Sans, la familia observada en los estilos del sitio de
Hostinger. Para este vídeo, usa peso 400 en textos y 600–700 en títulos.
Si no está disponible, utiliza una sans serif de respaldo e indícalo.

### Acabado

Usa espacios amplios, bordes discretos y sombras suaves cuando ayuden a
separar planos. Decide cómo combinar tipografía, ilustraciones, objetos
e interfaces de acuerdo con tu concepto.

El resultado debe sentirse como un vídeo diseñado y animado, no una
landing page que se desplaza, una presentación de diapositivas o una
plantilla de tarjetas repetidas.

Evita efectos decorativos sin intención, zooms constantes, texto
excesivo y movimiento simultáneo que impida comprender la escena. Mantén
la identidad clara y editorial; no la conviertas en una estética oscura
o de neón.

## 4. Concepto e historia visual

Inventa tú el concepto, la historia visual y el storyboard a partir de
la narración.

Tienes libertad para decidir las metáforas, los recursos, las
composiciones, el número de escenas, las transiciones, el ritmo y la
manera de conectar las ideas.

No hay una secuencia de escenas predefinida. No te limites a ilustrar
literalmente cada frase ni a mostrar el nombre de cada función. Busca
una propuesta coherente, original y comprensible que comunique los
beneficios del audio.

Planifica la historia y después impleméntala. No te detengas en
presentar un storyboard ni esperes aprobación intermedia, salvo que
falte un insumo imprescindible. Resume el concepto elegido en el reporte
final.

### Contenido que debes respetar

- No añadas ni cambies prestaciones, precios, descuentos o promesas.
- Si utilizas rótulos, escribe «Sitios web ilimitados», no «recursos
  ilimitados».
- Si muestras el límite de Node.js, utiliza «Hasta 5 apps Node.js».
- No presentes una interfaz ilustrativa como si fuera una captura real
  del producto.
- El cierre debe mostrar Hostinger.com/alexcg y Cupón: alexcg, legibles
  durante la frase final y hasta el último fotograma. Decide su
  composición y cómo integrar la marca.

## 5. Motion graphics

Elige las técnicas de animación que mejor sirvan a tu concepto. Puedes
utilizar transformaciones, revelaciones, movimiento tipográfico,
profundidad, desplazamientos y transiciones entre objetos.

- Sincroniza los momentos importantes con la palabra o idea
  correspondiente.
- Utiliza aceleraciones y desaceleraciones cuidadas, evitando
  movimientos mecánicos o rebotes indiscriminados.
- Busca continuidad entre escenas cuando tenga sentido, sin repetir una
  única transición durante todo el vídeo.
- Alterna movimiento y estabilidad para que las composiciones se puedan
  comprender.
- No conviertas la narración en un karaoke. Muestra títulos y datos
  esenciales; deja que los gráficos cuenten el resto.
- No deformes los elementos de marca para conseguir una transición.

## 6. Efectos de sonido

Crea SFX originales mediante síntesis de audio por código. Guarda los
WAV y el código que los genera en `proyecto/audio/sfx/`.

Decide qué sonidos necesita la propuesta: acciones de interfaz,
desplazamientos, transformaciones, acentos o confirmaciones. Úsalos con
intención, no en cada palabra.

No añadas música de fondo. La voz debe ser siempre lo más fácil de
escuchar. Ajusta niveles y envolventes para evitar saturación, clics
accidentales y cortes bruscos.

Comprueba que los efectos están presentes y sincronizados en el MP4
exportado. Documenta que fueron sintetizados para este vídeo; no
presentes archivos ajenos como «sin copyright».

## 7. Implementación y formato

- Implementa la composición y su línea de tiempo en Hyperframes, y
  renderiza con Hyperframes.
- Puedes usar FFmpeg y otras utilidades como apoyo para análisis,
  síntesis, codificación y validación, no para sustituir la composición
  por un montaje hecho en otro framework.
- Entrega horizontal 1920 × 1080, 30 fps, MP4 H.264 con audio AAC.
- Conserva los recursos necesarios y registra las dependencias para
  reproducir el render. No dependas de descargas durante la exportación
  ni del reloj real para controlar las animaciones.
- Organiza los recursos adicionales y archivos de trabajo sin
  sobrescribir la narración ni el logo originales.
- Añade de manera discreta pero legible, sin cubrir el cierre:

> Sitios sujetos a uso razonable. Node.js: hasta 5 apps. IA sujeta a
  créditos y condiciones del plan.

## 8. Entregables

1. `resultado-hostinger.mp4`: vídeo final con narración y efectos de
   sonido.
2. `proyecto/`: fuentes editables, composición de Hyperframes,
   dependencias y recursos necesarios para reproducir el render.
3. `timeline.json`: escenas, tiempos, fragmentos de narración y eventos
   de sonido.
4. `REPORTE.md`: concepto elegido, versión de Hyperframes, comando real
   de render, verificaciones, procedencia de recursos adicionales,
   limitaciones, skills y subagentes utilizados, y cualquier contexto
   persistente precargado.

## 9. Verificación obligatoria

Renderiza, abre y revisa el MP4. Comprueba el principio, la mitad, el
cierre y cada cambio de escena.

Corrige pantallas vacías, recursos faltantes, textos cortados o
ilegibles, superposiciones, audio truncado, efectos demasiado fuertes y
errores de sincronización o codificación.

Comprueba con herramientas los metadatos reales de resolución, duración,
fps y pistas de audio. Confirma que Hostinger.com/alexcg y alexcg
aparecen exactamente como se proporcionaron.