Coloque Seu Site no Ar
Qualquer pessoa consegue fazer uma IA montar uma página. Quase ninguém consegue uma que pareça ter sido projetada, ou que saia da janela do chat e vá parar em algum lugar de verdade. Aqui está o caminho inteiro: decidir o que o site precisa fazer, escrever o texto primeiro, definir um visual antes de construir, montar no Claude Code, no claude.ai ou no Cowork, passar o pente-fino que mata as marcas de 'feito por IA' e publicar num domínio seu. Escolha sua trilha — portfólio, negócio local, produto ou serviços — e as quatro são suas.
Resultado real
Não são mockups. Cada um saiu dos seis passos abaixo — abra qualquer um em tela cheia.
Montando um combo? Adicione mais pacotes e economize até 15%.
Um caminho, não um monte de prompts
Escolha onde vai usar e o que vai construir. Você tem as quatro trilhas e pode trocar quando quiser — nada fica bloqueado por essa escolha.
Onde você vai usar
O que você vai construir
Passo 01
Muda conforme a trilha
Rode isto primeiro, antes de deixar o Claude chegar perto de qualquer tela. Dez minutos aqui são o que evita refazer o site três vezes.
Exemplo · Entrada
Sou motion designer, 3 anos, quase tudo freela. Quero que estúdios me contratem para aberturas.
Exemplo · Saída
Uma frase dizendo para quem é o site e a única ação que ele precisa gerar, as 4 a 6 seções em ordem, quais 3 trabalhos abrem e o que você está deixando de fora de propósito.
Passo 02
Muda conforme a trilha
Cole o briefing da etapa 1. Faça isto ANTES de qualquer design — um layout construído em cima de texto real encaixa; texto despejado num layout pronto nunca encaixa.
Exemplo · Entrada
O briefing de uma frase da etapa 1 e anotações soltas sobre cada projeto.
Exemplo · Saída
Cada linha de texto que o site precisa — título, descrição dos projetos, o parágrafo sobre você, a linha de contato — escrita no tamanho certo e pronta para colar.
Passo 03
Muda conforme a trilha
A etapa que todo mundo pula, e o motivo de os sites ficarem com cara de gerado. Rode com seu texto em mãos e guarde a saída — é o briefing que você cola em toda construção.
Exemplo · Entrada
Seu texto da etapa 2 e dois ou três sites cujo visual você admira.
Exemplo · Saída
Uma direção escrita e curta — fontes, paleta de cinco cores com códigos hex, espaçamento, como o trabalho é enquadrado — e o que está explicitamente proibido.
Passo 04
Muda conforme onde você usa
Rode isto dentro de uma pasta vazia no Claude Code. Ele monta um projeto de verdade que é seu, com os arquivos na sua máquina e histórico desde o primeiro commit.
Exemplo · Entrada
Seu texto da etapa 2 e sua direção de design da etapa 3.
Exemplo · Saída
Um projeto real na sua máquina — index.html, styles.css, um repositório git com commits limpos — construído por partes e visualizável no navegador.
Passo 05
Igual para todo mundo
Rode isto na construção pronta, no mesmo chat ou sessão. É a etapa que separa seu site de todas as outras páginas feitas por IA — não pule só porque já 'ficou bom'.
Exemplo · Entrada
Seu site construído e, se o seu Claude enxerga imagens, um screenshot dele.
Exemplo · Saída
Uma lista ordenada do que faz a página parecer gerada, cada item com a correção específica — e depois as correções aplicadas uma a uma.
Passo 06
Muda conforme onde você usa
Rode no Claude Code quando o site estiver pronto. Ele faz a checagem final, sobe para uma hospedagem de verdade com deploy automático e depois conecta seu domínio.
Exemplo · Entrada
Seu projeto pronto e se você já tem um domínio.
Exemplo · Saída
O site no ar numa hospedagem real, com deploy automático a cada push, os registros de domínio detalhados e as checagens finais registradas.