Ir para o conteúdo principal

Mensagens de erro

As coisas nem sempre rodam lisas, nossos sistemas podem falhar. É importante criar mensagens de erro claras, lógicas e acessíveis, que ajudem nossos usuários a resolverem seus problemas.

Entenda o problema

Antes de escrever qualquer coisa, tenha certeza de que você tem as respostas para essas questões.

  • O que aconteceu?
  • Como aconteceu?
  • Como pode ser resolvido?
  • É um erro do usuário ou do sistema?

 

Crie uma estrutura básica

Uma boa estrutura de mensagem de erro explica o que está acontecendo e o que pode ser feito sobre. Uma boa mensagem tem a seguinte estrutura:

[O erro]   [Como resolvê-lo]

Segue um exemplo de uma mensagem de erro:

Houve um problema ao sincronizar os dados.

[O erro]

Verifique a configuração do seu banco de dados e tente novamente.

[Como resolvê-lo]

 

Mantenha as Mensagens Curtas e Simples

Queremos ajudar as pessoas a resolverem os erros rapidamente, por isso mensagens de erro devem ser concisas. Remova palavras desnecessárias e mantenha apenas detalhes relevantes.

image.png

 

Seja Educado

Erros de Sistema

Desculpe-se quando for culpa do sistema e deixe os usuários saberem que a culpa não foi deles. Use a voz ativa para pegar a responsabilidade para si. Por exemplo:

image.png

 

Erros de Usuário

As vezes a culpa é do usuário, nesse caso, devemos focar na ação desejada ao invés de falar sobre o erro do usuário.

image.png

 

Informe o que Vem a Seguir

Alguns erros podem precisar de um botão ou link, para consertar ou descartar uma mensagem. Informe sempre o que vai acontecer em seguida, botões e links devem fazer sentido quando lidos de forma isolada. Evite palavras como ”OK”.

image.png

 

Design, Posicionamento e Timing.

Mensagens de erro levam toda a experiência de usuário em consideração. Deve deixar claro o que acionou a mensagem de erro e ao que ela está relacionada.

  • Validação em linha: é mais bem aplicada em campos de formulários
  • Notificações em linha: São melhor aplicados em interfaces sem campos de formulários. Eles devem estar localizados próximos a itens que afetam o recurso.
  • Modais: São melhores quando você deseja garantir atenção do usuário.