As micro-interações tornaram-se cada vez mais importantes em um mundo com um número estonteante de plataformas digitais e um oceano de conteúdo. Enquanto as micro-interações costumavam ser consideradas um recurso interessante nos primeiros dias do design digital, no espaço digital hipercompetitivo de hoje em dia elas se tornaram um elemento crucial para a experiência geral do usuário.
Este artigo discutirá os conceitos básicos das micro-interações e como você pode utilizá-las para aprimorar seu design de UX.
O que são microinterações?
No design digital, as micro-interações são encontradas na maioria dos compromissos dos usuários com os produtos. Isso ocorre quando você passa o mouse sobre o texto e ele muda de cor para indicar que pode ser clicado. É quando a animação sai mostrando o progresso do seu upload. É até a mensagem que aparece para informar que você digitou a senha errada.
Essas pequenas pistas visuais e outros indicadores sutis são micro-interações. E, embora possam não ser facilmente percebidos pelos usuários, na verdade, muitas vezes, são executados adequadamente. As micro interações, por mais sutis que sejam, mantêm o esquema geral de design – fornecendo bits de informações que permitem aos usuários navegar na interface e executar funções básicas.
Como funcionam as microinterações
As micro interações têm quatro elementos básicos: gatilho, regras, feedback e loops / modos. Esses elementos ajudam a organizar o ciclo operacional desses elementos de design:
GATILHOS
É isso que inicia o processo de micro-interação – um toque de um botão ou um clique de um mouse, por exemplo. Também pode ser iniciado pelo sistema quando certas qualificações são atendidas, como quando você recebe notificações sonoras ao receber uma mensagem.
Esses gatilhos funcionam com um conjunto de regras de ação estabelecidas que prescrevem o que pode e o que não pode ser feito.
REGRAS
Eles basicamente determinam o que acontece quando uma micro interação é acionada. Então, quando você desliza o dedo sobre o Tinder, por exemplo, as regras indicam que você “super gostou” de alguém. Mas as regras também afirmam que ainda não é possível enviá-las por mensagem até que tenham gostado de você.
COMENTÁRIOS
Como o nome indica, ele permite que os usuários saibam o que está acontecendo. Tudo o que um usuário vê, ouve ou sente quando ocorre uma microinteração é feedback. Por exemplo, se você configurar o telefone para vibrar, essa vibração curta será o feedback.
LOOPS / MODOS
Eles basicamente definem a natureza da interação – ela pisca uma vez, repita? O que acontece com o tempo? Por exemplo, os loops podem ser o número de vezes que um usuário pode digitar a senha incorreta, enquanto o modo seria que uma conta fosse temporariamente bloqueada após cinco erros de senha.
Quando e como usar microinterações
1. ANIMAÇÃO DE PÁGINA
Quando você fala sobre animação de página, pode ser a transição criativa entre as páginas ou apenas um ícone legal de progresso da rolagem. Esses tipos de micro-interações podem fornecer aos usuários uma melhor compreensão do relacionamento entre as páginas anteriores e as atuais. Também torna ainda mais envolvente o processo de escaneamento.
2. PASSANDO
Da mesma forma, você também pode tirar proveito de como a passagem inata se tornou incorporando transições suaves ao seu conteúdo quando os usuários deslizam. Dessa forma, você pode adicionar algum valor de entretenimento ao seu conteúdo (sem que os usuários precisem acessar um aplicativo de namoro).
3. CAMPOS DE ENTRADA ANIMADOS
Você provavelmente não conheceu ninguém que goste de preencher formulários. Mas os campos de animação podem pelo menos tornar a tarefa mundana mais envolvente e até útil.
4. ANIMAÇÃO DE STATUS
Da mesma forma, nessa era de atenção cada vez menor e entretenimento sob demanda, ninguém gosta de esperar. Porém, usando animações para coisas como status de download / upload, você pode mostrar o progresso dos usuários, adicionando mais diversão a uma função chata.
Você pode até usá-lo para adicionar à sua marca.
5. NOTIFICAÇÕES
Quando se trata de notificações, é melhor se você pode dar opções aos usuários. Por exemplo, existem usuários que preferem notificações menos intrusivas. Outros, enquanto isso, não se importariam com a bolha de bate-papo do Facebook Messenger, mesmo enquanto assistiam a um vídeo do YouTube.
O Facebook e o Instagram levaram isso a outro nível, oferecendo aos usuários uma dose de dopamina toda vez que alguém gosta de suas postagens. Isso cria hábitos, tornando os usuários ansiosos para receber notificações.
6. MENU SUSPENSO
Tornou-se um design básico nos sistemas operacionais dos smartphones e é incrivelmente fácil de usar. Ao puxar a parte superior da tela para baixo, você obtém acesso a todas as suas notificações e configurações básicas. A facilidade de navegação é uma das funções mais importantes das micro-interações, e os menus suspensos permitem exatamente isso.
7. BOTÕES DA FRASE DE CHAMARIZ
Seus CTAs estão lá por um motivo – e isso é porque você deseja que os usuários cliquem neles. Adicionar animação aos botões do CTA pode ajudar a estimular o comportamento dos usuários. E, no mínimo, deixe-os curiosos sobre o que pode acontecer.
8. ANIMAÇÃO DE TEXTO ÂNCORA
Animar o texto âncora é uma ótima maneira de incorporar a marca criativa em funções simples, como retornar à sua página inicial ou até mesmo indicar que algo pode ser clicado.
9. TUTORIAIS
As micro interações também são uma ótima maneira de educar os usuários sobre como usar seu produto. Animações simples ou mesmo gráficos que apontam para funções básicas podem ajudar bastante a melhorar o UX, facilitando o uso do produto e revelando funções ocultas interessantes.
Leve embora
Esses pequenos detalhes agregam valor à experiência geral de seus usuários. Um pequeno recurso, como uma notificação não intrusiva ou uma animação interessante, pode fazer com que os usuários sintam que a empresa se importa com eles e gera sentimentos de boa vontade em relação à marca. E uma vez que esse tipo de relacionamento seja construído, você poderá influenciar as ações deles para se alinhar com seus próprios objetivos.
Com tudo digital, fica cada vez mais difícil se destacar da multidão – mas essas sutis interações podem ajudá-lo a conseguir exatamente isso.