O que Leis da UX faz?
Um kit de ferramentas prático com 30 princípios sobre como as pessoas veem, lembram, decidem e agem — cada um traduzido em decisões que você pode tomar em uma interface real. Estas não são opiniões de estilo. Elas vêm de pesquisas em percepção e cognição, e se aplicam independentemente de plataforma, época ou tendências visuais.
Use esta skill para projetar novas UIs, diagnosticar por que uma tela existente parece estranha ou fundamentar uma decisão de design com uma razão, em vez de uma preferência.
Como realizar uma análise de UX
- Nomeie o sintoma. "Muitos botões", "parece lento", "as pessoas abandonam o formulário", "ninguém nota o CTA". Os sintomas mapeiam para princípios — o índice abaixo está organizado dessa forma.
- Selecione 1 a 3 princípios relevantes e leia a entrada completa em
reference/laws.md. Leia o mecanismo e as armadilhas, não apenas a definição — é aí que está a nuance útil. - Proponha uma mudança concreta nesta tela e cite o princípio pelo nome para que o raciocínio seja auditável. Não apenas "adicione mais contraste" — em vez disso: "Efeito Von Restorff: torne a ação principal o único botão preenchido para que ela pare de competir com os três botões fantasmas ao redor."
- Verifique conflitos. Os princípios podem se opor. Mais espaço em branco (Prägnanz) versus mais opções visíveis (descoberta). Simplicidade (Occam) tem um limite inferior (Tesler). Resolva deliberadamente; não aplique uma lei cegamente.
- Valide com usuários quando o risco for real. Esses princípios preveem comportamento bem, mas não substituem testes — o Efeito Estética-Usabilidade adverte especificamente que um design bonito pode esconder tarefas quebradas.
Os 30 princípios, organizados pelo que governam
Percepção e agrupamento visual (Gestalt) — como o olho organiza uma tela antes de alguém ler uma palavra.
- Lei da Proximidade · Lei da Região Comum · Lei da Similaridade · Lei da Conexão Uniforme · Lei da Prägnanz · Efeito Von Restorff · Atenção Seletiva · Efeito Estética-Usabilidade
Memória e atenção — o que as pessoas conseguem manter na cabeça enquanto usam sua UI.
- Lei de Miller · Memória de Trabalho · Fragmentação (Chunking) · Efeito de Posição Serial · Carga Cognitiva · Efeito Zeigarnik · Regra do Pico e do Fim (Peak-End Rule)
Tomada de decisão — como as escolhas são feitas e onde travam.
- Lei de Hick · Excesso de Opções (Choice Overload) · Viés Cognitivo · Navalha de Occam · Princípio de Pareto
Interação e desempenho — velocidade, esforço, movimento, momentum.
- Lei de Fitts · Limiar de Doherty · Fluxo (Flow) · Efeito da Meta-Gradiente (Goal-Gradient Effect) · Lei de Parkinson
Expectativas e modelos mentais — o que as pessoas assumem antes mesmo de chegar.
- Lei de Jakob · Modelo Mental · Paradoxo do Usuário Ativo · Lei de Postel · Lei de Tesler
Índice — use quando…
| Princípio | Use quando… |
|---|---|
| Efeito Estética-Usabilidade | Você precisa saber por que um design mais bonito é avaliado como "mais fácil" — e por que isso é uma armadilha. |
| Excesso de Opções | Muitas opções fazem as pessoas congelarem, decidirem pior ou desistirem. |
| Fragmentação (Chunking) | Conteúdo denso ou strings longas precisam de agrupamento para serem escaneáveis. |
| Viés Cognitivo | Decisões se desviam do "racional" — enquadramento, padrões, ancoragem, confirmação. |
| Carga Cognitiva | A interface exige que o cérebro segure ou processe muita coisa de uma vez. |
| Limiar de Doherty | Algo parece lento; respostas passam de ~400ms; você precisa de estados de carregamento. |
| Lei de Fitts | Dimensionar e posicionar botões, links e alvos de toque. |
| Fluxo (Flow) | Manter as pessoas imersas; equilibrar desafio e habilidade; eliminar atrito. |
| Efeito da Meta-Gradiente | Motivar conclusão; progresso que acelera perto do fim. |
| Lei de Hick | O tempo de decisão aumenta com o número e a complexidade das escolhas. |
| Lei de Jakob | Usuários esperam que sua UI se comporte como todas as outras que conhecem. |
| Lei da Região Comum | Agrupar com bordas, cartões, fundos, contêineres. |
| Lei da Proximidade | Agrupar apenas com espaçamento — o que está próximo é lido como relacionado. |
| Lei da Prägnanz | Reduza a complexidade visual; o olho prefere a leitura mais simples. |
| Lei da Similaridade | Aparência semelhante implica função semelhante (links vs. texto simples). |
| Lei da Conexão Uniforme | Conecte itens relacionados com linhas, molduras, contêineres compartilhados. |
| Modelo Mental | Corresponda à forma como os usuários já acreditam que a coisa deve funcionar. |
| Lei de Miller | A memória de trabalho é pequena (~7±2 fragmentos); fragmente — mas não limite demais. |
| Navalha de Occam | Remova todo elemento que não está ganhando seu lugar. |
| Paradoxo do Usuário Ativo | As pessoas não leem documentação; ensine no contexto, inline, no momento certo. |
| Princípio de Pareto | Concentre esforço nos ~20% dos recursos que geram ~80% do valor. |
| Lei de Parkinson | Tarefas se expandem para preencher o tempo; encurte etapas, preencha automaticamente, defina expectativas. |
| Regra do Pico e do Fim | Projete intencionalmente o momento mais intenso e o final. |
| Lei de Postel | Aceite entradas bagunçadas generosamente; emita saídas limpas e previsíveis. |
| Atenção Seletiva | As pessoas filtram coisas; evite cegueira de banners e cegueira à mudança. |
| Efeito de Posição Serial | Primeiro e último itens ficam na memória; coloque ações-chave nas extremidades. |
| Lei de Tesler | Alguma complexidade é irredutível — deixe o sistema carregá-la, não o usuário. |
| Efeito Von Restorff | Torne a única coisa importante visivelmente distinta (sem fingir ser um anúncio). |
| Memória de Trabalho | Apoie reconhecimento em vez de lembrança; mantenha estado entre telas. |
| Efeito Zeigarnik | Tarefas inacabadas prendem a atenção; use dicas de progresso para puxar a conclusão. |
Combinações prontas
- Despoluir uma tela cheia → Navalha de Occam + Lei da Proximidade + Lei de Miller.
- Eliminar um fluxo que parece lento → Limiar de Doherty + Efeito da Meta-Gradiente + UI otimista.
- Corrigir um novo recurso confuso → Lei de Jakob + Modelo Mental + Paradoxo do Usuário Ativo.
- Resgatar um formulário abandonado → Lei de Hick + Lei de Parkinson + Lei de Postel + dicas de progresso (Zeigarnik / Meta-Gradiente).
- Aprimorar uma página de destino → Efeito Von Restorff + Atenção Seletiva + Efeito de Posição Serial + Regra do Pico e do Fim.
As entradas completas — mecanismo, como aplicar, armadilhas e um exemplo real cada — estão em reference/laws.md.