10 Heurísticas de usabilidade e como aplicá-las ao design de produto

 

 

As 10 heurísticas para o design de interface do usuário foram criadas por Jakob Nielsen em 1994. Embora as heurísticas tenham sido introduzidas há mais de duas décadas, as heurísticas ainda são relevantes para o design moderno de produtos.

Nº 1: Visibilidade do status do sistema

O sistema deve sempre manter os usuários informados sobre o que está acontecendo, por meio de feedback apropriado dentro de um prazo razoável.

O que significa: não faça os usuários se perguntarem; ofereça qualquer tipo de feedback (visual, áudio, tátil) para ajudá-los a entender o que está acontecendo. É particularmente importante fornecer feedback sobre as ações iniciadas pelo usuário – nesse caso, o feedback atua como um reconhecimento para o usuário (ou seja, os usuários entendem que o sistema recebeu sua solicitação).

Exemplo: Carregando. O tempo de carregamento pode variar drasticamente dependendo do contexto e, quando os usuários não têm nenhum feedback, eles simplesmente não têm nenhuma informação se o sistema está fazendo algo ou não. O feedback alivia os temores de que o sistema não esteja respondendo.

O feedback do sistema não é necessariamente visual; pode ser áudio. Alguns produtos integram sons de forma tão natural em seus produtos, de modo que os sons se tornam parte de sua marca. Por exemplo, muitos de nós conhecem o som de inicialização do Apple Mac.

# 2: Combinação entre o sistema e o mundo real

O sistema deve falar a língua dos usuários, com palavras, frases e conceitos familiares ao usuário, ao invés de termos orientados ao sistema.

O que significa: é essencial identificar todos os lugares em seu aplicativo que podem causar confusão e redesenhá-los para torná-los evidentes para seu público-alvo. A confusão pode ser causada por termos ou conceitos não familiares. Para superar o primeiro problema, precisamos evitar jargões e usar termos familiares ao seu público-alvo. Para superar o segundo problema, precisamos contar com analogias do mundo real.

Exemplo: analogia com o mundo real. A Mercedes usa a metáfora de uma cadeira física para os controles de ajuste do banco elétrico. Ajuda os passageiros a entender como configurar o assento de acordo com suas necessidades.

Nº 3: controle e liberdade do usuário

Os usuários geralmente escolhem as funções do sistema por engano e precisarão de uma “saída de emergência” claramente marcada para deixar o estado indesejado sem ter que passar por um diálogo extenso.

O que significa: suporte para desfazer e refazer para operações do usuário

Exemplo: Desfazer ação. Quando os usuários enviam uma mensagem usando o Gmail, o serviço oferece uma caixa de diálogo de confirmação com o botão Desfazer. O botão ‘Desfazer’ permite aos usuários cancelar o envio se a mensagem foi enviada por acidente.

# 4: Consistência e padrões

Os usuários não devem se perguntar se palavras, situações ou ações diferentes significam a mesma coisa.

O que significa: esforce – se por um design consistente. Ofereça consistência ‘interna’ (consistência de decisões de design individuais em seu aplicativo) e consistência ‘externa’ (consistência com os padrões da plataforma).

Exemplo: navegação do produto. A localização de objetos de navegação cruciais deve ser consistente. A estrutura e a localização do menu de navegação devem ser as mesmas em diferentes partes do seu aplicativo / site.

# 5: Prevenção de erros

Ainda melhor do que boas mensagens de erro é um design cuidadoso que evita a ocorrência de um problema. Elimine as condições propensas a erros ou verifique-as e apresente aos usuários uma opção de confirmação antes de se comprometerem com a ação

O que significa: projete seus produtos para minimizar o número total de casos em que os usuários podem enfrentar problemas e precisarão de suporte e assistência.

Exemplo: entrada de formulário. A validação embutida em formulários pode ser usada para validar os dados em tempo real, para que o usuário não precise tocar no botão Enviar. Essa técnica é especialmente excelente para uma senha porque pode informar o que os usuários precisam alterar e por quê.

# 6: Reconhecimento em vez de lembrar

Minimize a carga de memória do usuário, tornando objetos, ações e opções visíveis. O usuário não deve ter que se lembrar de informações de uma parte do diálogo para outra. As instruções de uso do sistema devem ser visíveis ou facilmente recuperáveis ​​quando apropriado.

O que significa: ‘ Não faça os usuários pensarem’ (Steve Krug). Forneça todas as sugestões necessárias no momento em que os usuários precisarem.

Exemplo : recomendações contextuais . A sugestão de digitação na pesquisa do Google é um excelente exemplo de recomendações contextuais. Conforme o usuário começa a digitar, a Pesquisa Google sugere a consulta relevante e isso ajuda os usuários a encontrar a consulta relevante em menos tempo.

# 7: Flexibilidade e eficiência de uso

Aceleradores – não vistos pelo usuário novato – muitas vezes podem acelerar a interação do usuário experiente, de modo que o sistema pode atender tanto a usuários inexperientes quanto experientes.

O que significa: ofereça atalhos que permitem aos usuários uma interação mais eficiente com seu produto.

Exemplo: Atalhos . O Adobe XD oferece atalhos de teclado que permitirão que você use ações frequentes sem clicar no menu.

# 8: Design estético e minimalista

Cada unidade extra de informação em um diálogo compete com as unidades relevantes de informação e diminui sua visibilidade relativa.

O que significa: siga a abordagem ‘menos é mais’ em seu design. Remova todos os elementos desnecessários que não têm um impacto positivo na experiência do usuário.

Exemplo: priorize o conteúdo em vez do cromo . Produtos minimalistas focam no conteúdo e removem todos os detalhes de design visual desnecessários. O site da Apple é um excelente exemplo de minimalismo. Muitas páginas do site são centradas em um produto ou ideia em particular, o que torna mais fácil priorizar as informações.

Nº 9: Ajude os usuários a reconhecer, diagnosticar e se recuperar de erros

As mensagens de erro devem ser expressas em linguagem simples (sem códigos), indicar precisamente o problema e sugerir uma solução de forma construtiva.

O que significa: não diga apenas o fato de que os usuários enfrentam um problema, ofereça uma solução para resolvê-lo.

Exemplo: clareza e utilidade de mensagens de erro . Quando os usuários veem mensagens de erro como esta

Eles raramente sabem o que fazer a seguir. É por isso que é vital fornecer um caminho claro sobre como resolver o problema. Compare a mensagem acima com a seguinte. É evidente qual mensagem funciona melhor para os usuários.

# 10: Ajuda e documentação

Mesmo que seja melhor se o sistema puder ser usado sem documentação, pode ser necessário fornecer ajuda e documentação. Essas informações devem ser fáceis de pesquisar, focadas na tarefa do usuário, listar as etapas concretas a serem realizadas e não ser muito extensas.

O que significa: oferecer documentação útil dentro do seu produto. A documentação deve fazer parte do backlog do design do produto; deve ser um documento vivo que será atualizado regularmente.

Exemplo: ajuda e documentação no aplicativo. Monday.com oferece ajuda e suporte diretamente no produto.

Aprenda como projetar produtos melhores

As interações entre computadores e humanos devem ser tão intuitivas quanto conversas entre dois humanos. A Interaction Design Foundation ajudará você a aprender como projetar com eficiência e persuasão.

Publicado originalmente em uxpro.cc