10 Heurísticas de Nielsen — do ponto de vista de uma iniciante em UI/UX design

Isabele Souza
VagasUX
Published in
7 min readOct 4, 2021

Há pouco mais de um mês, eu tenho estudado UX Design (e um pouco de UI) visando a transição de carreira na plataforma de cursos Alura. Um dos conceitos que tem chamado a minha atenção ultimamente é o das heurísticas do senhor Jakob Nielsen, considerado o pai da usabilidade. As dez heurísticas de Nielsen despertaram o meu interesse porque estão por trás do sistema de forma que eu não precise pensar no que estou fazendo. Apresento-lhes agora como eu percebo a aplicação destas enquanto interajo com o mundo digital.

<a href=”https://storyset.com/game">Game illustrations by Storyset</a>

1 — Visibilidade do sistema

O usuário precisa saber onde está. Como uma pessoa visual e ansiosa, eu preciso saber onde estou e o que posso fazer com o que tenho no momento. Em um ambiente desconhecido, é normal que eu faça uma visualização panorâmica de tudo e faça deduções do que está acontecendo antes de fazer alguma ação. Para mim, um exemplo fácil é a própria tela inicial do Google. Tem uma barra de input com uma barrinha piscando, me sugerindo algo como “escreva aqui”, uma lupa ao lado mostrando que se trata de uma pesquisa e ícones de acessibilidade, para fazer uma busca por voz ou por teclado virtual. Ainda que não conhecesse o Google, a própria dinâmica da tela me levaria a escrever qualquer coisa para saber como funciona esse conjunto visual.

2 — Compatibilidade entre o sistema e o mundo real

A própria lupa ao lado de um buscador qualquer — mas vamos pensar no Google ainda — nos recorda ao ato de procurar por algo.

Uma pasta e uma lupa são frequentemente encontradas por aí, não é?

E se pensarmos na interação de um serviço de streaming de áudios como o Spotify? Temos os mesmos ícones que nos lembram botões de um aparelho de som. Se eu digo “botão de play” para você, você consegue visualizar o que é. Essa segunda heurística se trata de ícones universais. Se você deseja sair de algo em algum sistema, você procura por algo que lembre um X. Se procura saber se algo é seguro ou não, você busca visualmente por um cadeado.

3 — Controle e liberdade para o usuário

O design de experiência do usuário — UX Design — é como o próprio nome diz: é pensando no usuário. O usuário é alguém e alguém que pode falhar e querer voltar atrás. A terceira heurística diz sobre o usuário ter essa liberdade de fazer e desfazer coisas. Seja um e-mail que foi sem anexo, seja um comando errado, o usuário vai querer voltar e reparar o erro. Essa opção de desfazer precisa estar em um sistema, de modo que o usuário se sinta confortável com as suas ações. Essa é uma heurística muito bem aplicada no Spotify, por exemplo. Eu sei que se eu apagar uma playlist e quiser tê-la de volta, eu posso entrar na minha conta pelo navegador, e acessar a função de recuperar playlists. É o Ctrl+Z com um pouco mais de trabalho, mas ainda assim fácil.

Função na barra esquerda do Spotify no navegador.

4 — Consistência e padronização

Essa é uma heurística que permeia o Design System. O usuário não pode ficar perdido enquanto interage com o sistema. Daí a estética coerente é importante: mesma família tipográfica, tamanhos iguais, padrões de cores harmônicas… Recursos que deixam o ambiente memorizável, de fácil navegação. Se trata de uma estrutura que permite que os olhos descansem e que a visualização seja focada em adquirir as informações importantes. Sobre isso, tenho como exemplo o próprio Medium. A família tipográfica, a disposição da tela, a padronização de tamanhos entre outros elementos me permite focar nos textos dos autores, em vez de gastar alguns minutos reconhecendo formas antes de ler. Pode ser que você não tenha pensado nisso antes, mas veja só: eu também não.

5 — Prevenção de erros

O Google encontra o que você quer mesmo que você escreva errado, já percebeu isso? E ele te fornece as respostas enquanto te mostra sutilmente a expressão correta que você busca, de forma que ele responde o que você quer saber e o que você não sabia que precisava saber. Uma extensão que eu utilizo no meu navegador e que é totalmente focada em prevenção de erros (e que inclusive está corrigindo várias expressões informais que dispus nesse texto) é o Language Tool. Enquanto eu escrevo, a extensão me mostra onde posso melhorar, erros ortográficos, erros de concordância, estrangeirismos e sugestões de texto. Eu aprendo a escrever, desenvolvo uma atenção maior no que escrevo e ainda posso aprender um idioma novo se quiser.

Um exemplo real do Language Tool enquanto eu escrevia este texto.

6 — Reconhecimento no lugar da memorização

O que é a Home? Te lembra uma casa, não é? Por que a barra de opções fica no lado esquerdo e por que a barra de busca geralmente fica no superior direito? Essa padronização poupa tempo para o usuário. Eu sei que posso olhar um site pela primeira vez e, se ele estiver estruturado assim, eu vou saber navegar e encontrar o que quero. Essa estrutura é o caminho das pedras que o usuário precisa. O desconhecido a princípio é rejeitado, produz um estranhamento natural. Quando o usuário se sente familiarizado com o ambiente, ele gasta mais tempo com o que importa.

7 — Flexibilização e eficiência de uso

A experiência precisa ser semelhante para um usuário habituado e para um usuário que esteja vendo o serviço pela primeira vez. Isso envolve a linguagem universal, o reconhecimento do ambiente, a padronização… todas as heurísticas já citadas — elas estão mesmo interligadas. O usuário precisa reconhecer padrões mesmo que seja a primeira vez que esteja olhando para a tela. Quão fácil é criar uma playlist no Spotify? Da mesma forma que é fácil criar uma playlist em qualquer outro serviço de streaming.

É pensando nessa heurística que, em alguns sites, os elementos se destacam conforme você vai passando o mouse, sugerindo uma ação.

8 — Estética e design minimalista

Dê uma boa olhada no Medium agora. O que você vê? Eu vejo aqui uma tela branca, com um menu de topo simples, um quadro de informações e opções à esquerda, o texto centralizado com espaçamento, fonte e tamanho confortáveis. O que você sente quando observa esta tela? Eu sinto conforto. Posso focar no texto, ler sem cansar os olhos e encontrar rapidamente o que quero. São os componentes dessa heurística. Eu não sou bombardeada de informações que não preciso. O layout é simples de modo a fazer com que o texto publicado seja o conteúdo mais importante. Uma tela cheia de informações provoca não só uma sensação de sufocamento, como deixa o usuário esquecido e perdido, sem saber o que fazer.

9— Ajuda para os usuários reconhecerem, diagnosticarem e se recuperarem de erros

É a sinalização vermelha de quando a senha não é compatível. É a sinalização de que você ainda não colocou um nome de usuário válido em um cadastro. Geralmente em vermelho porque ativa o alerta na nossa mente. A placa de Pare é universalmente vermelha por esse motivo. “Até então o seu caminho foi tranquilo, mas preste atenção nisso aqui” é o que a placa quer nos dizer.

https://www.reddit.com/r/geoguessr/comments/mpzi3j/stop_signs_around_the_world/

Você não precisa ser um hiperglota para saber o que esse sinal significa. Da mesma forma é no mundo digital. Muitas vezes não é preciso ler qual é o erro. Se o campo de ação está perfeitamente sinalizado, o usuário já saber o que consertar.

10 — Ajuda e documentação

Mesmo que tudo esteja milimetricamente organizado, sinalizado, visualmente didático para o usuário, é importante prevenir necessidades e fornecer um auxílio minucioso para aqueles que precisarem. Aonde eu encontro essa heurística? Em uma compra qualquer na Amazon, ou qualquer outro e-commerce, caso eu queira comprar com o cartão de crédito, os números do código de segurança do cartão estarão em um campo separado com um ícone específico, me indicando onde eu encontro esses números. Simples e didático. E se eu não entender ainda do que se trata, deve haver um ícone representado por um ponto de interrogação, que ao clicar me conduz para uma janela de mais informações.

Finalizando

Antes de montar um produto ou serviço que requer interação do usuário, é interessante passear pelas heurísticas de Nielsen e verificar se cada componente responde a essas indicações. O conforto durante o uso e a melhor experiência possível são potencializadores da fidelização do usuário. Enquanto estudava as heurísticas, pude identificar cada uma nos serviços que utilizo, e principalmente entender porque eu me mantenho fiel a cada um desses serviços.

Estudar UI/UX Design tem sido uma jornada de autoconhecimento e descobrimento gigante para mim. Espero que esse texto tenha transmitido um pouco dessa sensação para você também. Até breve!

--

--