10 heurísticas autorais de UX/UI e exemplos do que ou não se fazer.

heurística
substantivo feminino
1.arte de inventar, de fazer descobertas; ciências que tem por objeto a descoberta dos fatos.
2. hist ramo da História voltado à pesquisa de fontes e documentos.
3. inf método de investigação baseado na aproximação progressiva de um dado problema.

Heurísticas de usabilidade consistem em boas práticas que, quando aplicadas ao design, tendem a resultar em produtos mais concisos e que oferecem melhor usabilidade e conforto visual ao usuário.

Heurísticas servem tanto para guiar o desenvolvimento do projeto quanto para avaliar as funcionalidades do produto ou serviço. O termo foi primeiramente usado por Jakob Nielsen, User Advocate (a prática de usar porta-vozes designados para facilitar a relação entre usuários e designers) e co-fundador do Nielsen Norman Group, juntamente com Don Norman.

Nielsen definiu 10 heurísticas que são usadas a rodo por designers do mundo, com objetivo de evitar erros básicos de usabilidade e agilizar o desenvolvimento do produto.

É recomendável que, além das boas práticas universais, cada equipe de design desenvolva suas próprias heurísticas, conforme a dinâmica de colaboração dos membros. Ao definir regras colaborativas, a equipe tende a desenvolver produtos que carregam a identidade e o conhecimento de cada designer, de forma que o desenvolvimento tende a ser passível de reconhecimento mais fácil de erros e a usabilidade, mais justificável.


Segue abaixo um exemplo de heurísticas autorais baseadas na análise de exemplos bons e ruins de usabilidade:

  1. Cores: priorizar preto, branco, escala de cinza e cartela de máximo 3 cores para tipografia, background, ícones e botões. As cores das imagens devem captar a atenção do usuário. O que se fazer.
  2. Skeuomorfismo morréEéu. Mantenha os efeitos visuais flat e com clareza. O que não se fazer.
  3. Evite mudanças súbitas de contraste de claridade no plano de fundo (de preto para branco, de branco para preto, por exemplo). O que não se fazer
  4. Sempre mantenha o usuário ciente de suas ações. Pode-se usar highlight em abas, animações de rolagem e/ou mouse over, etc. O que se fazer.
  5. Evite informações demais saltando na tela. O usuário está ali com um objetivo, não desvie sua atenção. O que não se fazer.
  6. Otimize espaços visuais. Se um espaço for desnecessariamente deixado em branco, o usuário terá a impressão que algo está faltando. O que não se fazer.
  7. Tópicos altos e claros. Entenda as principais necessidades do usuário no serviço prestado e as dê logo de cara. Não coloque informação demais à primeira vista, apenas o necessário para prender a atenção. Dê a opção de mais informações, caso necessário. O que se fazer.
  8. Use proporções que mostrem, por tela, mais de 1 produto ou serviço oferecido. Imagens e informações grandes demais podem tirar o senso de escolha. O que não se fazer.
  9. É importante que a experiência digital se assemelhe com a experiência oferecida como um todo pelo produto ou serviço. O que se fazer.
  10. O usuários devem ser permitidos a filtrarem o que vêem, de acordo com suas preferências. Sempre dê a opção de exibir informação. Ela pode ser baseada em preço, local, avaliações de outros usuários, distância, data e qualquer outra variável que o serviço oferece. O que se fazer.