Agentes corroem design systems - e Figma tenta conter o drift
O problema: drift silencioso causado por agentes
Design systems raramente colapsam de forma abrupta. O que acontece é um drift gradual: agentes de IA, ao gerar componentes para cada tarefa, não consultam o sistema governado a menos que ele seja explicitamente inserido em seu contexto. O caminho mais rápido para um agente é gerar um componente novo ou puxar um de qualquer fonte, em vez de localizar e usar a versão oficial. Repetido ao longo de muitos tickets, o código se afasta progressivamente da documentação.
O aspecto mais perigoso é que a infraestrutura do sistema permanece visivelmente intacta - arquivo no Figma, biblioteca de componentes, documentação - mas ninguém volta para verificar se o produto ainda corresponde a ela.
A limitação do fluxo tradicional
O fluxo clássico de design systems opera em uma direção: fonte canônica no Figma, tokens e componentes, produto. Esse modelo pressupõe que a fonte canônica ainda é precisa. Uma vez que o drift já ocorreu, essa premissa deixa de valer.
A proposta: ferramentas de extração no Figma Console MCP
O autor adicionou ferramentas de extração de design systems ao Figma Console MCP. Elas analisam o repositório como ele realmente existe, extraem tokens e componentes do código e montam uma instância de Storybook em torno do que encontram. Em seguida, executam uma avaliação determinística para confirmar que a extração corresponde ao que está rodando em produção, não ao que documentação ou comentários afirmam. As ferramentas detectam o framework automaticamente (React, Vue, Web Components) e configuram o Storybook adequado.
O resultado não é um redesign, mas um inventário honesto: o que de fato está no produto naquele momento, independentemente de corresponder ao que o sistema documenta.
Demonstração com Rateshare
O autor testou as ferramentas contra o Rateshare, um aplicativo criado com vibe coding sem design system prévio. Ele reconhece que isso demonstra a mecânica da extração, não o problema de infecção - o Rateshare nunca teve um sistema do qual desviar. As ferramentas detectaram React, encontraram 21 componentes e executaram avaliação via Playwright, abrindo um navegador real para verificar cada componente renderizado.
O inventário revelou um conjunto pequeno de tokens (alguns tamanhos de tipo, um ícone, uma paleta semântica simples) e componentes que vão de botões e avatares até um card de feed completo com estados interativos.
Tese central
O autor argumenta que design systems se tornam mais importantes, não menos, à medida que agentes facilitam a construção rápida. Quanto mais fácil para um agente contornar o sistema, mais o sistema precisa de mecanismos para detectar quando foi contornado. Um design system que ninguém verifica contra o produto real deixa de ser um design system e passa a ser apenas documentação de algo que já foi verdade.