Build Awwwards Quality Sites skill

O que ela faz

Antes de programar, escreve a direção de arte: a ideia visual, a imagem principal do topo, a hierarquia das letras, as cores, a ordem das seções, o roteiro do movimento e de onde vem cada imagem. Usa as referências da pessoa só pra tirar princípios, sem copiar imagem, código nem texto.

Monta o topo como o momento mais forte da página, com abertura animada em GSAP e o texto e o botão legíveis antes da animação acabar. Escolhe um só motor de rolagem suave, Lenis ou Locomotive Scroll, e só usa Three.js quando a profundidade ou a textura servem à ideia.

Usa imagem original gerada ou licenciada, foto de verdade em avatar, ícones Solar pelo Iconify e nada de depoimento falso ou parede de logos sem prova. Cuida de quem prefere menos movimento, de quem navega pelo teclado e do celular, e no fim roda o build de produção e corrige o que quebrar.

Nas palavras de quem fez

Quando usar

• Fazer a landing page de um lançamento com cara de agência
• Montar um portfólio com movimento pra atrair cliente de design ou vídeo
• Refazer o site de uma marca que está com cara de template
• Criar uma página de campanha, editorial ou de produto com rolagem animada

Depois de instalar, é só pedir assim

• Faz uma landing page nível Awwwards pro meu curso de fotografia, com abertura animada e rolagem suave
• Cria um portfólio com movimento pra minha produtora de vídeo, com imagens originais e sem depoimento inventado
• Refaz o topo desse site com uma animação de entrada em GSAP e um efeito em Three.js, se fizer sentido

Segurança

Gen Agent Trust Hub, Socket e Snyk leem o código da skill atrás de comando perigoso, dado vazando e instrução escondida. Alerta não é reprovação: quer dizer que vale ler o que a skill faz antes de instalar.

• Gen Agent Trust HubPassou
• SocketPassou
• SnykPassou

Perguntas