Auditoria de Design System — Meça sua Dívida | QA Proof Skip to main content
Auditoria de Design

Descubra o quanto seu design system já se desviou

O QA Proof extrai os design tokens realmente em uso nas suas páginas no ar, mede o quanto eles são consistentes e transforma o resultado em um único Design Debt Score que você pode acompanhar.

Plano gratuito disponível · Sem cartão de crédito

Design Debt: 18%
Consistência de cores
85
Sistema tipográfico
78
Sistema de espaçamento
82
Reuso de componentes
88

Design systems se degradam uma exceção por vez

Ninguém decide ter quatorze tons de cinza e nove tamanhos de fonte. Isso acontece por causa de um prazo apertado aqui e um componente feito às pressas ali. Quando finalmente fica visível, já está espalhado por todo o código e ninguém consegue medir o tamanho do estrago.

Como funciona

1

Informe sua URL

Aponte o QA Proof para uma página no ar. Nada para instalar e sem precisar de acesso aos seus arquivos de design.

2

Os tokens são extraídos

Cores, escalas tipográficas, valores de espaçamento e padrões de componentes são lidos direto do DOM renderizado.

3

Receba seu Design Debt Score

Um número, quatro categorias detalhadas e os valores específicos que vale a pena consolidar.

O que a auditoria mede

Extração automática de tokens

Lê os valores realmente renderizados no navegador, não o que o guia de estilo diz que deveria estar lá.

Análise da paleta de cores

Revela cores quase idênticas que deveriam ser unificadas em um único token.

Análise tipográfica

Mapeia cada tamanho, peso e altura de linha em uso e confronta com uma escala coerente.

Consistência de espaçamento

Encontra as margens e paddings avulsos que ficam fora da sua escala de espaçamento.

Reuso de componentes

Destaca padrões repetidos que foram reconstruídos em vez de compartilhados.

Design Debt Score

Um único número acompanhado ao longo do tempo, para você mostrar a tendência em vez de discutir com base em impressões.

Quem usa

Responsáveis pelo design system

Transforme "o sistema está se desviando" em um número que faz seus stakeholders agirem.

Líderes de engenharia

Justifique o trabalho de refatoração com dívida medida em vez de intuição.

Times antes de um redesign

Saiba exatamente o que você está levando adiante antes de começar a reconstruir.

Perguntas frequentes

É uma porcentagem única que resume o quanto os valores em uso divergem de um conjunto coerente de tokens, calculada a partir de cores, tipografia, espaçamento e reuso de componentes. Quanto menor, melhor — e acompanhar a evolução ao longo do tempo importa mais do que o número absoluto.
Não. A auditoria lê os tokens realmente renderizados no navegador, e é por isso que ela pega desvios que uma revisão do arquivo de design deixaria passar.
Um linter confere seu código-fonte contra regras que você escreveu. Aqui medimos o que seus usuários realmente veem depois que todo override, toda cascata e todo estilo de terceiros foram aplicados.
Cada categoria lista os valores específicos que vale a pena consolidar — por exemplo, cinco tons de cinza a poucos por cento de distância entre si que deveriam ser um único token.
Cerca de 20 segundos por página.

Meça sua dívida de design

Plano gratuito, sem cartão, sua nota em cerca de 20 segundos.

Começar grátis