Como a designer principal do Claude Code constrói com IA [YouTube]

• Demonstra um workflow prático de como usar o Claude Code no desenvolvimento real de produto, adicionando diretamente um recurso de autocomplete ao Excalidraw
• Embora seja uma apresentação de uma designer, o conteúdo é praticamente um workflow de desenvolvedor, mostrando um processo centrado em CLI que inclui executar várias sessões do Claude em paralelo com worktree, criar protótipos de funcionalidades, validar no navegador e até abrir um PR
• O ponto central não é usar a IA apenas como ferramenta para escrever código no lugar da pessoa, mas inseri-la no pipeline de desenvolvimento de produto que vai de exploração de ideias → comparação de implementações → autoverificação → escrita de PR → incorporação de revisão → apoio ao merge
• O aspecto mais útil para designers é que, ao mesmo tempo em que reconhece a limitação de que o Claude ainda não faz bem julgamentos de design, mostra como criar rapidamente várias implementações e submetê-las à revisão com PRs contendo screenshots e GIFs para aumentar ao mesmo tempo a velocidade das decisões de design e o controle de qualidade
• Para desenvolvedores, o valor está em ver padrões concretos de como conectar o Claude Code ao repositório real e ao fluxo de colaboração, como /prototype, loop, modo de permissões automáticas, autoteste baseado em Chrome e automação de limpeza de código, revisão e merge de PR
• Em especial, é importante a visão de que “só porque todos podem construir algo não significa que tudo deva ser colocado em produção”; na era da IA, à medida que mais pessoas passam a conseguir produzir código, é preciso ampliar validação, revisão, participação de design e critérios de deploy por meio de sistemas automatizados
• No fim, este vídeo mostra menos como um designer programa com IA e mais como designers e desenvolvedores usam a IA como intermediária para experimentar mais rápido sem perder a qualidade do produto

---

Contexto da apresentação e palestrante

• Meaghan Choi, designer líder do Claude Code
• Já projetava produtos de CLI antes da adoção de IA, participou do design do Claude CLI e se descreve como uma "fanática por CLI"
• Ela menciona que, como os integrantes da Anthropic têm acesso contínuo às ferramentas e as usam o dia todo, existe uma cultura de buscar sem parar formas de trabalho mais otimizadas
• Esclarece que o app de desktop é mais acessível e que tudo mostrado na demo também pode ser feito igualmente no desktop app
  • A CLI é uma preferência pessoal da apresentadora, não algo que o público precise necessariamente seguir

Configuração de ambiente para trabalho paralelo e em alta velocidade

• worktree

  • Se várias instâncias do Claude forem executadas ao mesmo tempo no repositório local, elas podem sobrescrever o trabalho umas das outras e causar conflitos
  • worktree cria cópias isoladas do repositório para permitir várias tarefas em paralelo
    • Quando engenheiros deixam 4 ou 5 Claudes abertos, isso significa que duplicaram o repositório como repo1 e repo2 ou estão usando worktree
    • Ao executar claude --worktree, uma nova branch é automaticamente selecionada, o que facilita o gerenciamento e por isso é recomendado

• Opus 1M · fast mode

  • A apresentadora usa sempre Opus com 1 milhão de contexto e fast mode, embora o acesso possa ser limitado dependendo da organização
  • Ela explica que essa configuração foi usada para conduzir rapidamente a demo de 15 minutos, com alguma diferença de velocidade

• auto mode

  • Integrantes da Anthropic usam sempre auto mode, como alternativa ao modo de permissões mais restrito
  • Como um classificador detecta ações de risco, o trabalho fica muito mais rápido sem precisar aprovar repetidamente com "Yes, accept"

• Loop

  • Loop é um prompt padrão que significa "continue até terminar", fazendo a tarefa se repetir até a conclusão

Prompts e a skill de prototype

• Sem especificação de design, ela pede ao Claude apenas com o prompt simples de que quer adicionar autocomplete ao Excalidraw

• skill de prototype

  • Uma slash skill prototype criada pela própria autora com ajuda do Claude, que gera por padrão 5 (ou n) implementações para uma funcionalidade, faz preview em arquivos HTML e itera sobre elas
    • Ela enfatiza que a skill não é escrita manualmente, mas criada por prompt, dizendo que "hoje em dia ninguém escreve skill na mão"
  • Pede que o Claude escolha primeiro uma opção por conta própria e explique o motivo, comentando que é divertido ver o resultado
  • Adiciona "pesquisa online permitida"; em uma codebase de produção, teria instruído o Claude a consultar Slack, Google Docs, registros de discussão, BigQuery e outras fontes
  • Em seguida, pede a implementação da melhor opção, validação, alinhamento de estilo e geração de um PR com screenshots
    • Depois disso, o fluxo deixa de girar em torno da transcrição e passa a ser a revisão do PR com gravações da funcionalidade implementada
  • Na demo, entre várias propostas de autocomplete por abas apresentadas pelo Claude, foi escolhida a opção 2 com base na opinião do público

Três princípios de trabalho

• A maioria dos LLMs, incluindo o Claude, ainda é fraca em design, então as pessoas ainda precisam continuar envolvidas no craft e na tomada de decisão
  • Isso não é necessariamente um limite permanente, mas o workflow atual é construído sobre a premissa de que a pessoa decide o que entra no produto
• Automatizar a programação é importante, mas também é preciso delegar ao Claude tarefas não ligadas à codificação; caso contrário, não se está usando a automação da forma mais completa
• Só porque qualquer pessoa pode shipar algo não significa que tudo deva ser shipado; agora que todos podem empurrar mudanças para produção, é necessário um sistema escalável

Automação de tarefas não relacionadas à codificação

• Claude na web (cloud)

  • Usado para lidar continuamente, sem abrir sessões separadas, com centenas de pequenos ajustes de polish encontrados no app
  • Quando engenheiros reclamam que há correções demais, ela pede para fazer squash em um único PR
    • Mudanças pequenas de CSS às vezes são aprovadas automaticamente sem revisão, o que ajuda a manter o acabamento do produto

• Automação de merge de PR

  • Quase todos os integrantes mantêm o Claude sempre ativo para ajudar no merge de PR, e a apresentadora diz que não se envolve mais diretamente com CI nem com a etapa imediatamente anterior ao merge
  • simplify e code review são usados internamente para enxugar a codebase (prune); equipes de engenharia que usam IA provavelmente terão ferramentas equivalentes
  • commit push PR é um comando que executa em lote verificações internas
  • O comando para revisar PRs abertos e empurrá-los até a etapa de conclusão está embutido em uma skill
    • Ele se integra ao Slack e envia DM automaticamente para revisores de código ou para quem está de on-call; o ponto central é a integração entre várias ferramentas

• Claude no Chrome

  • O Claude abre o Chrome por conta própria para testar o comportamento, sendo recomendado como a melhor forma de autoverificação de mudanças de frontend
  • O fluxo inclui registrar screenshots em uma sequência de GIFs, publicá-los e então abrir o PR

• Rotinas agendadas (Claude code work)

  • Uma rotina programada faz scraping de mudanças de frontend em todos os repositórios
  • Ela também examina Slack, transcrições do Google Meet e Google Docs para verificar se houve participação de designer, e marca quando não houve
  • Nesses casos, revisa o design e redige como rascunho um PR de design adversarial, envia DM ao engenheiro responsável e pede colaboração com um designer
    • Como o Claude ainda é fraco em design, o recurso de DM fica desativado, o que se conecta ao primeiro princípio (LLMs ainda são fracos em design)
  • A estratégia é empurrar a automação não só para a etapa seguinte, mas para a etapa depois da próxima, deixando tudo preparado para aplicar imediatamente quando o próximo modelo for lançado

Por que isso é útil para designers e desenvolvedores

• O objetivo da apresentação é claramente elevar o nível de trabalho dos usuários do Claude Code, revelando exatamente formas de trabalho populares dentro da Anthropic
• Do ponto de vista de desenvolvimento, ela apresenta comandos e práticas concretas que aceleram o dia a dia, como trabalho paralelo com worktree, eliminação de aprovações repetitivas com auto mode e automação de merge de PR e CI
  • Ferramentas como simplify e code review, usadas na apresentação, provavelmente têm equivalentes internos em equipes de engenharia que já usam IA; ela recomenda perguntar ao parceiro de engenharia e aproveitar esses recursos
• Do ponto de vista de design, deixa claro que, partindo da premissa de que LLMs ainda são fracos em design, a pessoa continua sendo a responsável pelo craft e pela decisão, enquanto a automação atua como apoio
  • Ela propõe uma abordagem de proteger a qualidade de design por meio de sistemas, como a rotina agendada que detecta e sinaliza mudanças de frontend enviadas sem participação de designers