Si ya has diseñado uno o más frames de banner en Figma, Bannerify puede generar a partir de esos originales frames de banner nuevos en varios tamaños.
Es útil cuando ya tienes terminado un buen tamaño maestro y quieres que Bannerify cree una primera versión del resto de tamaños publicitarios estándar sin tener que rehacer a mano cada diseño desde cero.
Qué hace esta función
- Duplica en frames nuevos los frames o instancias de Figma de nivel superior que selecciones.
- Te permite elegir varios tamaños de banner estándar a la vez.
- Admite tamaños de salida personalizados.
- Si quieres, puede recolocar los textos, logotipos, CTA y gráficos para cada nueva relación de aspecto.
- No modifica tus frames de origen.
Úsalo como un atajo de producción, no como sustituto de la revisión creativa. Bannerify te deja muy cerca del resultado final en poco tiempo, y puedes hacer los últimos ajustes de diseño directamente en Figma.
Paso 1. Abre la pestaña Generate
Abre Bannerify en Figma y cambia de la pestaña habitual Load Banners from Figma Frames a la pestaña Generate New Banner Sizes from Figma Frames.
Bannerify buscará en la página actual los frames e instancias de Figma de nivel superior que se pueden usar como banners de origen.
Paso 2. Selecciona tus frames de origen
Marca el frame o los frames de origen que quieres usar como punto de partida.
Buenos candidatos son:
- diseños de banners terminados
- un buen tamaño maestro, como
300x250o1200x628 - frames con una estructura limpia y elementos bien agrupados
Bannerify genera frames nuevos a partir de los originales seleccionados; no los sobrescribe.
Paso 3. Elige los tamaños de salida
Activa los tamaños de banner que quieres generar.
La pestaña Generate incluye una serie de tamaños publicitarios habituales, como:
- Leaderboard (
728x90) - Medium Rectangle (
300x250) - Large Rectangle (
336x280) - Skyscraper (
120x600) - Wide Skyscraper (
160x600) - Half-Page Skyscraper (
300x600) - Banner (
468x60) - Square (
250x250)
Si necesitas un tamaño no estándar, introduce un ancho y un alto personalizados y haz clic en Add Custom Size.
Paso 4. Si quieres, activa el diseño inteligente
Si quieres que Bannerify adapte automáticamente el contenido de cada banner nuevo, activa:
- Auto re-layout new Figma frame content layers (BETA)
Con esta opción activada, Bannerify intentará redimensionar y recolocar el contenido de cada frame nuevo para que se adapte de forma más natural a la relación de aspecto de destino. También intenta mantener el contenido más cerca de su posición original dentro del frame, de modo que los diseños cargados hacia arriba o alineados a un borde tengan menos tendencia a desplazarse hacia el centro.
Con la opción desactivada, Bannerify seguirá creando los nuevos tamaños de frame, pero solo redimensionará el frame exterior y dejará la colocación del contenido interior más parecida a la del diseño original.
Paso 5. Haz clic en Generate
Haz clic en el botón Generate para crear los tamaños seleccionados.
Bannerify creará frames de Figma nuevos en la página, con el nombre del frame de origen más el tamaño de salida, por ejemplo:
Homepage Promo / Leaderboard (728x90)Homepage Promo / Medium Rectangle (300x250)Homepage Promo / Half-Page Skyscraper (300x600)
Qué intenta adaptar el diseño inteligente
Con la recolocación activada, Bannerify intentará:
- redimensionar y recolocar los bloques de texto
- mantener los titulares más legibles en formatos estrechos y altos, o muy bajos y anchos
- mantener el contenido situado arriba, en el centro o abajo más cerca de su posición original
- evitar reducir demasiado toda la composición cuando el nuevo tamaño tiene una relación de aspecto parecida a la original
- conservar el espaciado alrededor de las áreas de texto más anchas
- mover los elementos decorativos y las formas para adaptarlos a la nueva relación de aspecto
- mantener juntos los contenidos agrupados siempre que sea posible
- reducir los solapamientos y desbordamientos evidentes
El resultado exacto depende de la estructura del frame de origen y de la diferencia de relación de aspecto entre el tamaño original y el de destino.
Cuándo activar o desactivar la recolocación
Actívala cuando
- quieras una primera versión rápida de varios tamaños nuevos
- tu banner de origen tenga un contenido bien estructurado
- quieras que Bannerify haga el trabajo pesado antes del pulido final
Déjala desactivada cuando
- solo quieras crear rápidamente los nuevos tamaños de frame
- pienses recolocarlo todo tú a mano en Figma
- el diseño de origen sea muy personalizado y quieras un control manual exacto
Buenas prácticas para obtener mejores resultados
Obtendrás resultados más coherentes cuando tus banners de origen estén bien estructurados en Figma.
Mantén los elementos importantes como hijos directos o en grupos lógicos
Por ejemplo:
- grupo del titular
- grupo del texto principal
- grupo del CTA o del botón
- grupo del logotipo
- grupo de la imagen del producto
Así es más fácil para Bannerify identificar la función de cada elemento y recolocarlo con sentido.
Evita usar un único frame enorme y plano con capas sin relación
Si todos los elementos están sueltos en el frame raíz, sin ninguna agrupación lógica, Bannerify tiene menos información semántica con la que trabajar.
Dale al texto largo un cuadro de texto adecuado
Si tu banner contiene textos legales largos o avisos, configura la capa de texto con un ancho realista en el frame de origen.
Si el texto tiene que seguir siendo desplazable en las exportaciones HTML, consulta Capas de texto desplazable.
Usa secciones solo para banners de varias escenas
La función Generate crea tamaños nuevos a partir de frames existentes.
Si quieres combinar varios frames en una sola secuencia de banner animado, consulta Banners de varias escenas.
Después de generarlos
Los banners generados son frames normales de Figma. Puedes:
- retocar el diseño a mano
- animarlos en Bannerify
- exportarlos a HTML, GIF, MP4, WebM u otros formatos compatibles
Si más adelante actualizas el diseño de origen, vuelve a usar Generate para crear un lote nuevo.
Consejos para solucionar problemas
- Si los diseños generados necesitan demasiadas correcciones manuales, prueba a desactivar la recolocación y redimensiona las variantes a mano.
- Si los tamaños con mucho texto siguen necesitando ajustes, simplifica el diseño de origen y vuelve a generarlos.
- Si los banners generados tienen demasiado texto para los tamaños muy pequeños, acorta el texto de origen o usa patrones de texto desplazable o en ventana emergente.
- Si quieres que Bannerify trate varios frames como un solo banner, usa secciones de Figma en lugar de la función Generate.
Resumen
La función Generate es la forma más rápida de convertir uno o más banners de Figma terminados en un conjunto completo de tamaños de banner nuevos.
Selecciona tus frames de origen, elige los tamaños de salida, decide si activas Auto re-layout new Figma frame content layers (BETA) y deja que Bannerify genere los frames nuevos directamente en la página.