Os 10 princípios gerais do design de interação

Tempo de leitura: 8 minutes

Loading

25 anos atrás, Jakob Nielsen descreveu os 10 princípios gerais do design de interação. Esses princípios foram desenvolvidos com base em anos de experiência no campo da engenharia de usabilidade e se tornaram regras básicas para a interação humano-computador.

Hoje, eles são tão relevantes quanto eram naquela época. Eles podem ajudar a economizar tempo considerável das equipes de desenvolvimento durante os primeiros testes de usabilidade, para que possam direcionar sua atenção para desafios de design mais complexos. Além disso, também vale a pena usá-los como uma lista de verificação ao projetar um novo produto ou recurso.

1. Visibilidade do status do sistema
As pessoas adoram manter as coisas sob controle e só então podem se sentir seguras. Do ponto de vista evolutivo, a necessidade de segurança e de necessidades fisiológicas (como comida, sono e sexo) nos ajudaram a sobreviver. A sensação de controle pode ser evocada fornecendo informações sobre o status do sistema e feedback após cada interação.

Dê uma olhada no seu smartphone. Logo depois que a tela acende, ele informa sobre bateria, conexão wi-fi, mensagens recebidas, chamadas perdidas e muito mais. Imagine como você se sentiria inseguro se essas informações estivessem ausentes. Ao utilizar sinais, ícones e indicadores, o sistema comunica seu status e ajuda o usuário a tomar decisões melhores e mais informadas.

Quando as pessoas interagem com qualquer sistema, ele sempre deve fornecer feedback imediato sobre a interação. Cada um de nós foi exposto por uma experiência ruim no passado, o que nos deixou céticos e desconfiados a priori. Apenas um sinal visual como a mudança da cor do botão, um botão giratório de carregamento ou uma animação de um ícone pode ajudar o usuário a entender o que está acontecendo e evitá-lo de outras interações desnecessárias.

2. A correspondência entre o sistema e o mundo real
As pessoas estão abordando cada novo sistema com um modelo mental em mente. Em outras palavras, as pessoas presumem como o sistema poderia funcionar com base em sua experiência com outros sistemas semelhantes. Usando uma linguagem com a qual eles estão familiarizados, você pode ajudar os usuários a superar a estranheza inicial.

Um exemplo extremo é um projeto de skeuomorfismo, que transfere todos os detalhes de objetos do mundo real para o software. No início da adoção do smartphone, ajudou as pessoas a aprender como usar seus novos companheiros por meio da estética e dos processos com os quais estavam familiarizados antes.

Ótimos exemplos de ícones de correspondência do mundo real

Mesmo no mundo minimalista de hoje, dezenas de pistas de design persistiram daquela época: aplicativos como a bússola, a calculadora, ou componentes de design como pastas, botões de alternância ou ícones de cadeado. Além disso, a linguagem e os conceitos do mundo real ajudam os usuários a compreender facilmente o sistema. É por isso que o aplicativo para armazenamento de cartões é chamado de “Carteira”, estamos usando “Favoritos” para salvar nossos sites favoritos, usamos a “Lixeira” para remover arquivos antigos ou o “Carrinho de compras” ao fazer compras online.

3. Controle e liberdade do usuário
As pessoas costumam interagir com o sistema com pressa e, muitas vezes, nem mesmo estão totalmente concentradas. Isso resulta em coisas como cliques errados ou outros acidentes que podem ser frustrantes. Imagine uma situação que envolva algo como a exclusão acidental de um arquivo importante ou a publicação de um erro gramatical nas redes sociais de sua empresa; todo sistema deve ter um mecanismo de “saída de emergência” claramente marcado, que forneça aos usuários um caminho fácil de volta depois de se encontrarem em um estado indesejado.

“Cada sistema deve ter uma saída de emergência desobstruída.”

Uma saída de emergência apropriada pode ser algo tão simples como uma seta para trás (por exemplo, em um navegador), uma lixeira, que nos protege contra exclusão acidental, ou o botão “desfazer”, que permite ao usuário reverter a última ação. Todos esses exemplos demonstram sistemas que não decepcionam os usuários quando cometem um erro e, em vez disso, permitem que o usuário corrija

4. Consistência e padrões
Você já notou que a funcionalidade de copiar e colar funciona exatamente da mesma forma, não importa qual aplicativo você está usando? E quanto ao fato de que você pode acessar sua tela inicial simplesmente deslizando para cima a partir da borda inferior? Esses são apenas dois padrões de usabilidade que a Apple usa para tornar seu sistema consistente e previsível para os usuários. Um sistema compreensível nunca deve confundir os usuários usando palavras, imagens ou ações diferentes para os mesmos conceitos.

“Não se esqueça de que as pessoas passam 90% do tempo interagindo com outros aplicativos.”

Um bom ponto de partida para um sistema de design consistente de seu aplicativo móvel são as Diretrizes de interface humana da Apple e as Diretrizes de design de materiais do Google. Eles apresentam uma base sólida que descreve componentes de design importantes com muitos exemplos. Ao projetar seu novo aplicativo, nunca se esqueça de que as pessoas passam 90% do seu tempo interagindo com outros aplicativos, portanto, o uso de práticas recomendadas e padrões comuns acabará resultando em uma experiência geral muito melhor. A consistência é um dos maiores contribuintes para a usabilidade.

5. Prevenção de erros
Com base no livro de Don Norman, The Design of Everyday Things, existem dois tipos de erros criados pela interação com uma interface de usuário: deslizes e erros. Os deslizes acontecem quando o usuário tende a realizar uma ação, mas devido à baixa atenção, realiza outra (por exemplo, ao realizar uma tarefa conhecida). A estratégia para evitar que os usuários sofram um deslize é minimizar a chance de sua ocorrência, orientando-os apenas pelas áreas seguras. Use restrições que não permitem que um usuário defina um valor errado (por exemplo, quando você espera um número, não permita escrever as letras), sugira as opções mais comuns para tornar a escolha fácil para os usuários (por exemplo, durante a pesquisa), ou use caixas de diálogos de confirmação antes de ações destrutivas.

Prevenção de deslizamento inteligente no aplicativo da web do gmail. Infelizmente, o aplicativo móvel não possui esse recurso.

Os erros geralmente são causados ​​pelo modelo mental incorreto de um usuário de como o sistema funciona. Nesse caso, o usuário entende mal a comunicação e conscientemente executa uma ação que leva a um resultado diferente do pretendido. Esses tipos de erros nem sempre são fáceis de corrigir e devem ser revelados durante a fase de teste do usuário. Use uma comunicação clara e um sistema de design consistente para evitar erros.


6. Reconhecimento em vez de lembrar
Existem dois tipos de recuperação de memória: reconhecimento e recuperação [5]. O reconhecimento acontece quando você reconhece facilmente uma pessoa ou um objeto com o qual está familiarizado. É uma forma muito superficial de recuperação da memória e não requer nenhum trabalho. A recordação acontece quando você precisa encontrar informações raramente utilizadas em sua memória (nomes, anos, detalhes, etc.). Para relembrar informações, as pessoas precisam ativar mais blocos de memória. Portanto, o processo de recall é uma recuperação mais profunda e requer mais trabalho. (É por isso que as perguntas de múltipla escolha nos testes são muito mais fáceis de responder do que as perguntas de resposta aberta.)

Uma boa interface de usuário não exige que o usuário se lembre com frequência. Em vez disso, oferece todas as opções e informações necessárias para fazer uma escolha. É muito mais fácil escanear rapidamente os ícones ou um menu de texto e selecionar um recurso cobiçado do que tentar recuperá-lo de sua memória e, em seguida, escrevê-lo em alguma interface de texto semelhante a um terminal. Dê aos usuários dicas para lembrar informações e forneça um ícone ao lado do nome do recurso ou use uma cor específica para funções relacionadas. Uma arquitetura de informação bem projetada também ajuda na busca por informações.

Os usuários que não estão familiarizados com a sintaxe dos comandos do terminal não podem realizar uma operação tão fácil quanto abrir ou excluir o arquivo.

 

7. Flexibilidade e eficiência de uso
Cada usuário é único; cada um tem suas próprias necessidades e habilidades diferentes. Da mesma forma, cada tarefa é única e requer controladores diferentes.
Organize a tela e torne o aplicativo mais fácil de navegar. O aplicativo deve sempre exibir apenas elementos e comandos de IU relevantes. Veja aplicativos como Apple Pages ou G-Drive; quando você está escrevendo um documento, você vê apenas alguns controladores relacionados à edição de texto. Mas quando você decide adicionar um gráfico extra, aparece uma nova paleta de recursos especificamente selecionada para ajudá-lo a completar esta tarefa.

Atalhos avançados do Photoshop


Não se esqueça dos profissionais e usuários avançados em geral! Um novo usuário que está entrando em uma curva de aprendizado sempre terá necessidades diferentes do profissional que está usando algumas horas todos os dias. Usuários avançados podem apreciar opções avançadas, atalhos ou até mesmo capacidade de extensão e personalização da interface do aplicativo. Os usuários avançados precisam economizar seu tempo e executar tarefas com rapidez, mas também com precisão e confiabilidade. Uma boa interface de usuário deve oferecer funcionalidade apropriada para usuários inexperientes e experientes.

8. Design Estético e Minimalista
O minimalismo não é apenas uma moda dos últimos anos, mas certamente é uma tendência duradoura com o objetivo de reduzir a descrição de um assunto apenas aos seus elementos necessários. Ele tem muitas aplicações em arte, música e literatura. O minimalismo ajuda os usuários a acessar rapidamente informações importantes e chegar ao resultado rapidamente.

“A perfeição é alcançada, não quando não há mais nada a acrescentar, mas quando não há mais nada a tirar.” – Antoine de Saint-Exupéry

Para deixar o conteúdo restante se destacar, você não pode usar nada além de espaços em branco. Ajuda a aumentar a legibilidade do conteúdo, destaca chamadas para ações e cria um visual equilibrado e agradável [8]. Um design mínimo usa apenas as cores necessárias para apoiar a hierarquia visual. Pense no propósito e significado de cada cor. Use-o de forma consistente.

9. Ajude os usuários a reconhecer, diagnosticar e recuperar de erros
Erros e problemas de qualquer tipo podem ser frustrantes para o usuário. Especialmente quando são mal projetados e comunicados. Quer queiramos ou não, os usuários sempre tendem a se colocar em situações das quais precisam encontrar uma saída. Para minimizar a frustração, devemos nos esforçar tanto para projetar a experiência de erro quanto para o resto do sistema.

Mau exemplo de mensagem de erro que não é clara nem útil para o usuário.


Cada mensagem de erro deve ser o mais explícita e precisa possível. Ninguém quer ler mensagens vagas como “algo deu errado”. Declare o que aconteceu em uma linguagem humana legível. Mensagens como “Erro de classe 372” são igualmente absurdas. Dê ao usuário alguns conselhos construtivos sobre o que fazer a seguir. Proponha a solução ou encaminhe o usuário a um funcionário do suporte ao cliente que possa cuidar da situação. A última regra das boas mensagens de erro é a educação. Nunca culpe o usuário ou insinue que ele é estúpido.

10. Ajuda e documentação
Cada aplicativo deve se esforçar para ser perfeitamente utilizável sem qualquer documentação, mas como mencionamos antes, cada usuário tem diferentes habilidades e diferentes níveis de conhecimento, e o que é fácil para 90% dos usuários pode ser difícil para os 10% restantes. Documentação, perguntas frequentes e tutoriais bem escritos podem ser cruciais para manter o usuário atordoado.

A documentação deve ser bem estruturada, escrita em linguagem humana e minimalista. Às vezes, os usuários não precisam de muita documentação; uma simples coachmark mostrando como o novo recurso funciona ou um breve guia de integração que explica o básico é o suficiente. Aplicativos como Trello, Slack e Duolingo estão fazendo um ótimo trabalho na integração de seus usuários.

Autor: Michal Langmajer
Fontes: https://www.nngroup.com/articles/ten-usability-heuristics/
https://www.interaction-design.org/literature/article/heuristic-evaluation-how-to-conduct-a-heuristic-evaluation
http://www.gdrc.org/decision/info-decision.html
https://homepages.cwi.nl/~steven/sigchi/bulletin/1997.4/karn.html

Fernando Giannini

Pesquisador de tecnologia aplicada à educação, arquiteto de objetos virtuais de aprendizagem, fissurado em livros de grandes educadores e viciado em games de todos os tipos. Conhecimentos aprimorados em cursos de grandes empresas de tecnologia, principalmente no Google Business Educational Center e Microsoft. Sócio-proprietário da Streamer, empresa que alia tecnologia e educação. Experiência de 18 anos produzindo e criando objetos de aprendizagem, cursos a distância, design educacional, interfaces para sistemas de aprendizagem. Gestor de equipe para projetos educacionais, no Ensino Básico, Médio e Ensino Superior. Nesse período de trabalho gerenciou equipes e desenvolveu as habilidades de liderança e gestão. Acredita na integração e aplicação prática dos conhecimentos para a realização de projetos inovadores, sólidos e sustentáveis a longo prazo. Um dos grandes sonhos realizados foi o lançamento do curso gratuito Mande Bem no ENEM que atingiu mais de 500 mil estudantes em todo o Brasil contribuindo para a Educação Brasileira.

Participe da nossa comunidade no Whatsapp sobre Educação e Tecnologia

0 comentários

Enviar um comentário

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *

Posts Relacionados

Aprendendo com IA: espelhos sociais e intelectuais

Até recentemente, as interações humanas com máquinas antropomorfizadas (entidades não-humanas que são atribuídas características humanas) eram consideradas divertidas, mas não eram vistas como emocionalmente relevantes para a maioria das pessoas. Embora muitos se...

10 efeitos negativos do uso de celulares para as crianças

Crianças de todo o mundo (embora não todas) utilizam smartphones para diversas finalidades. Algumas passam horas conversando com amigos, enquanto outras se dedicam a jogar inúmeros jogos. A Internet é frequentemente considerada uma fonte de conhecimento para as...

Sistemas de tutoria inteligente

Adaptação da aprendizagem de acordo com o nível e ritmo do estudante Os sistemas de tutoria inteligente se baseiam na capacidade de adaptar a aprendizagem de acordo com o nível e o ritmo do estudante. Usando inteligência artificial e técnicas de aprendizado de...

Quanto custa manter a nuvem no céu para o meio ambiente?

À medida que a humanidade aumenta sua capacidade de intervir na natureza com o objetivo de satisfazer as necessidades e desejos crescentes, aparecem as tensões e conflitos quanto ao uso do espaço e dos recursos naturais. Quanto custa manter a nuvem no céu para o meio...

Competências essenciais na era digital

A proliferação da IA em muitos aspectos da vida humana - desde o lazer pessoal até o trabalho profissional, passando pelas decisões políticas globais - impõe uma questão complexa sobre como preparar as pessoas para um mundo interconectado e em rápida mudança, que está...

Educação digital para prevenir abusos sexuais online

Depois de participar de uma aula incrível com a professora Beatriz Lorencini e o Felipe, fui tirado da bolha onde costumo estar a maior parte do meu tempo se não o tempo todo. Quando percebi eu estava em choque por "não saber ou escolher não saber" que existem...

Tag Cloud

Posts Relacionados

[dgbm_blog_module posts_number=”4″ related_posts=”on” show_categories=”off” show_pagination=”off” item_in_desktop=”2″ equal_height=”on” image_size=”mid” author_background_color=”#ffffff” disabled_on=”off|off|on” module_class=”PostRelacionado” _builder_version=”4.16″ _module_preset=”default” title_font=”Montserrat||||||||” title_text_color=”#737373″ title_font_size=”19px” title_line_height=”25px” meta_text_color=”#666″ meta_font_size=”13px” content_font_size=”13px” content_line_height=”30px” author_text_color=”#666666″ custom_css_content_container=”display:flex;||flex-wrap:wrap;” custom_css_image-container=”padding-top:70%;||overflow:hidden;” custom_css_image=”position:absolute;||top:0;||left:0;||bottom:0;||right:0;||object-fit: cover;||height:100%;||width:100%;” custom_css_title=”padding:20px;||margin-top:0;||order:2;” custom_css_content=”padding:0 20px 20px;||order:3;” custom_css_post-meta-middle=”order:1;||padding:20px;||border-bottom:1px solid #dcdcdc;||border-top:1px solid #dcdcdc;” border_width_all_post_item=”0px” border_width_all_content=”0px” box_shadow_style_container=”preset1″ box_shadow_blur_container=”5px” box_shadow_spread_container=”1px” box_shadow_color_container=”rgba(0,0,0,0.1)” global_colors_info=”{}”][/dgbm_blog_module]

Receba a nossa newsletter

Fique por dentro e seja avisado dos novos conteúdos.

Publicações mais recentes