---
url: "/es/bannerify/animation/ai-prompt-animations.md"
description: "Genera animaciones JSON listas para Bannerify y pégalas en el panel de animaciones personalizadas de Bannerify en Figma."
---

# Crear animaciones JSON con prompts de IA

> Genera animaciones JSON listas para Bannerify y pégalas en el panel de animaciones personalizadas de Bannerify en Figma.

### Tutorial en vídeo: anima y exporta banners a HTML desde Figma

En este vídeo verás cómo animar y exportar en segundos banners HTML listos para producción desde Figma.
[Embedded media](https://www.youtube-nocookie.com/embed/WDYRd9cSJcs)

## Genera el JSON de tu animación en bannerify.hypermatic.com {#generate-your-animation-json-on-bannerify-hypermatic-com}

[Video](/assets/videos/bannerify/animation/ai-prompt-animations.mp4)

1. Abre [https://bannerify.hypermatic.com](https://bannerify.hypermatic.com).
2. En la sección **Create Your Custom Bannerify Animation**, describe la animación que quieres (por ejemplo: "Elastic slide in from left with slight rotation").
3. Haz clic en **Copy Prompt to Clipboard** y pégalo en ChatGPT o Claude, o haz clic en **Open Prompt in ChatGPT** / **Open Prompt in Claude**.
4. Después, copia el fragmento JSON de la animación generada.
5. Abre tu archivo de Figma y ejecuta el plugin Bannerify.
6. Abre el panel **Custom Animations** en Bannerify.
7. Pega el JSON en el área de texto **Paste generated JSON code here**.
8. Comprueba que la animación aparece en los menús desplegables de ajustes predefinidos de animación de tu línea de tiempo.

La animación se guarda automáticamente al pegarla y puedes seleccionarla como cualquier otro ajuste predefinido en los menús de animación de las capas de la línea de tiempo.

> **Warning:** Las animaciones personalizadas se guardan en tu archivo de Figma actual. Si cambias a otro archivo de Figma, tendrás que volver a pegar el JSON allí.