Cómo crear un motion graphic de marca con IA usando solo código: el prompt explicado
En este artículo comparto el prompt que usé para crear un motion graphic de 40 segundos para Retargeting Latam. Todo se hizo con código: la animación, la tipografía cinética, las transiciones y también la música y los efectos de sonido. No usé modelos de generación de imagen, video ni audio.
El prompt está listo para copiar y adaptar. Donde dice (incorpora acá tu info: …) va el dato de tu propia marca.
El prompt completo
Copia este bloque, reemplaza cada (incorpora acá tu info: …) y envíalo tal cual.
ROL Y OBJETIVO
Actúa como director de motion design y diseñador sonoro. Crea un motion graphic
publicitario para la marca (incorpora acá tu info: nombre de la marca) que explique
sus servicios y cómo ayuda a sus clientes, contado desde la idea
"si fueras nuestro cliente…". Debe ser dinámico, con juegos tipográficos, transiciones
fluidas y sonido en cada transición y efecto. Tiene que demostrar un nivel
profesional de motion design.
1. FUENTE DE CONTENIDO
- Analiza el home de (incorpora acá tu info: URL del sitio web) y extrae de ahí los
textos, servicios, cifras, casos y frases de marca. No inventes datos: si una cifra es
ambigua, no la uses y avísame.
- Mensajes que sí o sí deben aparecer: (incorpora acá tu info: frases, claims o cifras
obligatorias).
- Todos los textos en (incorpora acá tu info: idioma).
2. IDENTIDAD DE MARCA
- Colores oficiales: (incorpora acá tu info: códigos HEX y su rol, ej. color ancla,
color de acento, color de fondo oscuro).
- Tipografías: (incorpora acá tu info: familia de títulos y familia de cuerpo; adjunta
los archivos .ttf/.otf si no son de Google Fonts).
- Reglas del manual: (incorpora acá tu info: lo que está prohibido, ej. "no usar negro",
"sin sombras duras", cómo se escribe el nombre de la marca).
- Kit gráfico en Figma: (incorpora acá tu info: link de Figma en formato /design/,
con permiso de edición o duplicado en tus borradores). Úsalo para:
logo, formas, íconos, mascota (incorpora acá tu info: nombre de la mascota, si existe)
y banderas. Exporta vectores en SVG y las ilustraciones en PNG 4x con fondo transparente.
Si un recurso no existe en el kit, dibújalo por código con el mismo estilo y avísame.
3. ESTRUCTURA NARRATIVA (duración total: (incorpora acá tu info: duración, ej. 40) segundos)
1. Hook con una frase de marca: (incorpora acá tu info: frase de apertura).
2. Tres palabras de posicionamiento: (incorpora acá tu info: 3 palabras clave).
3. Pregunta puente: "Si fueras nuestro cliente, esto haríamos por tu marca:".
4. Un bloque por servicio: (incorpora acá tu info: lista de servicios). Cada servicio
con UNA idea + un juego tipográfico que "haga" lo que promete
(ej. "gasta" se tacha y gira a "rinde").
5. Presencia geográfica con protagonismo: (incorpora acá tu info: países u oficinas).
Cada país con su bandera ondeando y su nombre en grande, y un cierre con todos juntos.
6. Cifras que respalden: (incorpora acá tu info: 3 o 4 cifras reales).
7. Manifiesto: (incorpora acá tu info: frase de cierre o propósito).
8. Logo + CTA: (incorpora acá tu info: texto del botón y URL).
Usa un hilo visual que conecte el inicio con el final (ej. un elemento que aparece
al principio y termina formando parte del logo).
4. TIEMPOS DE LECTURA (obligatorio)
- Cada texto debe quedar en pantalla al menos 0,4 s por palabra + 1 s de margen.
- Las transiciones pueden ser rápidas (0,2–0,3 s); las pausas de lectura, no.
- Las cifras y los datos que se piden "con protagonismo" necesitan su propia escena.
- Si el contenido no cabe en la duración, avísame antes de recortar el tiempo de lectura.
5. ESTILO DE MOVIMIENTO
- Tipografía cinética: letras que entran con máscaras, rebote (overshoot), squash &
stretch, rodillos tipo tragamonedas, tachados y palabras que se transforman.
- Una transición distinta en cada cambio de escena (ola orgánica, iris, mosaico que se
voltea, zoom a través de una letra, cursor que se expande, etc.).
- Fondos fluidos: manchas de color de la paleta que se mueven y se funden.
- Cámara viva: pulso sutil con cada bombo, vibración, flash y aberración cromática
breves solo en los golpes fuertes.
- Desenfoque de movimiento real (acumulando sub-fotogramas), no simulado.
- Referencia de estilo: (incorpora acá tu info: video, archivo o descripción de una
pieza cuyo estilo te guste).
- Cuida que cada escena tenga un elemento gráfico fuerte, no solo texto.
6. AUDIO
- Compón y sintetiza la música desde cero, sin samples. Género y tempo:
(incorpora acá tu info: ej. electrónica pop, 120 BPM). Los cortes deben caer en el pulso.
- Arco emocional: tensión al inicio, "drop" en el primer gran golpe, groove en los
servicios, quiebre antes del cierre y resolución en el logo.
- Efectos de sonido sincronizados al fotograma: whoosh en cada transición, golpes en los
impactos, clics al tipear, tics en los contadores, un sonido propio para cada país.
- Master listo para redes: alrededor de −12 LUFS y pico máximo de −1 dBFS.
7. RESTRICCIONES
- Usa únicamente código: nada de modelos de generación de imagen, video, voz ni música.
- Los únicos recursos externos permitidos son los del kit de marca indicado arriba.
8. ENTREGABLES
- MP4 1920×1080 a 60 fps (H.264 + AAC).
- Adaptación vertical MP4 1080×1920 a 60 fps: recompuesta escena por escena, no
recortada, respetando zonas seguras de Reels/TikTok (márgenes de 90 px y texto clave
fuera del tercio inferior).
- Un archivo DECISIONES.md en (incorpora acá tu info: idioma) que explique tus
decisiones, lo que descartaste, las iteraciones realizadas y el tiempo total empleado.
- El código fuente para poder regenerar el video.
- Guarda todo en la carpeta (incorpora acá tu info: ruta o nombre de la carpeta).
9. PROCESO Y CONTROL DE CALIDAD
- Antes del render final, genera una hoja de contacto (un fotograma cada 0,5 s) y revisa
composición, legibilidad y que nada se salga del cuadro. Corrige y vuelve a revisar.
- Revisa a resolución completa al menos un fotograma por escena.
- Verifica el MP4 final: resolución, fps, cantidad exacta de fotogramas y duración.
- Mide el audio (loudness y picos) e infórmame que no lo pudiste escuchar.
- Al terminar, dime qué quedó pendiente o qué supuestos hiciste.El prompt explicado, bloque por bloque
Rol y objetivo
Le da a la IA un rol experto y una meta concreta. Pedir un «director de motion design y diseñador sonoro» activa dos disciplinas a la vez: imagen y audio.
El ángulo «si fueras nuestro cliente…» cambia el tono del video. En lugar de enumerar servicios, los muestra como beneficios para quien mira. En el video se ve en el segundo 8, cuando se tipea la pregunta en pantalla.
La frase «nivel profesional» sube la vara. Sin ella, la IA suele entregar animaciones correctas pero planas.
1. Fuente de contenido
Ancla todos los textos a una fuente real, el sitio web, y prohíbe inventar.
En el ejemplo, la cifra «+10 clientes activos» era ambigua en el sitio y por eso no se usó. Todas las frases del video («La vida es corta. El marketing tiene que funcionar.», «Crecer no es suerte. Es método.») salieron del sitio. Esa trazabilidad permite entregarle el video a un cliente sin riesgo.
Tip: si no tienes sitio web, reemplaza esta línea por un documento con los textos aprobados.
2. Identidad de marca
Evita que el video parezca de otra marca.
- Colores con rol, no solo códigos. Decir «turquesa = color ancla» o «marine = fondos oscuros» le indica a la IA cómo usar cada color, no solo cuáles son.
- Prohibiciones del manual. Pesan tanto como las reglas positivas. En el ejemplo, «no usar negro» hizo que todos los fondos oscuros fueran azul marino.
- El kit de Figma. Es el cambio más visible entre versiones: banderas oficiales, la mascota ReTi con trajes típicos de Chile y Colombia, formas orgánicas, la mano que señala y el logo «Retargeting Latam.».
Ojo con el link de Figma. Tiene que ser de tipo /design/, no /proto/, y la cuenta conectada necesita permiso de edición o tener el archivo duplicado en sus borradores. Con un link de prototipo, la IA solo ve una pantalla de inicio de sesión. Además, los planes con asiento de solo lectura tienen un límite de consultas, así que conviene exportar lo necesario de una vez.
«Si un recurso no existe, dibújalo y avísame». El kit no traía la bandera de Estados Unidos, así que se dibujó por código con la misma silueta que las demás. Esta instrucción evita que la IA se trabe o invente algo sin decirlo.
3. Estructura narrativa
Es el guion, la columna vertebral del video. En el ejemplo de 40 segundos queda así:
- 0 a 5 s · Hook: «La vida es corta.» (la frase se corta literalmente) y luego «FUNCIONAR.».
- 5 a 8 s · Tres palabras: Datos · Creatividad · Performance.
- 8 a 11 s · Pregunta puente: «Si fueras nuestro cliente, esto haríamos por tu marca:».
- 11 a 26 s · Servicios: seis servicios de 2,5 segundos cada uno.
- 26 a 33 s · Presencia geográfica: Chile, Colombia, México y Estados Unidos con sus banderas.
- 33 a 35,5 s · Cifras: 14 años, 27x ROAS, US$24,8M, 1 equipo.
- 35,5 a 38 s · Manifiesto: «No vendemos horas. Producimos decisiones mejores.».
- 38 a 40 s · Logo y CTA: logo, botón «¡Hablemos!» y ReTi saludando.
La instrucción creativa más poderosa del prompt es «una idea + un juego tipográfico que haga lo que promete». Por ejemplo, «gasta» se tacha y gira a «rinde.», unas filas de likes se transforman en clientes, y un dado (la suerte) se desarma y sus puntos forman un gráfico (el método).
El hilo visual del ejemplo es un punto turquesa. Al inicio cae y se convierte en el punto de «corta.», y al final recorre el logo y aterriza como el punto de «Latam.». Un recurso así hace que el video se sienta diseñado y no armado.
4. Tiempos de lectura
Fija una regla medible para que el público alcance a leer.
La primera versión del video duraba 15 segundos y el feedback fue: «quedó muy rápido, no se alcanza a entender». La regla de 0,4 segundos por palabra más 1 segundo de margen evita ese problema desde el primer intento.
Por ejemplo, un bloque de unas 10 palabras necesita 0,4 × 10 + 1 = 5 segundos, o menos texto. Por eso el prompt pide una sola idea por servicio.
La clave del dinamismo está en el contraste: transiciones rápidas y lectura pausada. En el video los cortes duran 0,2 segundos, pero cada frase se sostiene más de 2.
5. Estilo de movimiento
Traduce «dinámico y fluido» a técnicas concretas que la IA puede ejecutar.
El vocabulario técnico importa: overshoot, squash & stretch, máscaras, mosaico, iris. Cada término es una técnica conocida, y nombrarla da un resultado más preciso que pedir «algo bonito».
Con «una transición distinta en cada cambio», el ejemplo terminó con:
- la grieta del corte;
- el zoom a través de la O de FUNCIONAR;
- el cursor de texto que se expande hasta ser el fondo;
- la losa diagonal;
- la grilla de mosaicos;
- el iris desde un clic;
- la ola orgánica;
- el mosaico que se voltea.
La referencia de estilo puede ser un video, un archivo o una descripción. En este caso fue un documento que describía otra pieza, y de ahí salieron los fondos fluidos y la cámara que late con el bombo.
La línea «cada escena con un elemento gráfico fuerte» se agregó porque, en una versión anterior, la escena «Crecer no es suerte» se calificó como gráficamente pobre.
6. Audio
Trata el sonido como parte del relato, no como música de fondo.
- Tempo: a 120 BPM un pulso dura 0,5 segundos, así que los cortes caen justo en el ritmo.
- Arco emocional: la música sigue la misma forma del relato: tensión (el problema), drop (la solución), groove (los servicios), quiebre (el manifiesto) y resolución (el logo). En el ejemplo, la armonía empieza en tono menor y resuelve en mayor justo cuando aparece el logo.
- Efectos al fotograma: son los que hacen que el video se sienta caro. Cada letra de FUNCIONAR aterriza con un golpe, cada carácter tipeado suena y cada letra del logo es una nota de un arpegio.
- Volumen: −12 LUFS con pico de −1 dBFS es un nivel adecuado para redes sociales y no satura.
7. Restricciones
Define las reglas del desafío: todo con código, sin modelos generativos.
Aclarar que el kit de marca sí está permitido evita una contradicción, porque usar recursos de marca existentes no es «generar» contenido.
8. Entregables
Evita entregas incompletas y deja claras las especificaciones técnicas.
«Recompuesta, no recortada» es clave para la versión vertical. Si solo pides «versión vertical», la IA suele recortar el centro del video horizontal y se pierde contenido. En el ejemplo, cada escena se rediseñó: lo que iba lado a lado pasó a ir apilado, las frases largas se partieron en varias líneas y las banderas pasaron de una fila a una grilla de 2×2.
Pedir el archivo DECISIONES.md obliga a la IA a explicar su razonamiento. Para aprender, vale oro: muestra por qué se tomó cada decisión.
9. Proceso y control de calidad
Obliga a la IA a revisar su propio trabajo antes de entregar.
La hoja de contacto detectó problemas reales en el ejemplo: una leyenda ilegible sobre un fondo con texto, un número decorativo que competía con un contador y un doble contorno en textos chicos por exceso de aberración cromática.
«Infórmame que no lo pudiste escuchar» también tiene su razón: la IA no oye el audio, solo lo mide. Con esta línea lo dice en vez de afirmar que «suena bien».
De dónde salió este prompt
El video final no salió de un solo intento, sino de cuatro rondas de feedback. Cada corrección se convirtió en una instrucción del prompt optimizado:
- «Quedó muy rápido, no se alcanza a entender» (versión de 15 s) → bloque de tiempos de lectura y duración explícita.
- «La escena de Crecer es gráficamente pobre» → «cada escena con un elemento gráfico fuerte».
- «Incorpora los 4 países con banderas, deben tener protagonismo» → escena propia para cada país.
- Un archivo de referencia con las transiciones y fondos que gustaban → referencia de estilo, fondos fluidos y cámara viva.
- El link de Figma con el kit gráfico → bloque del kit con el formato de link y los permisos correctos.
- «Necesito la adaptación 9:16» → entregable vertical recompuesto, con zonas seguras.
La lección: el feedback que recibes después de la primera versión es información que podrías haber dado antes. Un buen prompt anticipa esas correcciones: duración y lectura, qué debe tener protagonismo, recursos de marca, formatos y control de calidad.
Checklist antes de enviar tu prompt
- ✔ Reemplacé todos los «(incorpora acá tu info: …)».
- ✔ El link de Figma es de tipo /design/ y tiene permisos.
- ✔ La duración alcanza para mis textos con la regla de 0,4 s por palabra + 1 s.
- ✔ Cada servicio tiene una sola idea.
- ✔ Pedí explícitamente lo que debe tener protagonismo.
- ✔ Definí los formatos de salida (16:9, 9:16 u otros).