Frontend Design skill

O que ela faz

A skill da Anthropic põe o Claude no papel de chefe de design de um estúdio cujo cliente já recusou propostas genéricas. Ele começa pelo assunto: o que é o produto, pra quem é e o que a página precisa fazer; se o pedido não diz, ele propõe e confirma com você. As escolhas visuais saem daí.

Depois faz um plano curto: de 4 a 6 cores com código, as fontes e o papel de cada uma, e o desenho do layout. Compara o plano com os vícios de página feita por IA (fundo creme com serifa, cards iguais com sombra cinza, etiqueta em maiúsculas em cima de tudo) e só programa depois de revisar.

Na construção, gasta a ousadia num ponto só e deixa o resto calmo. Garante que a tela funcione no celular, com foco de teclado visível e bom contraste, tira prints pra criticar o próprio trabalho quando o ambiente deixa e escreve os textos da tela em linguagem simples, com botão que diz o que acontece quando você clica.

Nas palavras de quem fez

Quando usar

• Criar a landing page de um produto ou serviço
• Refazer um site que ficou com cara de template
• Montar a tela de um app ou de um painel com identidade
• Quando você não tem designer e quer um ponto de vista visual

Depois de instalar, é só pedir assim

• Faz uma landing page pra minha clínica de estética em Curitiba, com cara própria
• Redesenha a página inicial do meu site, que está com cara de template
• Cria a tela de agendamento do meu app de personal trainer

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