Muito se fala sobre UX/UI, de como o mercado está em alta, e como faltam profissionais para atender as demandas e tal. Dentro deste universo existe um nicho que deveria ser bem aproveitado pelos motions designers, mas que muitas vezes passam desapercebidos, porém as animações voltadas para esta área vão além da animação e é sobre isso que trata o artigo de hoje.
Do que se trata UX/UI?
Vamos aqui separar os termos, UX é a sigla para User eXperience, que é nada mais nada menos do que a experiência do usuário, o criador da terminologia foi o Don Normam em 1990 quando era Vice-Presidente do Advanced Technology Group da Apple. Esta experiência é algo que ocorre tanto no mundo físico e digital, tudo gera experiência para os consumidores, a diferença é que esta experiência pode ser algo planejada e tornar-se relevante. Cabe ao profissional de UX fazer análises para mapear as características e necessidades do usuário para criar uma experiência que atenda e supere suas expectativas.
Com este estudo em mãos e se estivermos falando de um produto digital, passamos para a etapa do UI, User Interface ou em bom português Interface do usuário, é a interação entre homem e máquina, toda a parte que envolve a criação de layouts, com textos, imagens, chamadas para ação ou outros elementos, é responsabilidade do UI, e dentro destes layouts cabem o bom e velho motion.
O propósito da animação dentro do UI
Dentro de um projeto que demande UX/UI o fator principal é a usabilidade, onde a máxima do design, a forma segue a função é aplicada ao extremo. Olhando por este prisma o cuidado com o que vai ser animado deve seguir certas diretrizes.
Para os que querem se aventurar neste mundo sugiro a leitura das normas estabelecidas pela WCAG (Web Content Accessibility Guidelines). Neste link deixo um guia de consulta rápida do WCAG.
A animação além de trazer uma sensação mais amigável ao layout, ela deve servir a alguns propósitos que auxiliam na captação da atenção do usuário, abaixo descreverei estes propósitos.
Captar a atenção
Quando um projeto de UI é bem planejado, sabemos qual a hierarquia das informações, logo fica claro onde devemos ter mais ou menos destaques, a animação deve servir a este proposito. Esta atenção serve também para direcionar e até mesmo revelar os próximos passos a serem dados dentro da interface, como por exemplo uma animação de arrastar para cima.
Confirmação
A cada ação realizada, o motion pode ser um poderoso aliado, trazendo beleza e reforçando a ação de confirmação, por exemplo, é mais interessante uma microanimação de um botão pressionado, do que uma mera mudança de cor. Também muitas vezes a animação ajuda a substituir os textos dentro da interface, em vez de aparecer uma mensagem de senha incorreta, uma simples animação pode passar a mesma mensagem de forma mais agradável.
Wayfiding
Dentro do design existe um termo chamado wayfiding, que são conjuntos de elementos auditivos, visuais e táteis usados para que o usuário tenha pistas de como se chegar do ponto A até o B, e não somente chegar, mas saber onde se encontra em determinado momento. O motion pode ser um dos elemento que auxiliam os usuários a se encontrar dentro de uma interface, evidenciando botões ou até mesmo direcionando o que o usuário deve fazer.
No próximo artigo aprofundarei mais sobre o assunto e trarei algumas regrinhas básicas para darmos nossos primeiros passos, pois no universo do UI, a animação pela animação não basta para alcançarmos os devidos resultados.
Imagem- Adaptada do Freepik