Apontei uma IA para um site em produção e pedi que extraísse o Design System inteiro — tokens, componentes, do's & don'ts. Em minutos, saíram 400+ linhas de documentação estruturada. Este case é sobre os parênteses no título: o que a IA acertou, o que ela inventou, e por que separar os dois ainda é trabalho humano.
Design System não morre por falta de componentes — morre por falta de documentação. Os botões existem, são bonitos, mas ninguém sabe quando usar cada variação, por que ela existe, o que fazer e o que evitar. Aí cada time decide sozinho, e a consistência que o sistema prometia evapora.
A razão é simples: documentar é a parte cara e chata, sempre adiada. Então a pergunta que move este case é: a IA consegue fazer esse trabalho? E se consegue, até onde dá para confiar?
O experimento
Alimentei a IA com o site crab.com.br e pedi a extração do Design System: paleta com roles, escala tipográfica, componentes com estados, elevação, responsividade e um guia de uso. O output foi imediato e convincente.
Estruturado, plausível, pronto para colar num Storybook. E é exatamente essa aparência de acabado que exige a segunda leitura.
Achado 1
Onde o dado é mensurável, a IA é excelente — porque está lendo CSS computado, não interpretando intenção.
Para a camada objetiva de um Design System, a IA economiza horas de transcrição manual. O problema começa quando ela precisa interpretar.
Achado 2 · O coração do case
Documentação boa esconde o acidental e mostra o intencional. A IA faz o contrário: transcreve tudo o que mede com a mesma autoridade — inclusive o que nenhum designer decidiu.
Nenhum designer definiu um botão com 0,84px de altura. Isso é o resultado do render (padding + line-height + borda) medido e arredondado, apresentado como token. Documentar isso como decisão engana quem for reconstruir o componente — o alvo real era 48px, um touch target.
A IA montou uma tabela de sombras com 4 níveis — e admite, no próprio texto, que os níveis 2 a 4 foram "inferred". Ela preencheu a lacuna para o documento parecer completo. Documentação que chuta em silêncio é mais perigosa que documentação incompleta, porque não sinaliza onde não se deve confiar.
O textarea usa raio e cor de borda diferentes de todos os outros campos. Isso é um bug de consistência — mas a IA o documentou como se fosse regra. Um Design System existe justamente para pegar esse tipo de desvio; a IA o carimbou como padrão.
A IA afirma que os contrastes "always meet WCAG AA". Afirmou — não testou. Medi:
O #748BF7, documentado como cor de link, dá 3,1:1 sobre branco — abaixo do mínimo de 4,5:1 para texto pequeno. A IA declarou acessibilidade que o próprio token viola.
Achado 3 · A curadoria
O valor não está em aceitar o que a IA gerou, nem em jogar fora. Está em corrigir — e cada correção carrega uma decisão que a IA não tinha como tomar.
height: 48.84px como token de botão
Alvo 48px (touch target mín.). O decimal é ruído de render — removido.
Textarea com 0px / #767676 documentado como regra
Marcado como bug: alinhar a 5px / #DDDDDD como o resto dos campos.
"Contrastes sempre atendem WCAG AA"
#748BF7 só para texto grande ou uso não-textual. Link pequeno → #1E73BE.
A IA documenta o que vê. O designer documenta o que se decidiu — e sinaliza o que era erro.
O insight
A IA transcreve um Design System em minutos. Mas transcrição não é documentação.Documentar é decidir o que é regra e o que é acidente — e essa decisão exige conhecer a intenção por trás do pixel. A IA não sabe que 48,84px foi um acaso, que o textarea é um bug, ou que declarar "WCAG AA" sem medir é pior que não declarar. Ela entrega o rascunho perfeito: rápido, estruturado e confiante até nos erros. O trabalho sênior não é escrever do zero — é saber onde não acreditar.
Decisões
Cores, tipografia, spacing, estados, breakpoints. Tudo que é leitura de CSS computado. É onde a IA é mais forte e o humano perde tempo.
Arredondar ruído de render, marcar inconsistências como bugs, apagar valores "inferidos" sem base. É a etapa que a IA não pode fazer sozinha.
"Quando usar / quando não usar", a razão de cada variação existir, a história das decisões. É isso que faz um time seguir o sistema em vez de só copiá-lo.
48,84px parece mais rigoroso que 48px — e é justamente o oposto. A IA confunde o que mediu com o que foi decidido.
A IA preenche lacunas ("inferred") e declara conformidade sem testar, com o mesmo tom de tudo o mais. Documentação confiante-porém-errada custa mais que documentação incompleta.
A IA normalizou o textarea inconsistente como regra. Ver que aquilo era bug — não padrão — é a função do dono do sistema.
A extração economiza horas reais. Mas o que separa transcrição de documentação — regra vs. acidente, intenção vs. render — continua sendo julgamento humano.
#748BF7 = 3,1:1 e #1E73BE = 4,94:1 sobre branco. As demais falhas (altura de render, elevação inferida, inconsistência do textarea) constam do próprio documento gerado e podem ser verificadas nele.