WEB2 · Páginas com Claude ou Codex
Weslley Alves / Método MAC

Preencha o contexto
===================
Quero criar uma página para meu negócio. Antes de escrever ou programar, me faça as perguntas que faltam, uma por vez.

O que vendo: [produto ou serviço]
Público: [quem quero atender]
Problema que resolvo: [situação concreta]
Oferta: [o que a pessoa recebe, preço se já estiver definido e condições]
Diferencial: [o que consigo comprovar]
Provas disponíveis: [depoimentos autorizados, dados reais ou nenhuma]
Ação principal: [comprar, agendar ou falar no WhatsApp]
Link do botão: [URL correta]
Minha marca: [cores, fontes, fotos e referências]
Tom de voz: [cole 2 ou 3 exemplos de textos seus]

Não invente resultados, depoimentos, clientes ou garantias. Se faltar alguma informação, pergunte.

Escreva a página
================
Use a skill copywriting e o briefing desta conversa.
Escreva o texto da minha página: título, apoio, oferta, benefícios concretos, como funciona, dúvidas frequentes e chamada para a ação.
Defina uma ação principal e mantenha o texto em português, com o meu tom de voz.
Use somente as provas e condições que forneci. Não invente números, depoimentos, clientes ou garantias.
Mostre primeiro a estrutura e o texto. Espere minha revisão antes de criar o layout.

Monte a apresentação
====================
Use a skill frontend-design e o texto que revisei nesta conversa.
Crie a página na pasta deste projeto. Se já existir um site, siga a estrutura e a identidade dele.
Se o projeto estiver vazio, use HTML, CSS e JavaScript simples, sem dependências desnecessárias.
Organize a hierarquia: oferta clara, informações fáceis de encontrar e botão principal visível. Preserve minhas cores, minhas fotos e o meu tom de voz.
Faça a página funcionar no celular e no computador. Use imagens reais que eu fornecer; peça as que faltarem.
Abra uma prévia local e informe os arquivos criados e como visualizar. Não publique ainda.

Revise no celular
=================
Revise a página deste projeto em larguras de 390 px e 1440 px.
Confira legibilidade, contraste, hierarquia, navegação por teclado, rolagem horizontal e área de toque dos botões.
Verifique se todos os botões levam aos links corretos e se as informações correspondem ao briefing.
Se houver formulário, confira o destino dos dados. Se não existir uma integração real, identifique o formulário como demonstração; não simule um envio concluído.
Corrija os problemas encontrados e mostre o que mudou. Não publique nem envie dados de teste para terceiros.

Exemplo preenchido · serviço de arquitetura
===========================================
Exemplo fictício para testar o fluxo, sem números ou resultados reais.
Quero uma página para o Estúdio Forma, um serviço de projetos de interiores residenciais.
Público: pessoas que vão reformar um apartamento e querem entender o processo antes de contratar.
Oferta: conversa inicial para explicar as etapas, conhecer a necessidade e avaliar o escopo. Preço do projeto definido depois da análise.
Ação principal: solicitar essa conversa. Ainda não tenho um link; deixe o botão sem envio real e me peça a URL antes de publicar.
Provas disponíveis: nenhuma. Não crie depoimentos nem quantidade de projetos.
Tom: claro, próximo e profissional. Visual: tons claros, preto e um destaque amarelo discreto.
Use copywriting para propor o texto. Depois que eu revisar, use frontend-design para criar uma prévia responsiva. Faça perguntas sobre o que faltar.