AI-assisted Product Design
Uso IA para sair de hipótese e chegar a produto funcional.
Compass UOL · Casas Bahia Pay
Uma prática para encurtar exploração, prototipação e passagem para engenharia, sem pular pesquisa, critério ou decisão humana.
Caso em produção
ajudaQi: redesign completo de uma experiência de atendimento.
Figma, Claude e Figma Make. Validação com a operação de atendimento e handoff para Engenharia via Figma MCP.
O redesign aconteceu dentro da modernização do backoffice, que migrava de Vue para Next.js. As frentes de Foundation, Core UMS e User Profile já foram concluídas.
Refatoração apoiada em React e ShadCN. Limitações de backend fora do escopo foram documentadas como oportunidades futuras.
Evidência visual
Um mesmo ponto da operação, antes e depois do redesign.
Telas do projeto com dados de exemplo. Nenhum dado real de cliente é exibido.
O fluxo do projeto
Onde cada ferramenta entra, e onde a decisão continua sendo humana.
- 01Figma
Exploração e interface
- 02Claude · Figma Make
Alternativas e protótipo
- 03Operação de atendimento
Validação com quem usa
- 04Figma MCP
Passagem para engenharia
- 05Engenharia
Refinamento e escopo
- 06React · ShadCN
Refatoração em produção
O processo
IA acelera a produção de alternativas. O julgamento continua sendo de produto.
- 01
Enquadrar
Problema, contexto e restrições antes de interface.
- 02
Explorar
Alternativas de fluxo e protótipo aceleradas por IA.
- 03
Validar
Pessoas da operação e tecnologia avaliam a proposta.
- 04
Entregar
Design-to-Code e handoff estruturado.
Limite técnico e decisão humana
Quando o backend não sustentava a experiência desejada, a limitação foi registrada, não escondida no protótipo.
IA pode propor, estruturar e acelerar. Pessoas avaliam evidência, impacto, restrição técnica e o que efetivamente deve entrar em produção.
Onde o tempo mudou
Quatro atividades do meu próprio fluxo de design que passaram a levar uma fração do tempo.
- Síntese de entrevistas e leitura de interface2 a 3 horascerca de 30 minutos
- Inspeção e leitura de arquivos de Figma3 horascerca de 30 minutos
- Mapeamento de tokens e preparo do handoff4 a 6 horascerca de 1 hora
- De Figma para estrutura de componente em React1 a 2 dias2 a 4 horas
Tempos observados em iniciativas selecionadas, não uma medição controlada.
Adoção dentro de Design
Prototipação com IA, Figma-to-Code, Code-to-Figma e novos fluxos de handoff.
redução estimada no tempo de delivery em iniciativas selecionadas.
Estimativa, não uma métrica absoluta. O ganho maior não foi velocidade bruta: foi menos ambiguidade entre Produto, Design e Engenharia.Disponível para oportunidades
Aberto para posições sênior e projetos selecionados.
Busco times que tratam design como parte da decisão de produto e empresas que precisam transformar problemas complexos em produtos, experiências ou operações digitais melhores.