Heatmaps para Aplicativos: Como usar (iOS e Android) 2024

O que são os Heatmaps de Aplicativos?

Os heatmaps de aplicativos são uma sobreposição visual em uma variedade de cores para representar as interações do usuário.

Os heatmaps representam a atividade média do usuário, o que te permite ver quais elementos recebem mais atenção.

O olho humano pode compreender estas cores sem esforço e muito mais rapidamente do que as pessoas podem analisar um conjunto de números. Os heatmaps agregam grandes números de dados dos usuários e os compilam de uma forma que nos permite tirar conclusões com rapidez e precisão a partir dos resultados.

Por esta razão, os heatmaps são melhor utilizados em grandes grupos de dados para nos mostrar os extremos - onde está a maior ou a menor quantidade de atividade.

Melhor ferramenta de Heatmap para iOS, Android, e Apps Híbridos

A UXCam é a líder de mercado em mapas de calor de aplicativos.

Ela é compatível com iOS nativo, Android, ReactNative, PhoneGap/Cordova, Xamarin, e Flutter.

• Analise heatmaps com base em gestos do usuário

• Veja os mapas térmicos de cada dispositivo e sistema operacional

• Encontre problemas de UX com gestos de raiva e heatmaps não responsivos

• Mapas de calor segmentados por dispositivo, versão do app, ou propriedades personalizadas

• Encontre oportunidades para cada tela, combinando heatmaps com replay de sessão

• Entenda os pontos de entrada e saída de cada tela e entenda porque os usuários saem

Mais de 37.000 aplicativos confiam nos mapas de calor mobile da UXCam. Saiba mais sobre os recursos da UXCam ou pergunte diretamente à nossa equipe em uma demonstração gratuita. 

Tipos de Heatmaps de Aplicativos

Há um mapa de calor específico que pode ajudar em cada hipótese. Se você acha que um gráfico estático em seu aplicativo está sendo confundido com um botão, verifique os gestos sem respostas.

Os logins caem após o download? Os gestos de frustração podem ser capazes de dizer o que está bloqueando os usuários de configurar suas contas. 

Aqui cobrimos os diferentes tipos de heatmaps que podem tornar mais fácil para você entender o comportamento do usuário. Todos os seguintes tipos de heatmaps são recursos da UXCam.

1. Heatmaps de aplicativos para gestos de frustração 

Imagine este cenário: Você usa um aplicativo e tenta tocar em um elemento, mas nada acontece. Você tenta tocar nele algumas vezes, não consegue o resultado esperado, fica frustrado e sai do aplicativo.

A UXCam chama este comportamento de "Rage Tap", ou gesto de frustração.

Um gesto de frustração representa gestos rápidos e com raiva. É definido por ao menos 3 gestos dentro de um determinado raio na tela e no máximo 300ms entre gestos consecutivos.

Essa métrica te mostra quando os usuários estão frustrados com um certo elemento em seu aplicativo. Com a UXCam, você pode gerar heatmaps que mostram quais são seus elementos que geram gestos de frustração, para ajudar a diminuir a insatisfação do usuário.

2. Heatmaps de aplicativos para gestos não responsivos 

Os gestos não responsivos são definidos como um elemento que é tocado, mas não é um elemento interativo. Portanto, o gesto não resulta em nenhuma resposta.

Podem ser gerados heatmaps de gestos não responsivos para mostrar elementos que chamam a atenção e levam ao clique quando não deveriam.

3. Heatmaps de aplicativos para primeiro gesto 

Os seres humanos são rápidos em formar uma primeira impressão. Com os heatmaps para primeiros gestos, você pode ver onde os usuários tocam intuitivamente quando veem uma tela pela primeira vez.

4. Heatmaps de aplicativos para último gesto

É muito útil saber como os usuários deixam seu aplicativo. Os heatmaps de último gesto permitem que você veja o gesto de saída de cada tela.

5. Heatmaps de aplicativos para diferentes dispositivos

Quando você desenvolve um app, ele precisa ser adaptado a uma grande variedade de dispositivos e de tamanhos de dispositivos. 

Se você olhar apenas para heatmaps de dispositivos específicos, você pode identificar problemas que são causados por configurações do dispositivo ou que ocorrem apenas neles, o que pode dificultar a sua análise completa da situação.

6. Heatmaps de aplicativos para paisagem e retrato

Os usuários podem usar seu aplicativo em modo paisagem ou retrato, e pode haver desafios com essas diferentes experiências. Você pode ajustar o mapa de calor de acordo com a escolha do usuário, e ver como a experiência dos usuários varia quando eles viram o dispositivo.

Principais benefícios da análise por heatmaps de aplicativos

Até o momento, nós cobrimos o que são heatmaps, mas por que você deve usar esse recurso? Especificamente, como a análise por mapas de calor pode melhorar o engajamento e a retenção de usuários no seu aplicativo?

1. Otimizar a interface do seu aplicativo

Um app visualmente atraente e fácil de usar trará clientes e os manterá sempre voltando.

Com heatmaps, você pode ver os elementos que recebem mais atenção dos usuários e os que ficam esquecidos. Ao fazer isso, você obtém uma ideia melhor do que os usuários querem com o seu aplicativo.

2. Criar uma experiência melhor para o usuário

Vamos dar uma olhada mais de perto em um cenário da UXCam.

Imagine que uma empresa que usa UXCam - vamos chamá-los de Photos Inc. - usa heatmaps para entender o comportamento do usuário. 

Com base nos resultados do mapa de calor acima, podemos ver que a página de login da Photo Inc. está boa, mas talvez não seja ideal para seus usuários. Os heatmaps nos mostram que a maioria dos usuários faz login com uma conta no Facebook ao invés de um endereço de e-mail.

Para aumentar a taxa de login do usuário e melhorar sua experiência, a Photo Inc. pode mover seu botão de login pelo Facebook para o topo da lista de opções.

Ao fazer isso, o login pelo Facebook torna-se mais proeminente e move o e-mail para o segundo lugar na lista. 

A primeira impressão dos usuários está relacionada ao design das telas em 94% dos casos.

Apenas essa pequena mudança pode se transformar em grandes melhorias para a Photo Inc. Que melhorias você poderia fazer em seu aplicativo?

3. Aumentar as conversões

Uma chamada para a ação (CTA, na abreviação em inglês) só é útil se seus leitores a virem e tocarem nela. Se ninguém vir seu CTA porque está muito abaixo na página ou está em um lugar estranho, então você poderá ver uma queda no onboardingdos usuários.

Se os usuários estiverem tentando clicar em uma área que não esteja linkada, você pode considerar colocar um CTA em uma área de alto tráfego que de outra forma seria desperdiçada.

Um ponto fundamental para melhorar as taxas de conversão no seu app, é entender os problemas dos seus usuários. Identificando pontos de saída inesperada nos fluxos projetados com os heatmaps, você consegue criar soluções simples como mudar o local do botão na tela, ou até mesmo uma solução mais complexa como alterar a lógica do fluxo apresentado.

Seu app precisa incluir mais direções para os usuários? Talvez exista algo que poderia ser mais simples? Talvez você esteja pedindo muita coisa cedo demais.

Qualquer que seja o problema, ele deve ser resolvido o mais rápido possível. Ao atender às necessidades de seus usuários, você também os encoraja a usar mais seu aplicativo. 

Os heatmaps de aplicativos são uma ferramenta fantástica que pode lhe poupar tempo, dinheiro e até mesmo uma ou duas dores de cabeça!

Como ler os Heatmaps

Os mapas de calor nos permitem compreender muitas informações em pouco tempo. Mas há algumas armadilhas que podem atrapalhar a análise do heatmap. Aqui estão quatro pontos a serem considerados ao ler um mapa de calor.

1. Prepare a análise do heatmap

Estabeleça uma meta antes de olhar seu mapa de calor. O que você quer alcançar com esta análise? 

Escolher uma hipótese antes de olhar os dados ajuda você a abordar a análise de forma mais objetiva e sistemática. Sem um objetivo, você perderá tempo com uma análise sem perspectiva, que pode até mesmo levar a interpretações errôneas. 

Este é um dos pontos mais importantes a ter em mente antes de começar a ler um mapa de calor. Para ver se os usuários estão gastando mais tempo em telas específicas, verifique a média de engajamento por tela.

2. Leve o tempo que precisar

Quanto mais dados, sempre melhor para se ter uma visão global dos usuários. O número de visitantes pelos quais você deve esperar antes de iniciar sua análise depende do tráfego do seu app.

Como regra geral, pelo menos 2.000 usuários devem ter visitado a respectiva tela para fazer uma declaração confiável sobre seu comportamento de uso. 

Caso contrário, a análise poderia ser baseada em alguns poucos usuários individuais que não são representativos. Se as características forem adaptadas a esses poucos usuários, a mudança pode até ser uma desvantagem.

3. Segmente os dados

Como você não estava sentado ao lado de seus usuários enquanto eles estavam usando seu aplicativo, você nunca pode ter certeza do que exatamente causou a atividade deles. Mas este problema também pode ser um pouco atenuado: segmente os dados e considere as circunstâncias de seu uso. 

Os principais critérios para segmentação de dados costumam ser::

• Tipo de Gesto

• Versão do Aplicativo

• Modelo de Dispositivo

• Versão do Sistema Operacional 

• Primeiro Gesto

• Último Gesto

Isto dará uma visão profunda dos hábitos de uso de seus usuários, a partir da qual você poderá dar os próximos passos para melhorar seu app. Aqui, também, o esforço de segmentação será recompensado para todos os envolvidos.

4. Compare resultados

Para descobrir se as mudanças que você fez no seu aplicativo estão alcançando o que você tinha em mente, você pode comparar os heatmaps antes e depois de sua mudança. Isto pode ser muito informativo e o ajudará a avaliar a eficácia das mudanças que você implementou. 

A mudança não termina após a sua implementação. Ela tem que ser analisada constantemente e melhorada ainda mais para alcançar o resultado mais satisfatório possível.

A diferença entre Heatmaps de aplicativo e de Web

Primeiro, qualquer pessoa que já trabalhou tanto em um produto web quantoaplicativo conhece as diferenças gerais entre a navegação móvel e a navegação em websites.

Os sites são colocados em telas maiores e têm um método de interação diferente dos apps (cliques vs. gestos). Isto torna o desenvolvimento de um sistema UX para aplicativos um desafio único.

Fora isso, a tecnologia é diferente. Em websites, o código HTML de seu website serve como base, então os dados de uso capturados geram os heatmaps.

Em aplicativos, o processo é mais complexo, uma vez que a UXCam precisa responder por diferentes tipos de plataformas de desenvolvimento (Native, React Native, IONIC, etc.).

Portanto, se você quiser usar o rastreamento de heatmap em seu app, procure uma solução móvel de heatmap que foi projetada com gestos de tela em mente.

Como transformar insights de heatmaps de aplicativo em ações com mais recursos de analytics

Gravação de sessão 

As gravações de sessão funcionam melhor com heatmaps para fornecer mais contexto para quem estiver analisando. O replay de sessão dá uma visão de como os usuários estão interagindo e navegando pelo seu app, agindo como um guia para você tomar decisões sobre design, funcionalidades ou priorização. 

Se você estiver usando a UXCam, você pode encontrar gravações de sessão juntamente com heatmaps. Basta ir até a aba Heatmaps e clicar na tela que você gostaria de analisar. 

Use as gravações das sessões junto com os heatmaps para: 

• Melhorar a usabilidade de seu aplicativo

• Ter uma impressão mais pessoal de como as pessoas interagem com seu aplicativo

• Ajuda a reduzir a taxa de rejeição

Procurando mais informações sobre o replay de sessões? Confira nosso artigo dedicado a analisar os prós e contras.

Análise de funil

Os funis nos permitem analisar o sucesso de cada passo em direção a uma conversão. Talvez haja gargalos no fluxo para conclusão de uma conversão importante que você desconhece. 

Na UXCam você pode criar funis, como um funil de inscrição ou um funil de check-out, para identificar se há altas taxas de abandono em uma tela específica e entender o comportamento do usuário. 

Uma vez que você tenha funis configurados, e você possa ver uma alta taxa de abandono em uma página específica, você pode ir ao heatmap dessa página e analisar onde esses usuários estão ficando frustrados.  

Fluxo de Telas

O fluxo da tela é semelhante aos funis, mas dá uma visão mais ampla. É possível entender o panorama geral de seu app em uma única visão. 

O fluxo da tela é ótimo para identificar gargalos e ver diferentes caminhos do usuário ao longo da jornada, como- conversões, drop-offs, entradas e saídas. 

Assim como nos funis, quando você percebe alguns dados comportamentais interessantes, você pode analisar os heatmaps para aquela página específica para obter mais informações. 

FAQs

O que é um heatmap de aplicativo?

Os heatmaps de apps são projetados especificamente para funcionar em aplicativos iOS ou Android. Eles mostram quais elementos de seu aplicativo obtêm o maior engajamento.

Um SDK de soluções analíticas como o da UXCam captura cada micro interação em seu app. Isto significa que ele grava automaticamente todos os gestos em suas respectivas telas.

Isto inclui gestos simples como cliques ou duplos cliques, mas também gestos sofisticados, por exemplo, gestos de pressionar longamente a tela, zoom ou movimentos contínuos.

Estes dados são então agregados para gerar os heatmaps. As representações  de cada tela servem para dar o contexto visual ao comportamento do aplicativo.

Como os heatmaps de aplicativo funcionam?

Para utilizar heatmaps para aplicativos, é necessário primeiro instalar o SDK da UXCam. O SDK captura os dados de uso, que depois são usados para gerar heatmaps para seu app.

Como ler os heatmaps de aplicativos? 

Você deve segmentar seus heatmaps com base em gestos específicos. Isto vai te ajudar a realizar uma análise detalhada.