Assista no YouTube: Cobrei R$20 MIL em 1 Site Feito em 5 Minutos com Claude Design
Crie 3 infoprodutos em 3 dias com Claude Code
A máquina de 5 fases + 11 skills calibradas + agentes de copy, página e tráfego. Do briefing à URL ao vivo em 20 minutos.
Última atualização: 22 de abril de 2026
Enquanto a maioria dos freelancers passa 2 semanas negociando briefing, prototipando no Figma e enviando revisão por revisão, eu coloquei um site animado, com copy de vendas, deploy e domínio no ar — em menos de 5 minutos. E cobrei R$20.000 por isso.
Não é exagero. É o que acontece quando você para de vender hora e começa a vender resultado. Claude Design + Claude Code viraram meu sistema de entrega. E neste post você vai ver o passo a passo exato.
O mercado não paga pelo seu tempo. Paga pelo resultado que você entrega. Um site que converte, que tem animações, que parece ter custado R$15k de agência — esse site existe. E agora qualquer um consegue entregar.
O custo real de fazer site do jeito antigo
Agência tradicional: R$8k a R$30k, prazo de 30 a 90 dias, 3 rodadas de revisão mínimas, reuniões semanais, Figma, aprovação de layout, handoff para dev, testes, deploy.
Freelancer intermediário: R$2k a R$8k, 15 a 30 dias, dependência de template de WordPress ou Elementor, limitação de animações, hospedagem separada.
O problema não é o preço — é o modelo. Você vende tempo. Quanto mais tempo gasta, mais "justo" parece cobrar pouco. Quanto mais rápido entrega, mais parece que "não valeu".
Claude Design quebra esse modelo. Você entrega rápido e cobra mais porque o resultado é melhor.
O sistema: Claude Design + Claude Code + Vercel
O pipeline completo tem 4 componentes:
| Componente | Função | Custo |
|---|---|---|
| Claude Design | Gera o site baseado em copy + template | Plano Pro Claude |
| Skill de Copywriting | Gera VSL/copy da página de vendas | Grátis (disponível na descrição) |
| Template Aura | Base visual animada premium | Grátis (remix) |
| Claude Code + Vercel | Deploy automático com domínio | Grátis no tier inicial |
Quatro ferramentas. Nenhuma exige que você saiba programar. O resultado compete com qualquer agência.
Como fazer na prática — passo a passo
Passo 1 — Gerar a copy da página de vendas
Antes de abrir o Claude Design, você precisa da copy. Use a skill de copywriting disponível gratuitamente na descrição do vídeo.
No Claude (claude.ai), carregue a skill em Personalizar → Habilidades → Nova habilidade e faça o upload do arquivo. Depois, no chat, descreva seu produto:
"Estou criando um produto para respostas automáticas de DM no Instagram. Concorrente do ManyChat, mas com valor mais acessível — R$37/mês."
A skill gera headline, mecanismo único, prova, garantia e CTA em menos de 2 minutos. Copie tudo.
Passo 2 — Criar o projeto no Claude Design
Acesse claude.ai → Design. Crie um novo projeto com o nome do produto (ex: "GeekFlow"). No campo describe, cole a copy gerada no passo anterior.
Aqui está o diferencial: em vez de começar do zero, você importa um template animado como code base. O site Aura oferece templates gratuitos de alta qualidade. Escolha um, exporte o HTML e faça o upload no campo Add code base do Claude Design.
Selecione o modelo Opus nas configurações para melhor qualidade de output. Clique em Generate.
Em 5 a 6 minutos, o Claude Design entrega:
- Layout completo baseado no template escolhido
- Copy da página aplicada nos blocos certos
- Animações herdadas do template
- Variações de headline (A/B/C) para testar
- Opções de esquema de cores (dark/light)
Passo 3 — Fazer handoff para o Claude Code
No canto do projeto no Claude Design, clique em Handoff to Claude Code. Isso gera um prompt automático que você copia e cola em uma nova sessão do Claude Code.
No Claude Code, cole o comando. Ele importa o projeto do Claude Design para o ambiente local, onde as skills de deploy estão configuradas.
Quando o site estiver pronto para ir ao ar, instrua o Claude Code:
"Faça o deploy na Vercel e me mande o link."
O Claude Code executa as skills de deploy, conecta ao GitHub, publica na Vercel e retorna o link — com domínio configurado — em menos de 2 minutos.
Passo 4 — Entregar e cobrar
O site está no ar. Com animações. Com domínio. Com copy profissional. Tempo total: menos de 10 minutos de trabalho real.
O que você entrega para o cliente:
- Link do site publicado
- Acesso ao repositório GitHub
- Domínio customizado (se pago pelo cliente)
- Instrução para atualizar (o próprio Claude Code faz via chat)
O que você cobra: o valor que o resultado gera para o cliente, não o tempo que você gastou.
O que esperar em termos de resultado
Sites entregues com esse pipeline têm:
- Animações CSS/JS nativas (não precisam de biblioteca extra)
- Copy otimizada para conversão desde o primeiro deploy
- Variações de headline prontas para teste A/B
- Compatibilidade total com Vercel, Netlify ou qualquer hospedagem estática
- Tempo de carregamento < 2s (sem dependências desnecessárias)
O ticket médio viável para esse serviço hoje: R$1.000 a R$5.000 por landing page para clientes que precisam de resultado rápido. Para produtos ou SaaS com faturamento alto, R$10k a R$20k é defensável quando você demonstra o processo e o resultado.
Leia também
- Claude Design: Do Briefing ao Site no Ar em 5 Minutos (Sem Designer)
- Claude Code do Zero: o Sistema que Vira Seu Sócio Executor (Sem Programação)
- Como Criar Motion Graphics com Claude Code e Remotion (1 Prompt, R$0)
FAQ
Preciso saber programar para usar Claude Design e Claude Code? Não. O Claude Design é uma interface visual — você descreve o que quer e ele gera. O Claude Code opera via chat em linguagem natural. O único pré-requisito é saber descrever seu produto com clareza.
Claude Design é gratuito? O Claude Design está disponível no plano Pro do Claude (US$20/mês). O Claude Code tem uma camada gratuita limitada e plano Pro. Ambos juntos custam menos de R$200/mês — um único projeto já paga os dois por mais de um ano.
Quanto tempo leva para aprender esse processo? O fluxo completo (copy → design → deploy) leva menos de 30 minutos para dominar. O que você vê no vídeo é exatamente o que acontece na prática, sem edições ou acelerações artificiais.
Fontes e referências
- Claude Design — Anthropic — plataforma oficial de design generativo
- Aura Build — Templates gratuitos — templates HTML animados com licença remix
- Vercel — Deploy automático — documentação oficial de deploy via GitHub
Quer estruturar toda a sua operação com Claude Code — skills, deploy, automação e funil de vendas?
O GEEK-OS é o sistema completo para operar sua empresa com Claude Code do zero ao avançado, com método, sem enrolação e por um valor simbólico.
Crie 3 infoprodutos em 3 dias com Claude Code
A máquina de 5 fases + 11 skills calibradas + agentes de copy, página e tráfego. Do briefing à URL ao vivo em 20 minutos.
Quer o sistema completo funcionando?
O GEEK-OS é o sistema operacional que a Geek Academy usa — com CLAUDE.md base, skills prontas e processo documentado para você adaptar ao seu negócio.
Acessar o GEEK-OSReceba o que funciona de verdade
Estratégias de IA e marketing digital toda semana. Sem spam, só conteúdo direto ao ponto.
Artigos relacionados
Como Criar 3 Infoprodutos em 3 Dias Usando Claude Code (A Máquina — 5 Fases)
5 fases, 11 skills, 3 produtos digitais em menos de 3 dias com Claude Code. Pesquisa de nicho, MVP, copy, página e tráfego automatizados. Custo: R$0.
Nunca Fique Sem Token: Antigravity + Codex CLI + Kilo Code + Claude Code
Acabou o token do Claude Code? Sistema com 4 ferramentas (Antigravity, Codex CLI, Kilo Code, Claude Code) para nunca parar de produzir. Setup completo 2026.
Testei Mais de 100 Skills do Claude Code: Estas 6 São as Únicas que Valem
Testei mais de 100 skills do Claude Code em 400 horas. Estas 6 são as únicas que valem: Skill Creator, Superpowers, GSD, review, Context Mode e ClaudeMem.