Três redes neurais desenharam referências web em cinco estilos: do fintech ao Web 1.0

As redes neurais estão se tornando uma ferramenta útil para designers web. O autor do blog StudyAI decidiu testar isso na prática: criou ativos web para cinco setores completamente diferentes, usando três modelos modernos de geração de imagens. Os resultados foram ambíguos.

Três modelos no teste:

Grok Image 2, Flux 2 Pro, Nano Banana Pro

O autor escolheu três modelos populares: Grok Image 2, Flux 2 Pro e Nano Banana Pro. Cada um foi solicitado a executar as mesmas tarefas: criar ativos web com requisitos precisos de estilo, paleta, tipografia e funcionalidade. Não se trata apenas de geração de imagens, mas de verificar o quão bem as redes neurais entendem os requisitos específicos de designers web.

14 exemplos em cinco setores

eSports e games (4 exemplos):

• Painel HUD para um shooter de eSports (futuristic minimalism, acentos neon ciano, PNG transparente)
• Inventário de RPG em estilo dark fantasy (molduras douradas, textura de pergaminho, inspiração em Diablo)
• Botões mobile para um quebra-cabeça casual (formas candy-like, gradientes glossy)
• Botões Web 1.0 com animação (bordas 3D em relevo, estética GeoCities, sprite sheet)

Fintech e banking (3 exemplos):

• Dashboard de exchange de criptomoedas (dark mode, candlestick charts, glassmorphism, paleta monocromática)
• Card de transferência bancária (neumorphic soft UI, bordas arredondadas de 24px, diretrizes da iOS)
• Onboarding de aplicativo de investimentos (3 telas, estilo isométrico, inspirado na Stripe)

Nostalgia Web 1.0 (1 exemplo):

• Banners GIF 468x60 como nos anos 2000 (Comic Sans, Impact, "Under Construction" piscando, estética Y2K)

Ecologia (3 exemplos):

• Dashboard de pegada de carbono (soft UI orgânica, verde sálvia, estética Patagonia)
• Cards de produtos ecológicos para marketplace (papel kraft reciclado, ilustrações botânicas)
• Rastreador mobile de reciclagem (flat lúdico, gamificação no estilo Duolingo)

Serviços de IA (3 exemplos):

• Interface de chat de assistente de IA (animação de streaming, indicador de digitação, brilho de borda em gradiente)
• Painel de controle de modelo de ML (gráficos de loss/accuracy, matriz de confusão, visualização de rede neural)
• Onboarding para gerador de imagens (campo de prompt, presets de estilo, anel de progresso)

Resultados: dois modelos se saíram muito bem, um decepcionou

O Grok 2.0 e o Nano Banana Pro mostraram boa "bagagem visual" e entregaram resultado aceitável praticamente de imediato. Ambos os modelos entenderam bem os requisitos estilísticos — do minimalismo à nostalgia, do glassmorphism à estética Y2K. Os resultados pareciam profissionais e prontos para entrar em um briefing ou até servir de base para o design final.

O Flux 2 Pro, apesar de um treinamento confiável e boa lógica de geração, cometeu erros frequentes. O trabalho com texto se mostrou especialmente problemático: o modelo chegou a escrever em um idioma não identificado algumas vezes. Isso é estranho, porque o Flux usa o princípio de alinhamento de fluxos (flow matching), que deveria lidar bem com lógica sequencial e textos escritos. Ainda assim, os erros observados foram sistemáticos.

As redes neurais mostraram boa capacidade de gerar elementos de interfaces web no estilo desejado. Com a ajuda delas, um designer pode esboçar em uma ou duas horas um conjunto completo de referências para qualquer projeto — de uma startup fintech a um site nostálgico sobre a Web 1.0. Se investir tempo na elaboração de prompts mais detalhados e reservar orçamento para uma série de gerações, é possível obter componentes prontos para um site em produção.