MÓDULO 4.7

🎯 Case Datadog: 1 semana → 1 conversa

Ciclo async de design-review-feedback-handoff comprimido em uma única sessão live de 1h.

📸 Como uma "live design conversation" parece

À esquerda: chat ativo + canvas com design renderizado + variações geradas no painel direito (UI completa). À direita: modal de handoff para Claude Code, fechando o ciclo design → dev sem retrabalho.

UI completa com Hemlark Retreat e variações
Live design: UI inteira em uso — chat (esquerda), canvas central com mockup, variações ao lado. Toolbar Tweaks/Comment/Edit/Draw na parte superior. Fonte: siliconangle.com
Modal de handoff para Claude Code
Handoff dev: modal "Send to local coding agent" com comando pronto para colar no terminal. Bundle empacotado vai para Claude Code com contexto completo. Fonte: computingforgeeks.com
1

📊 A métrica oficial

"Uma semana de vai-e-vem entre briefs, mockups e rodadas de revisão comprimida em uma única conversa." — depoimento oficial da Datadog.

2

☁️ O que é a Datadog

Plataforma SaaS enterprise de observabilidade cloud. Dashboards complexos, data-dense, monitoramento em tempo real, alertas. Perfil extremamente difícil de design — e o caso valida que Claude Design lida com isso.

3

🔄 Live design conversations

Designer + PM + engenheiro na mesma sessão. Mudança discutida → implementada ao vivo no canvas. Todos veem o mesmo output. Elimina handoff-feedback async.

4

📋 Before/after comparativo

Fluxo antigo (5 dias)

  1. Brief escrito (1d)
  2. Designer produz mockup (2d)
  3. Review assincrono (1d)
  4. Revisão (1d)
  5. Handoff para dev (1d)

Fluxo novo (1h)

  1. Call de 1h com 3 stakeholders
  2. Designer opera canvas, outros comentam
  3. Decisões ao vivo, implementadas imediatamente
  4. Export → Claude Code no fim da call
5

🤝 Handoff para engenharia direto

No fim da call, "Export → Claude Code" empacota specs, componentes, CSS vars. Engenharia pega o bundle, não precisa de handoff doc separado. O HTML já é real (não mockup).

6

🎯 Como replicar no seu processo

Substitua design reviews async por 1 call síncrona de 1h onde todos stakeholders (designer + PM + eng) vejam o canvas ao mesmo tempo. Designer opera, outros comentam em voz alta. Decisões ao vivo. Novo ritual semanal.

🎉 Resumo (fim da Trilha 4!)

5 dias → 1h — compressão temporal enorme.
Sync > async para design — todos juntos, decisões ao vivo.
Handoff = bundle — HTML é real, não mockup.
Novo ritual: 1h call síncrona — substitui review async tradicional.

🚀 Trilha 4 concluída!

  • Tour visual pelas 6 telas principais
  • 12 landing pages em galeria
  • 10 tipos de pitch deck
  • 8 protótipos mobile
  • Case Canva, Brilliant, Datadog — validação corporativa