Se você já criou um ou mais frames de banner no Figma, o Bannerify pode gerar frames de banner totalmente novos, em vários tamanhos, a partir desses originais.

Isso é útil quando você terminou um tamanho principal bem resolvido e quer que o Bannerify produza uma primeira versão dos outros tamanhos de anúncio padrão, sem precisar refazer cada layout manualmente do zero.

O que este recurso faz

• Duplica os frames ou instâncias de nível superior do Figma selecionados em novos frames.
• Permite escolher vários tamanhos de banner padrão de uma só vez.
• Aceita tamanhos personalizados.
• Pode, opcionalmente, reorganizar textos, logos, CTAs e gráficos para cada nova proporção.
• Mantém seus frames originais inalterados.

Use este recurso como um atalho de produção, não como substituto da revisão criativa. O Bannerify pode deixar você muito perto do resultado em pouco tempo, e você pode fazer os ajustes finais de design diretamente no Figma.

Passo 1. Abra a aba Generate

Abra o Bannerify no Figma e troque da aba padrão Load Banners from Figma Frames para a aba Generate New Banner Sizes from Figma Frames.

O Bannerify procura na página atual os frames e instâncias de nível superior do Figma que podem ser usados como banners de origem.

Passo 2. Selecione os frames de origem

Marque um ou mais frames de origem que você quer usar como ponto de partida.

Bons candidatos incluem:

• designs de banners finalizados
• um tamanho principal bem resolvido, como 300x250 ou 1200x628
• frames com estrutura limpa e elementos bem agrupados

O Bannerify gera novos frames a partir das origens selecionadas; ele não sobrescreve os originais.

Passo 3. Escolha os tamanhos de saída

Ative os tamanhos de banner que você quer gerar.

A aba Generate inclui um conjunto de tamanhos de anúncio comuns, como:

• Leaderboard (728x90)
• Medium Rectangle (300x250)
• Large Rectangle (336x280)
• Skyscraper (120x600)
• Wide Skyscraper (160x600)
• Half-Page Skyscraper (300x600)
• Banner (468x60)
• Square (250x250)

Se você precisa de um tamanho fora do padrão, digite uma largura e uma altura personalizadas e clique em Add Custom Size.

Passo 4. Se quiser, ative o smart layout

Se você quer que o Bannerify adapte automaticamente o conteúdo de cada novo banner, ative:

• Auto re-layout new Figma frame content layers (BETA)

Com essa opção ativada, o Bannerify tenta redimensionar e reposicionar o conteúdo de cada novo frame para que ele se encaixe de forma mais natural na proporção de destino. Ele também tenta manter o conteúdo mais próximo do posicionamento que tinha no frame original, para que layouts que começaram concentrados no topo ou alinhados às bordas tenham menos tendência a se deslocar para o meio.

Com a opção desativada, o Bannerify continua criando os novos tamanhos de frame, mas só redimensiona o frame externo e deixa o posicionamento do conteúdo interno mais próximo do layout original.

Passo 5. Clique em Generate

Clique no botão Generate para criar os tamanhos selecionados.

O Bannerify cria novos frames do Figma na página, com o nome do frame de origem seguido do tamanho de saída, por exemplo:

• Homepage Promo / Leaderboard (728x90)
• Homepage Promo / Medium Rectangle (300x250)
• Homepage Promo / Half-Page Skyscraper (300x600)

O que o smart layout tenta adaptar

Com a opção de reorganização ativada, o Bannerify tenta:

• redimensionar e reposicionar blocos de texto
• manter os títulos mais legíveis em formatos estreitos e altos ou largos e muito baixos
• manter o conteúdo concentrado no topo, no meio ou na parte inferior mais próximo da posição original
• evitar reduzir demais a composição inteira quando o novo tamanho tem uma proporção parecida com a original
• preservar o espaçamento em volta de áreas de texto mais largas
• mover elementos decorativos e formas para se encaixarem na nova proporção
• manter juntos os conteúdos agrupados, sempre que possível
• reduzir sobreposições e transbordamentos evidentes

O resultado exato depende da estrutura do frame de origem e da diferença de proporção entre o tamanho original e o tamanho de destino.

Quando ativar ou desativar a reorganização

Ative quando

• você quer uma primeira versão rápida de vários tamanhos novos
• o banner de origem tem um conteúdo bem estruturado
• você quer que o Bannerify faça o trabalho pesado antes do acabamento final

Deixe desativada quando

• você só quer criar rapidamente os novos tamanhos de frame
• você pretende reposicionar tudo manualmente no Figma
• o layout de origem é muito personalizado e você quer controle manual exato

Boas práticas para melhores resultados

Você obtém resultados mais consistentes quando os banners de origem estão bem estruturados no Figma.

Mantenha os elementos importantes como filhos diretos ou em grupos lógicos

Por exemplo:

• grupo do título
• grupo do texto principal
• grupo do CTA ou do botão
• grupo do logo
• grupo da imagem do produto

Isso ajuda o Bannerify a identificar a função de cada elemento e a reorganizá-lo de forma coerente.

Evite um único frame enorme e plano com camadas sem relação entre si

Se todos os elementos ficam soltos no frame raiz, sem nenhum agrupamento lógico, o Bannerify tem menos informação semântica para trabalhar.

Dê aos textos longos uma caixa de texto adequada

Se o seu banner tem textos jurídicos longos ou avisos legais, configure a camada de texto com uma largura realista no frame de origem.

Se o texto precisar continuar rolável nas exportações HTML, veja Camadas de texto roláveis.

Use Sections apenas para banners com várias cenas

O recurso Generate cria novos tamanhos a partir de frames existentes.

Se você quer combinar vários frames em uma única sequência de banner animado, veja Banners com várias cenas.

Depois da geração

Os banners gerados são frames comuns do Figma. Você pode:

• ajustar o layout manualmente
• animá-los no Bannerify
• exportá-los para HTML, GIF, MP4, WebM ou outros formatos compatíveis

Se você atualizar o design original mais tarde, gere um novo lote com o Generate.

Dicas de solução de problemas

• Se os layouts gerados precisarem de muitas correções manuais, desative a opção de reorganização e redimensione as variações manualmente.
• Se os tamanhos com muito texto ainda precisarem de ajustes, simplifique o layout de origem e gere de novo.
• Se os banners gerados tiverem texto demais para tamanhos muito pequenos, encurte o texto de origem ou use padrões de texto rolável ou em popup.
• Se você quer que o Bannerify trate vários frames como um único banner, use Sections do Figma em vez do recurso Generate.

Resumo

O recurso Generate é a forma mais rápida de transformar um ou mais banners finalizados do Figma em um conjunto completo de novos tamanhos de banner.

Selecione os frames de origem, escolha os tamanhos de saída, decida se vai ativar Auto re-layout new Figma frame content layers (BETA) e deixe o Bannerify gerar os novos frames diretamente na página.