Mapas de Calor provam como sua homepage é o seu cartão de visitas
Como utilizei Mapas de Calor para entender o comportamento dos usuários, otimizar a interface do website e melhorar o tráfego.
Usuários também “julgam o livro pela capa?”
Seja o conteúdo bom ou ruim, uma coisa é certa: sim, os usuários também usam suas primeiras impressões para tomada de decisão.
Uma empresa norte-americana de cosméticos realizou uma pesquisa que revelou que a primeira impressão é formada em menos de 30 segundos, ou seja, julgar algo, ou não, pela capa não é questão de escolha, é fisiológico.
Quando falamos de website, é fundamental que a sua homepage seja projetada de forma coerente com as necessidades do público. Os primeiros segundos de contato com a marca devem ser claros e descomplicados para que despertem curiosidade pelo restante.
Vale lembrar também a importância da consistência da identidade visual em todos os pontos de contato com os usuários para tornar a experiência ainda mais atrativa.
⠀
O desafio
Durante o processo de re-design de um website utilizei dados dos Mapas de Calor para compreender o baixo desempenho da página e projetar soluções de acordo com a jornada dos usuários.
Como ajudar os usuários a encontrarem respostas que precisam, diminuir o Bounce Rate e gerar mais pontos de conversão?
⠀
O que são, onde habitam e como funcionam os mapas de calor?
Para construção das alternativas de solução foram levados em consideração diversos aspectos do Design da Experiência do Usuário que você por conferir melhor nesse outro artigo:
Uma das ferramentas utilizadas durante esse processo foram os Mapas de Calor por meio da plataforma Hotjar. Os Mapas de Calor são representações gráficas por meio de uma escala de cores que mostram quais áreas da página estão sendo mais utilizadas pelos usuários. As áreas mais acessadas são marcadas em vermelho (regiões quentes) e as que não recebem tantas visualizações em azul (regiões frias). Estes mapas podem ser de 3 tipos: cliques/toques, rolagem e movimento.
Com um mapa de calor em mãos é possível:
- Identificar quais áreas do site estão funcionando como deveriam;
- Até onde os usuários estão rolando a página;
- Quais informações importantes não estão sendo visualizadas;
- Que outros pontos estão “roubando a atenção” e podem ser retirados.
- Quais áreas têm maior impacto visual e podem ser adicionados pontos de conversão (CTAs).
Todas essas informações, com base na experiência do usuário, permitem propor otimizações ainda mais objetivas para reduzir a taxa de rejeição do site e gerar pontos de conversão assertivos.
⠀
Os dados falam
Inicialmente foram analisados os Mapas de Calor da versão Desktop do site e foi feita a interpretação dos dados obtidos:
Da mesma forma procedeu-se para os Mapas de Calor da versão mobile:
Alternativas de solução
Com base nos dados obtidos foram projetadas alternativas de solução utilizando a metodologia “How Might We” ou, em português, “Como poderíamos”. De forma paralela também foram feitas pesquisas com os usuários para entender melhor sua interação com sites no momento de compra de algum serviço ou consumo de conteúdos em blogs. Confira mais clicando aqui.
Para cada ação prática foram descritas suas noções de sucesso que permitiram em acompanhamento posterior definir quais otimizações foram efetivas e se os objetivos pretendidos foram alcançados.
Desenhando a solução: wireframes e fluxo do usuário
Inicialmente foram desenhados rabiscoframes da nova interface do site para tornar a proposta mais visível. Além da homepage também foi re-desenhado todo o restante do site, bem como, o fluxo de usuários ao navegar por elas, esperando-se aumento de tráfego nas demais páginas.
Em seguida, os rabiscoframes foram prototipados no Figma passando por dois testes de usabilidade onde algumas melhorias de interface foram realizadas até chegar em sua versão final.
Um zoom nas mudanças
Vejamos agora um pouco mais de perto quais foram as mudanças realizadas na interface e no fluxo de usuários nos 2 principais pontos de contato com os usuários na homepage em comparação ao site antigo.
⠀
1ª Section da Homepage:
⠀
Section de “Produtos”:
⠀
Telinhas bonitas não geram resultado
Como ouvi muito o Leandro Rezende do Programa UX Unicórnio falar: “só telinhas bonitas não adiantam, elas precisam ser funcionais!”. E para ver se as mudanças feitas cumpriram com seus objetivos e trouxeram resultados, o que melhor que deixar os atuais Mapas de Calor falarem por si só?
Conclusões e aprendizados
O principal objetivo de qualquer negócio é cumprir com o seu propósito, entregar um produto de qualidade, mudar a vida das pessoas e, claro, obter o seu retorno de investimento por meio das vendas.
Para que um website seja uma ferramenta eficiente durante esse processo, é preciso que seja construído com base não apenas nos objetivos de negócio, mas principalmente, na experiência de seus usuários.
Este artigo é apenas uma parte de um projeto de re-design que antes de desenhar soluções buscou entender como os usuários do negócio interagiam com a interface e quais problemas procuravam resolver.
O UX/UI Design é um processo de melhorias na experiência do público ao longo dos pontos de contato com a marca e, como todo processo, precisa ser acompanhado, validado e re-estruturado sempre que se fizer necessário.
Pessoas mudam, comportamentos mudam e a experiência dos usuários também!
O artigo termina por aqui mas os aprendizados continuam!
Por fim, deixo meu Linkedin à disposição para quaisquer dúvidas ou troca de informações.
