design-ux — auditoria de usabilidade (avaliação heurística)

Quando Usar

Use esta habilidade quando precisar de uma auditoria de UX / usabilidade — avaliação heurística de UIs INTERATIVAS (não apenas polimento visual). Carregue com design quando uma UI "parece errada", "é um pé no saco de usar", é difícil de aprender, precisa de um muro de instruções, ou antes de enviar uma ferramenta/editor/aplicativo interativo. Pontua a UI RENDERIZADA contra as 10 heurísticas de Nielsen +...

Usabilidade ≠ estética. design-system/design-spatial fazem com que pareça certo; isso verifica se um novato consegue realizar a tarefa sem ser instruído como. Use sempre que uma UI "for um pé no saco de usar", precisar de um parágrafo de instruções, ou antes de enviar qualquer coisa interativa.

Regra 0 — olhos frescos, no artefato renderizado (herdado de design-spatial §1)

Nunca se autoavalie. O construtor racionaliza sua própria UI. Renderize a UI ao vivo em seu estado padrão de primeira carga (não uma captura de tela arranjada manualmente), capture um rastreamento de interação da tarefa principal e tenha um juiz separado (um subagente/VLM que NÃO a construiu) para pontuar. Uma lista descrita de mudanças não é uma auditoria — a auditoria é um juiz fresco caçando o que está errado na tela real.

O procedimento

1. Nomeie a(s) tarefa(s) principal(is) para a qual a UI existe (por exemplo, "cortar um clipe e definir sua velocidade, depois exportar"). A auditoria é relativa a estas, não à beleza abstrata.
2. Renderize o estado padrão + rastreie a tarefa. Capture a UI de primeira carga (larga E estreita — portão de overflow de design-spatial §2). Em seguida, execute a tarefa principal e capture cada etapa.
3. Pontue cada heurística (tabela abaixo) no artefato: aprovado / violação, gravidade (bloqueador / principal / secundário), um achado especificamente localizado, e uma correção concreta. Juiz separado faz isso.
4. Priorize: bloqueadores → principais → secundários; agrupe correções que tocam a mesma superfície.
5. Corrija, depois RE-RENDERIZE e RE-PONTUE. Não reivindique corrigido sem reauditar o novo artefato (regra de verificar-saídas).

Heurísticas — pontue cada uma (as 10 de Nielsen, 1994) + adições de interação

Adições de interação (compor, não repetir):

• Não me faça pensar (Krug): affordances autoevidentes; a UI se ensina. Parágrafo de instrução ⇒ dívida de affordance (liga-se a #6).
• Fitts / tempo de trânsito (design-spatial §3): controles ficam perto de onde a tarefa deixa o cursor. Propriedades de um objeto selecionado pertencem adjacentes ao objeto (dock/popover), não em um painel distante — cada edição não deve ser uma viagem de ida e volta.
• Descoberta de gestos: qualquer gesto não óbvio (roda, arrastar borda, duplo clique) precisa de uma affordance visível (alça, dica de hover, ícone) ou não existe para a maioria dos usuários.
• Correspondência de peso visual (design-spatial): a superfície que o usuário opera (linha do tempo, tela, editor) deve ser o herói visual — não uma faixa fina sob uma grande pré-visualização passiva.
• Divulgação progressiva (design-thinking UX): essenciais primeiro; avançados sob demanda. Mas divulgação ≠ esconder a ferramenta principal.

…