10-responsive-design-problems-and-fixes-banner
Share on facebook
Share on twitter
Share on linkedin

Como funcionam as microinterações?

Tendências atuais em design e nossa experiência aqui na dti vem apenas confirmar quão importante é ter uma mentalidade centrada no usuário. As microinterações são um ótimo exemplo de como pequenas mudanças podem tornar uma interface mais humanizada e amigável.

Nesse tipo de projeto, começamos definindo qual a real necessidade desse usuário e então propomos uma solução para que ele cumpra uma tarefa com eficiência e eficácia. Mas, não são apenas funcionalidades que conquistam um cliente. São os detalhes que tornam uma experiência memorável e fazem um produto se destacar de seus concorrentes.

Mas o que são microinterações, afinal?

Como o próprio nome sugere, microinterações são pequenos momentos que ajudam o usuário a concluir uma tarefa ou receber feedback do sistema. Animações em uma interface gráfica. Como quando damos like em uma postagem, são bons exemplos desses momentos pontuais de interação.

like

Em resumo, os principais objetivos das microinterações são:

  • Comunicar o resultado de uma ação (feedback);
  • Realizar uma tarefa específica;
  • Aperfeiçoar a noção de manipulação direta;
  • Ajudar usuários a visualizar suas ações e evitar erros;

Microinterações funcionam tão bem pois garantem que o usuário se sinta no controle da interface. Perceba as consequências de suas ações e aprenda facilmente como navegar por um novo produto, tudo isso de uma forma visualmente interessante.

pulldown

A VirginAmerica, uma companhia aérea americana, recentemente lançou um novo website que explora de forma fantástica o conceito de microinterações.

Todos sabemos quão penosa pode ser a tarefa de fazer uma reserva e preencher formulários que parecem não ter fim. Mas será que essa tarefa não pode ser divertida? Com o propósito de solucionar essa questão, o estúdio Work&Co propôs para a VirginAmerica um design clean e divertido. Ele foi pontuado por microinterações que tornam a experiência amigável e receptiva.

virgin-form

No exemplo acima, podemos ver como o formulário de cadastro interage com o usuário! As mensagens de “Hey there” e “Nice Name” que aparecem após preenchidos os campos de nome, humanizam a interface e criam uma sensação de boas vindas.

virgin

Outro exemplo legal, é como o novo site da Virgin utiliza gifs para mostrar ao usuário, de uma forma lúdica, quais as funcionalidades disponíveis ou o que fazer em seguida.

Todas as interações acontecem de forma muito natural, sem distrair o usuário da sua tarefa principal: reservar um voo.

Importante

Com um pouco de pesquisa pela internet, encontramos diversos exemplos inspiradores de como comunicar ao usuário o status do sistema e o resultado de suas ações. Entretanto, mais importante do que entender o que é ou como criar uma microinteração, é ter em mente que ela deve cumprir um papel dentro da interface.

Talvez uma animação seja muito legal da primeira vez, mas depois da 20ª vez, se torne irritante. Atenção aos detalhes é essencial para criarmos uma experiência memorável. E só alcançamos isso, se nos colocamos no lugar do usuário!

Por: Yasmin Fonseca

Preencha seus dados para receber nossa newsletter!

Ficou com dúvidas?

contato@dtidigital.com.br
R. Antônio de Albuquerque, 330 – 14° andar
Savassi, Belo Horizonte – MG, 30112-010

Cuidado

Nós utilizamos cookies e outras tecnologias semelhantes para analisar sua experiência no site e personalizar conteúdos e anúncios durante sua navegação. Ao navegar pelo site, você autoriza a DTI Digital a realizar tal monitoramento. Conheça nossa Política de Privacidade.

you are being redirected to a page in portuguese, do you want to continue?