13 de Abril, 2024 - Lucas da Paz
Projeto SEIA | Fiscalização
Heurísticas de Niewsien: Uma Abordagem Prática
Veja como heurísticas de usabilidade (e pouco de expertise) podem impactar um sistema.
Introdução
Em sistemas, a usabilidade da interface é crucial para garantir que os usuários possam desempenhar suas tarefas de maneira eficiente e sem frustrações. Recentemente, implementei alguma mudanças no módulo de gestão de registros de fiscalização do SEIA (Sistema Estadual de Informações Ambientais e recursos Hídricos do INEMA) com base nas heurísticas de usabilidade de Niewsien para aprimorar nosso sistema de Fiscalização. Neste post, vou demonstrar como cada uma dessas heurísticas foi aplicada no nosso projeto, destacando as melhorias específicas que elas trouxeram.
Desde a visibilidade do status do sistema até a prevenção de erros, cada diretriz foi cuidadosamente considerada para criar uma interface intuitiva e funcional. A aplicação dessas heurísticas não só melhorou a experiência do usuário, mas também aumentou a eficiência operacional e a satisfação geral com o sistema. Vou detalhar como cada heurística foi integrada no projeto (resumidamente) e os resultados alcançados com essas implementações.
Vamos explorar juntos essa jornada de design centrado no usuário? Vamos!
01.Visibilidade do Status do Sistema
O sistema deve sempre manter os usuários informados sobre o que está acontecendo, através de feedback apropriado em tempo hábil.
Antes, o sistema não informava consistentemente ao usuário quantos registros precisavam ser analisados, quantos já haviam sido verificados, onde estavam alocados os novos registros ou quais eram os registros novos, entre outros detalhes. Precisávamos de um sistema que possibilitasse um trabalho contínuo, rápido e eficiente, permitindo maior foco na observação e análise, em vez de depender da memória do usuário.
Para solucionar, criamos um sistema de notificação que informa tudo de relevante realizado pelo usuário, adicionamos caixas com cores dinâmicas e ícones de sinalização para novos registros e registros não visualizados. Além disso, unificamos a tela principal de trabalho com a tela de consulta, para que não seja necessário ir e voltar entre as páginas durante consultas.
Particularmente, não gosto de criar sistemas que se assemelham a planilhas. Prefiro usar o componente Data Table apenas quando há uma necessidade clara e um motivo justificável. Caso contrário, busco sempre alternativas mais adequadas.
02. Correspondência entre o Sistema e o Mundo Real
O sistema deve falar a linguagem dos usuários, com palavras, frases e conceitos familiares ao usuário, ao invés de termos orientados ao sistema. Seguir convenções do mundo real, tornando a informação mais natural e lógica.
Revisamos todos os textos e nomenclaturas do sistema para garantir essa compatibilidade com o dia a dia dos usuários. Como o sistema é interligado a outros, sincronizamos muitas nomenclaturas para não haver confusão como: botões com mesmo nome, fazer coisas diferentes.
Um ponto curioso foi o termo “anexar documento”, que eu considerava comum e usual. No entanto, para os usuários, não era claro. Em um dos casos, eles entendiam melhor o termo “apensar documento”. Portanto, um dos botões de “anexar arquivo” foi alterado para “apensar documento”, deixando mais clara a função para os usuários.
03. Controle e Liberdade do Usuário
Os usuários muitas vezes escolhem funções do sistema por engano e precisarão de uma “saída de emergência” claramente marcada para sair do estado indesejado sem ter que passar por um diálogo prolongado.
Houve um caso em que, logo após um registro ter sido encaminhado, percebeu-se que havia sido enviado para o setor errado. No desenho original do sistema, o remetente só poderia editar o registro se o destinatário o reenviase de volta. Para resolver esse problema, criamos uma notificação flutuante que aparece após ações importantes, permitindo que os usuários desfaçam essas ações imediatamente, evitando frustrações semelhantes.
04. Consistência e Padrões
Os usuários não devem ter que se perguntar se diferentes palavras, situações ou ações significam a mesma coisa. Siga convenções da plataforma.
Na forma anterior, os ícones eram inconsistentes, hora preenchido e hora vazado, hora reto, hora arredondado, sem um motivo aparente na decisão de uso dos mesmos. No figma, foi percebido que não havia uma biblioteca de icones, e que os mesmos eram importados para o figma na medida que havia a necessidade. Dessa maneira, criamos uma biblioteca de ícones padronizada para todas as situações e aplicamos com consistência em todo projeto.
A mesma biblioteca de ícones acabou sendo aprovada para parte principal do design system dos novos sistemas do Inema, mas essa conversa deixo pra outro momento.
05. Prevenção de Erros
Prevenir problemas antes que eles aconteçam. Eliminando condições propensas a erros ou verificando-as e apresentando aos usuários uma opção de confirmação antes de tomarem a ação.
Durante o teste aberto, não havia nenhum tipo de comunicação direta entre usuários e desenvolvedores. Todo feedback, erro ou situação específica, era primeiro identificado pelo usuário, depois esse usuário enviava um e-mail relatando os problemas para a coordenação de fiscalização, a coordenação de fiscalização entrava em contato com o dono do produto e só aí a informação chegava até nós. Esse processo era longo e recorrentemente vinha com más explicações, esquecimentos ou incertezas.
Dessa maneira, adicionamos um campo para que os usuários relatem o problema no momento em que foi identificado, assim as informações começaram a chegar mais precisas, ricas em detalhes e de maneira mais rápida.
06. Reconhecimento ao invés de Memorização
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 lembrar informações de uma parte do diálogo para outra
No sistema de fiscalização, é comum a geração de códigos e números de identificação de processos. Esses IDs são utilizados em outros sistemas, e o sistema de fiscalização precisava facilitar o transporte dessas informações. Em alguns casos, não era possível selecionar o texto, forçando o usuário a digitar manualmente o processo para depois copiá-lo com Ctrl+C.
É um fluxo comum do trabalho: Gerar o processos no Fiscalização > Ir para outro sistema dar seguimento.
Assim, nestes casos, adicionamos às notificações flutuantes um botão para copiar esses números para a área de transferência. E em casos onde era possível, adicionamos links para abrir o outro sistema na página exata.
07. Flexibilidade e Eficiência de Uso
Aceleradores — que não são vistos por usuários novatos — podem muitas vezes acelerar a interação para o usuário expert, de modo que o sistema possa atender tanto a usuários inexperientes quanto experientes. Permitir aos usuários adaptar ações frequentes.
Para flexibilidade e eficiência de uso as mudanças foram menos visuais. O sistema precisava de algumas funcionalidades, como: fechar modais pressionando ESC ou clicando fora deles, navegar entre os campos com a tecla TAB, inserir dicas-de-ferramenta ao sobrepor o mouse, entre outras. Essas interações com o teclado e mouse foram adicionadas ao sistema para tornar a usabilidade mais eficiente e mais intuitiva.
08. Ajudar Usuários a Reconhecer, Diagnosticar e Recuperar-se de Erros
As mensagens de erro devem ser expressas em linguagem clara (sem códigos), indicar precisamente o problema e sugerir uma solução construtiva.
Confesso que uma das coisas mais frustrantes é usar um sistema que apresenta um erro sem explicar o que deu errado ou onde ocorreu o erro. Tive essa experiência com o sistema de Fiscalização no primeiro dia em que tive acesso. Além de mal localizado, o retorno de erro não explicava exatamente o problema e apagava os campos já preenchidos.
“Afinal de contas, errei o usuário ou foi a senha?”
Para resolver isso, uma das telas alteradas foi a de login, que agora fornece feedback mais preciso, orientando melhor o usuário sobre o que aconteceu e o que deve ser feito. Os retornos ao usuário foram aprimorados em todo o sistema, tornando-os mais claros e específicos
E é isso galera.
Os resultados foram notáveis: a satisfação dos usuários aumentou, os erros diminuíram e a eficiência operacional foi significativamente melhorada. Espero que possa ter contribuído na demonstração de como uma abordagem centrada no usuário no design é fundamental.
Espero que esta demonstração tenha oferecido insights valiosos sobre como as heurísticas de Niewsien podem ser aplicadas em projetos similares. Continuaremos a iterar e aprimorar nosso sistema, sempre colocando a experiência do usuário em primeiro lugar.
Obrigado pela leitura!
Outros Projetos
Geobahia
Sistema SEIA Fiscalização
