AI Slop: como evitar sites com cara de IA

Todo site feito com IA hoje tem uma cara meio parecida. Já foi pior, teve uma época em que era degradê roxo com fonte padrão em todo lugar, mas mesmo com a evolução dos modelos o problema continua existindo de outra forma, mesma paleta, mesma fonte, mesmo estilo, o tipo de resultado que entrega de longe que saiu de um ou dois prompts. O problema não é ficar feio, é ficar igual, e quando fica tudo igual o cliente olha e acha que qualquer um faz a mesma coisa. Isso é o chamado AI Slop, e uso um processo de três passos pra evitar isso quando crio sites com o Claude Code.

1. Trazer bom gosto pro processo com referências visuais

O primeiro passo é escolher referências antes de escrever qualquer prompt de construção. A referência precisa fazer sentido com o projeto, uma agência de design pode pedir algo mais colorido e criativo, um escritório de advocacia pede algo mais sóbrio. Não existe uma referência certa pra todo projeto, existe a referência certa pra aquele projeto.

Pra encontrar essas referências uso alguns lugares:

• Awwwards: dá pra filtrar por categoria e visitar o site real, então serve tanto de inspiração visual quanto de referência de código.
• Dribbble: bom banco de imagens e telas, útil pra pegar ideia de composição.
• Pinterest: mais amplo, serve pra garimpar direção visual antes de fechar um estilo.
• Perfis de designers no X: tem gente que posta trabalho autoral direto na rede, e isso costuma fugir do padrão genérico. Sigo o Nate, por exemplo, que sempre traz referências que não parecem ter saído de prompt nenhum.

Minha recomendação é escolher pelo menos três referências diferentes antes de começar a construir. Isso já muda o resultado final antes mesmo de abrir o Claude Code.

2. Usar skills e MCPs que evitam o AI Slop

Com as referências em mãos, o segundo passo é dar ferramenta certa pro modelo. Duas skills ajudam bastante nisso:

• Impeccable: funciona como uma skill guarda-chuva, com sub-skills especializadas, cada uma focando em um aspecto de design. Também dá pra usar de forma mais geral. Ela carrega uma base de conhecimento sobre padrões de AI Slop e evita ativamente cair neles. Pra instalar, basta colar o link do repositório no Claude Code e pedir pra instalar.
• Taste: funciona de forma parecida, mesma lógica de instalação, e já tem uma v2 em fase experimental.

Um ponto importante, uso só uma dessas duas por projeto, nunca as duas juntas. Elas podem entrar em conflito e dar instruções contraditórias pro modelo, o que atrapalha mais do que ajuda.

Além das skills, uso o MCP do Higgsfield pra gerar imagens e vídeos customizados pro site, em vez de recorrer a banco de imagem genérico. Quem não tem acesso a isso pode usar o próprio ChatGPT pra gerar imagem também, o importante é fugir do banco de imagem padrão. Um cuidado aqui, sites muito animados, no estilo scroll storytelling, costumam ficar bonitos mas nem sempre são funcionais na prática pra vender pra cliente, então vale usar esse tipo de recurso com critério.

3. Construir por iteração, não por acerto único

O terceiro passo é o que mais muda o resultado final. Em vez de pedir uma versão só do site, peço pelo menos três versões diferentes, cada uma baseada numa referência diferente. Dá pra fazer isso em conversas separadas com o agente ou num único prompt pedindo as três versões de uma vez.

Um truque extra que uso, pego o código-fonte de um site de referência (dá pra ver isso direto no navegador, ou salvar a página) e passo esse código como contexto adicional pro Claude Code, além da referência visual. Isso ajuda o modelo a entender a estrutura real que foi usada, não só a aparência final.

Depois de gerar as versões, comparo lado a lado e escolho a que mais gostei. Só então entra a fase de acabamento, refinar essa versão escolhida usando elementos prontos de bibliotecas de componentes. Uso o 21st.dev pra isso, que tem efeito de cursor, animação e outros componentes visuais prontos. O processo é simples, copio o código do componente que quero e peço pro Claude Code integrar numa seção específica da página, o Hero, por exemplo.

Por que isso importa na prática

Evitar o AI Slop não é frescura estética, é decisão comercial. Um site com cara genérica passa a impressão de que qualquer um faz a mesma coisa, e isso prejudica direto a venda de projetos e a captação de clientes. Referência certa, skill e MCP certos, e um processo de iteração com acabamento no final, essa combinação é repetível pra qualquer projeto visual, de site institucional a aplicação web inteira.