Como interpretar um heatmap: Guia para iniciantes

Comece a testar grátis Agende uma demonstração

“Isso é um divisor de águas”!

Você deve ter tido essa sensação ao se deparar com heatmaps e sua capacidade de representar visualmente conjuntos de dados. Heatmaps aprimoram a análise de dados ao fornecer insights visuais que ajudam a compreender rapidamente padrões e tendências, o que permite tomar decisões fundamentadas e orientadas por dados.

No entanto, entender o poder dos heatmaps é uma coisa, mas interpretá-los corretamente e fazer descobertas relevantes é outra. Este guia ajudará você a ler e interpretar diferentes tipos de heatmaps. Vamos lá!

Imagem de destaque: Como interpretar um heatmap: Guia para iniciantes

Aprendendo o básico: como ler um heatmap?

A leitura de um heatmap é simples, pois ele usa uma escala de cores para representar valores de um conjunto de dados. Normalmente, cores vibrantes, como vermelho e laranja, indicam valores altos, enquanto cores mais frias, como azul e verde, significam valores baixos. Por exemplo, no heatmap a seguir, as áreas com manchas vermelhas destacam as seções mais clicadas do site, enquanto o verde e demais tons frios apontam para as partes que recebem menos cliques. Essa representação visual facilita a identificação de pontos de acesso e áreas que precisam de melhorias.

Heatmap

No entanto, é importante observar que as opções de cores nos heatmaps podem variar, já que não existe uma padronização universal. Por isso, eles costumam vir acompanhados de uma escala de cores que especifica quais tons representam valores de alta e baixa intensidade.

Escala de cores de um heatmap

Além disso, alguns heatmaps exibem dados numéricos para informar valores precisos e indicar sua intensidade dentro da escala de cores.

Alguns heatmaps exibem dados numéricos

Agora você já conhece os fundamentos dos heatmaps. A seguir, vamos dar uma olhada nos diferentes tipos de mapas e como interpretá-los. Revise as informações desta seção ao analisá-los.

Entendendo e interpretando diferentes tipos de heatmaps

a. Heatmap agrupado

Um heatmap agrupado fornece uma representação visual das tendências de um conjunto de dados, ajudando o usuário a entender as relações subjacentes entre os pontos de dados. Por exemplo, considere um heatmap agrupado que mostra a idade média em diferentes cidades do mundo para o período entre 2020 e 2023. Esse mapa ilustra os padrões de distribuição de idade em diversos locais, facilitando a identificação de quais cidades têm populações mais jovens ou mais velhas.

Heatmap agrupado da idade média em diferentes cidades (2020-2023)

Como você pode observar, as colunas representam a faixa etária média em diferentes cidades em um determinado ano, enquanto as linhas mostram a faixa etária média entre 2020 e 2023 para uma cidade específica. As cores do heatmap permitem que você entenda rapidamente o perfil de idade de qualquer local. Por exemplo, é possível entender imediatamente que Nova York teve a população mais nova entre os anos de 2020 a 2023, pois a escala de cores na parte inferior sinaliza idades mais jovens em azul e mais velhas em vermelho. Além disso, os dendrogramas à esquerda e na parte superior agrupam cidades e os anos com perfis de idade média semelhantes, fornecendo uma representação visual clara de padrões e tendências.

Você pode fazer bom proveito de um heatmap agrupado quando tiver múltiplos conjuntos de dados para comparar. Ele ajuda a identificar conexões comuns, descobrir tendências e criar agrupamentos.

b. Heatmap de correlação

Os heatmaps de correlação ajudam a visualizar as relações entre múltiplas variáveis em um conjunto de dados. Para explicarmos como interpretá-lo, vamos tomar como exemplo um conjunto de dados de um site de e-commerce, com variáveis como taxa de rejeição, taxa de conversão e outras.

Heatmap de correlação para métricas de sites de e-commerce

É possível visualizar a matriz de correlação com variáveis no eixo X e no eixo Y. Uma escala de cores indica a relação entre as variáveis com valores de correlação.

O valor 1 indica uma correlação positiva perfeita (à medida que uma variável aumenta, a outra também aumenta), enquanto o valor -1 indica uma correlação negativa perfeita (à medida que uma variável aumenta, a outra diminui). Para descobrir uma relação, verifique o bloco de interseção entre duas variáveis. Por exemplo, o bloco de interseção do ROI do site (“Website ROI”) no eixo X e a taxa de rejeição (“Bounce Rate”) no eixo Y tem coloração vermelha e valor de correlação de -0,98. Isso significa que a taxa de rejeição tem um impacto negativo sobre o ROI do site.

Uma das vantagens do heatmap de correlação é a possibilidade de identificar rapidamente relações extremas inversas e diretas. Nesse caso, um bloco de interseção vermelho com o valor de -0,98 indica que a taxa de rejeição afeta significativamente o ROI do site. Portanto, é necessário tomar medidas para reduzir a taxa de rejeição.

Esse tipo de heatmap é útil para compreender rapidamente como as variáveis afetam umas às outras, permitindo identificar relações fundamentais em um piscar de olhos.

c.  Heatmap de série temporal

Os heatmaps de séries temporais são uma ferramenta fantástica para visualizar a variação dos dados ao longo do tempo. Novamente, vamos observar um exemplo para entendermos como interpretá-los.

Neste heatmap, analisamos o nível de engajamento nas redes sociais durante uma semana. O eixo X representa as horas do dia, enquanto o eixo Y representa os dias da semana. A escala de cores varia do azul (baixo engajamento) ao vermelho (alto engajamento).

Heatmap de série temporal

Usando um heatmap de série temporal, você consegue identificar tendências de engajamento ao longo da semana e do dia com facilidade. Por exemplo, é possível notar que as taxas de engajamento atingem o pico à noite nos dias de semana e permanecem altas aos sábados e domingos. Este insight pode ser muito valioso para o planejamento de estratégias para redes sociais, como o agendamento de publicações importantes para as noites de sexta-feira e segunda-feira.

Os heatmaps de séries temporais são incrivelmente úteis quando é necessário analisar o impacto da hora, do dia e do mês sobre os indicadores-chave de desempenho (KPIs). Essa ferramenta visual pode ajudar a otimizar sua estratégia com base em padrões temporais.

d. Heatmap de análise de coorte

Os heatmaps de análise de coorte ajudam a identificar tendências e padrões em grupos específicos de dados. Vejamos um exemplo de análise de coorte:

Heatmap de análise de coorte
Fonte da imagem: Mode

Esse é um heatmap de coorte de retenção de usuários. Cada linha representa um coorte, definido pelo dia em que os usuários se registraram. Por exemplo, 79 usuários se registraram em 27 de abril de 2014, formando um coorte. Cada coluna representa um período (por exemplo, dias, semanas, meses) após a formação do coorte. Nesse caso, o período é semanal.

Para interpretar esse heatmap, devemos começar pelo lado esquerdo do coorte. Em 27 de abril de 2014, 79 usuários se registraram. Movendo-se horizontalmente, você pode observar a porcentagem de retenção de usuários a cada semana. As cores fornecem uma referência visual rápida: verde indica um bom nível de retenção, enquanto vermelho indica baixa retenção. Dessa forma, é possível descobrir que na 17ª semana após o registro, a maioria dos usuários não foi mantida. Esse insight pode contribuir com a criação de estratégias e iniciativas para melhorar a retenção.

A análise de coorte é útil para acompanhar a retenção de usuários, o desempenho de um produto e outras métricas ao longo do tempo.

e. Heatmaps de comportamento do site

i. Scrollmap

Os scrollmaps ajudam a entender o que os visitantes acham da sua página. Vejamos a análise de um scrollmap de uma loja virtual:

Scrollmap

No canto direito do scrollmap, é possível verificar a escala de cores que sinaliza as alterações de tons em relação à porcentagem de rolagem na página. As linhas horizontais indicam quantos visitantes visualizaram o conteúdo até cada ponto de rolagem.

Os scrollmaps identificam pontos fundamentais da página, como a porcentagem de profundidade de rolagem em que metade dos visitantes vai embora. Essas informações podem ser valiosas para reformular suas páginas e adicionar elementos de engajamento exatamente onde eles são mais necessários.

Pro Tip!

Use a ferramenta VWO Scrollmap para verificar a porcentagem de profundidade de rolagem em diferentes dispositivos (celulares, tablets e computadores) em uma única interface. Essa abordagem ajudará você a criar uma uma hipótese fundamentada sem mudanças de contexto.

ii. Clickmap

Os clickmaps contribuem com suas pesquisas de comportamento dos visitantes, exibindo o desempenho de cada elemento clicável na sua página.

Clickmap

Ao passar o mouse sobre um elemento clicável, o clickmap exibe o número de cliques recebidos e a porcentagem correspondente do total de cliques na página. Esse insight ajuda a entender quais elementos estão chamando mais atenção e gerando interações, possibilitando que você otimize sua página.

iii.  Heatmap de movimentação do mouse

Os heatmaps de movimentação do mouse (mouse tracking) representam visualmente os dados dos movimentos dos mouses de todos os visitantes. Veja um exemplo:

Heatmap de movimentação do mouse

Os pontos vermelhos indicam onde os visitantes normalmente descansam seus cursores, enquanto as manchas azuis mostram os caminhos percorridos pelo mouse. Esse tipo de heatmap ajuda a identificar áreas essenciais da página em que os usuários tendem a fazer pausas na navegação, sugerindo que esses pontos devem apresentar elementos importantes.

iv. Heatmap de área de clique

Os heatmaps de área de clique são uma ferramenta avançada de análise do comportamento dos visitantes. Eles permitem interagir com o relatório de um heatmap. Ao selecionar uma área específica em sua página, é possível ver o número de cliques dentro dela. Veja um exemplo:

Heatmap de área de clique

Ao clicar e selecionar uma área da página, você consegue visualizar o número de cliques juntamente com outras estatísticas, como porcentagem do total de cliques na página e porcentagem relativa a outras zonas.

Essas informações ajudam a identificar quais áreas da página são atrativas ou não, trazendo insights valiosos para iniciativas de reformulação.

v. Heatmap de cliques de raiva

Um heatmap de cliques de raiva (rage click) ajuda a identificar pontos de atrito em seu site. Veja um exemplo:

Rage click heatmap

Nesse mapa, é possível observar pontos em que os usuários clicaram com raiva, pensando, erroneamente, que algum texto simples ou elemento não clicável era interativo. Esses cliques frequentes e frustrados destacam quais áreas são confusas e prejudicam os visitantes do site.

Alguns heatmaps permitem que você filtre os cliques de raiva, facilitando a identificação dessas áreas problemáticas. Ao analisar esses dados, é possível tomar decisões fundamentadas para ajustar a experiência do usuário na sua página, garantindo uma navegação mais fluida e intuitiva para os visitantes.

Esses são os principais tipos de heatmaps!

As informações que apresentamos são destinadas a ajudar você a interpretar diferentes tipos de dados usando heatmaps distintos, que possibilitam compreender rapidamente insights e padrões subjacentes.

Se você tem interesse em utilizar heatmaps de sites para entender o comportamento dos seus visitantes, conheça a solução VWO Insights – Web Heatmaps. Descubra por que ela pode ser a ferramenta certa para você:

Benefícios da solução VWO Insights – Web para análise de heatmaps

A solução VWO Insights – Web Heatmaps é uma das ferramentas mais versáteis e informativas disponíveis no mercado. Ao usá-la, você aproveita benefícios incríveis:

Configuração facilitada

A configuração da solução VWO Insights – Web é muito fácil. Basta adicionar um pequeno código ao seu site e você poderá começar a coletar insights. É uma tarefa única que deixa tudo funcionando em questão de minutos.

Recursos abrangentes

VWO Insights – Web Heatmaps oferece um panorama completo do comportamento dos visitantes por meio de diferentes tipos de heatmaps, como clickmaps, scrollmaps, áreas de clique, cliques de raiva, cliques mortos e filtros de primeiro clique, todos acessíveis por meio de um painel de controle.

VWO Insights - Web heatmap

Otimização de ponta a ponta

Além de obter insights da análise do heatmap, você também pode tomar medidas com base neles, implantando novos designs, executando testes A/B ou personalizando o site, tudo a partir da plataforma da VWO.

Sucesso comprovado

Empresas como Ubisoft utilizam a solução VWO Insights – Web. Veja o que elas têm a dizer:

Realizamos uma série de testes A/B com base nos dados que coletamos usando heatmaps, scrollmaps e pesquisas disponíveis na plataforma da VWO. Tudo isso nos ajudou a identificar elementos-chave em nossos sites que precisavam de uma análise mais profunda. – Jenny Hughes, marketing digital da Ubisoft.

Segurança de nível empresarial

A VWO está em conformidade com normas como GDPR, CCPA, PCI DSS e HIPAA. A empresa possui certificação ISO 27001:2013 e ISO 27001:2019 e é compatível com SOC 2 Tipo II. Seus dados e os de seus visitantes ficam seguros e protegidos.

Teste antes de comprar

Entendemos que tomar a decisão de investir em uma ferramenta não é um processo simples. Por isso, oferecemos um teste grátis de 30 dias para que você avalie todos os nossos recursos. Além disso, temos um plano gratuito para que você explore as soluções ainda mais a fundo. Não perca a chance de melhorar a experiência do usuário no seu site com a solução VWO Insights – Web Heatmaps.

Considerações finais

Saber ler e interpretar diferentes tipos de heatmaps pode melhorar significativamente sua capacidade analítica. Ao aproveitar o poder visual dos heatmaps, empresas e indivíduos obtêm insights relevantes sobre seus dados.

O uso de heatmaps em sites pode revelar diferentes aspectos do comportamento dos visitantes, oferecendo uma visão rápida de como os usuários interagem com as páginas. Entretanto, organizações mais maduras não se limitam aos heatmaps. Elas também utilizam outras ferramentas, como gravações de sessões, pesquisas e análise de formulários, para obter uma visão completa do comportamento dos visitantes.

Portanto, não limite sua análise apenas aos heatmaps. Explore ferramentas adicionais para obter uma compreensão mais abrangente e uma análise de dados robusta. Essa abordagem holística assegura a compreensão do panorama completo e promove uma tomada de decisão orientada por dados, fatores que realmente melhoram o desempenho do seu site e a experiência do usuário.

Perguntas frequentes

O que é análise de heatmap?

Análise de heatmap é uma representação gráfica bidimensional de dados em que valores individuais são representados por cores. A intensidade da cor varia de acordo com o valor, criando um breve resumo visual das informações.

Como avaliar um heatmap?

É possível avaliar um heatmap ao analisar os padrões de cores que representam valores. Esses padrões podem revelar insights ocultos, como o comportamento do usuário. Por exemplo, em um heatmap de série temporal, os padrões de cores podem indicar quais são as faixas de tempo com as maiores taxas de engajamento.

Como os heatmaps transmitem um significado?

Os heatmaps transmitem um significado ao exibir gradientes e padrões de dados por meio de cores, facilitando a interpretação de informações complexas em um piscar de olhos.

O que é possível inferir de um heatmap?

A partir de um heatmap, é possível inferir a distribuição ou a intensidade de um valor, o que contribui com a identificação de padrões ou tendências nos pontos de dados brutos.

Ketan Pande
I’m a content marketer at VWO, reading and writing on topics like behavior analytics, conversion rate optimization, and experimentation. Prior to VWO, I built and managed my own website where I discussed business growth and career. When I’m not at my desk, you’ll find me exploring nature trails, cycling through the countryside, or seeking out new physical challenges—those are my ideas of a good time! Want to start a conversation with me? Just mention BIRDS, and you’ll have my undivided attention.

Ofereça ótimas experiências. Comece hoje a crescer mais rápido.

Começar Teste Grátis Solicite Uma Demonstração