Redesign de website com IA: experiência prática com Claude Code

O ponto de partida

AsuOs.ch é o site da minha agência digital suíça. Funciona com Next.js (App Router), Contentlayer para o conteúdo MDX, e Tailwind CSS para o design. Tecnicamente, o site funcionava. Mas quando olhava com distância, a lista do que faltava era longa.

O site estava 100% em francês, quando os meus clientes e a minha rede também falam inglês e português. Tinha acumulado 13 episódios de podcast (Tech Culture Network) sem nenhum artigo de blog associado. A navegação entre páginas era crua, sem qualquer transição nem animação. O SEO nunca tinha sido auditado a sério. E páginas de serviço essenciais como o SaaS e o Sprint simplesmente não existiam.

O tipo de backlog que empurramos de semana em semana porque "demora demasiado tempo".

O momento decisivo

Uma noite, abri o terminal e lancei o Claude Code, a ferramenta CLI da Anthropic. Não é um chatbot no navegador, mas um agente que corre diretamente no teu terminal, que lê o teu código, que compreende a tua arquitetura, e que escreve nos teus ficheiros.

Pensei: "E se atacássemos esta lista?"

8 horas depois, eis o que o git log mostrava:

Não vou mentir: ao ver estes números, eu próprio tive dificuldade em acreditar. Então, em vez de resumir tudo num único artigo, decidi contar-vos esta aventura etapa por etapa, uma por dia, esta semana.

Como funciona, concretamente?

Antes de mergulhar no detalhe das realizações, deixem-me explicar o workflow. Porque não, não carreguei num botão mágico.

O princípio

Tudo começa com uma descrição em linguagem natural. Escrevo algo como "adiciona a internacionalização com next-intl" ou "cria os artigos de blog a partir das transcrições do podcast". O Claude Code analisa então o codebase: lê os ficheiros existentes, compreende a arquitetura, identifica as dependências. Depois propõe e implementa: escrita do código, criação dos ficheiros, modificação das configurações. Do meu lado, faço review e ajusto — por vezes um detalhe a corrigir, um estilo a adaptar, uma lógica a afinar. E iteramos, cada correção é imediata, sem necessidade de relançar um ciclo completo.

É um pair programming com um colega de equipa que conhece o teu projeto, escreve a uma velocidade sobre-humana e nunca se cansa.

O que muda tudo

A diferença em relação a um simples gerador de código é o contexto. O Claude Code não gera código genérico. Sabe que o meu projeto usa Contentlayer, que as minhas rotas seguem o padrão App Router, que a minha cor primária é laranja, que os meus artigos de blog são em MDX com um frontmatter específico. Adapta tudo ao meu projeto.

O que vos espera esta semana

Cada dia, vou detalhar um projeto major desta refonte.

Amanhã, atacamos a parte mais pesada: como passámos de um site 100% francês para um site trilingue. O projeto mais massivo, aquele que tocou cada ficheiro do projeto. Quarta-feira, mostro-vos como 50 artigos de blog foram gerados a partir de transcrições de podcast. Quinta-feira, as novas páginas de serviço que não existiam. Sexta-feira, as animações e transições que dão vida ao site. Sábado, a auditoria SEO completa que apertou tudo. E domingo, o balanço final.

Começamos amanhã com a internacionalização. E acreditem, não se trata apenas de "traduzir textos"...