Use heatmaps to get quick and deep insights into your user experience and screen performance. Optimize screen elements, uncover usability issues and improve the UX of your screens to increase the users' engagement or drive conversions.
- Find out which screen elements get the most and least attention
- Learn whether users behave differently as intended with unresponsive gestures. Are users trying to interact with elements that have not been designed to be interactive?
- Identify if users are getting distracted by irrelevant elements and make changes to focus their attention.
- Identify if users behave differently on different devices, operating systems or app versions to ensure an optimized UX across platforms.
Date range and filters
Use the calendar in the upper right corner to select any period you want to analyze.
Filter your heatmaps based on any session, user, or device properties to compare the behavior and interactions of your users.
- Compare the user behavior for specific app versions or OS by using device properties.
- Compare the behavior between users that visited the screen at the beginning of their session vs. those that came back to the same screen. (First/Last screen in session)
- Analyze interactions based on user properties such as subscription type, age, city, country, etc.
- Analyse results of your A/B test and make informed decisions - compare variant A vs. variant B users using custom user properties.
Device Class & Orientation Selection
Select the device class or size (eg. android large) you are interested in and the orientation mode (eg. portrait vs. landscape). The heatmap displayed will change depending on what you select.
You can identify issues that are caused by or occur only on specific mobile devices.
Heatmap Gesture Analysis
Heatmaps show you where and how your users interact with your screen. Get to the nitty gritty by filtering by gesture type (tap, swipe, zoom) or based on specific types of interactions such as Rage taps (frustration), First and last gestures, or Unresponsive gestures.
You can combine filters for a more in-depth analysis. For instance, to view the first swipes on the screen.
Are you looking for scrolls? Swipe-up is the equivalent of scrolling down, while Swipe-down is the equivalent of scrolling up.
To dig deeper into your users' interactions with certain elements of your screen, hover over a specific section of the heatmap to view how many users interacted with that component, you can also view other details such as:
- Number of gestures
- Type of gestures
- Number users
- Time until gesture was performed
Use Heatmap Breakdown by UI Elements to:
- Identify the most or least popular screen elements of your screen
- Filter heatmap by rage taps and use tooltips to identify which one of those areas has the highest number of rage taps and needs to be prioritized urgently.
- Discover how long it takes for your users to click on any specific part of the screen.
- Find out how many users interact with any area of the screen.
- Analyze conversions by viewing clicks on your call to actions
- Uncover UI and UX problems by viewing if users try to interact with your screens in unexpected ways.
- Find if certain elements are perceived as interactive when they’re not thanks to unresponsive gestures.
To gather more context on the users' experience and view the whole user journey you can watch the sessions based on screen transitions. Just switch to the screen visits tab to see the list of sessions with visits to that screen. Sort the table by any columns or decide what to watch based on the next/previous screen, screen duration, or any of the available properties there.
The session replay will only play that specific transition by default, you can replay the transition or continue watching the session. Please note that since one screen can be visited many times during the same session, you might have different transitions to play for the same user session.
To navigate to the next screen session you can use the arrows to the right or left of the video replay.
Heatmaps aggregate large numbers of data interactions from users and visualize it in a way that allows us to quickly and accurately draw conclusions from the results. A Heatmap is not a single screenshot, it is created from many user sessions.
We take up to 20 screenshots of the same screen to make sure there's an accurate representation of the screen below the generated heatmap. It might happen that on some of the screenshots the screen is loading, the keyboard is open or a banner appeared. Hence, having multiple screenshots is key.
If you see screenshots from different screens on the same heatmap (e.g. cart and purchase confirmation screens) it's due to incorrect screen tagging. Review our screen tag API with your developers to ensure correct implementation.
On the left side, the screen page provides a lot of quantitative insights about the selected screen. At a glance, you can learn about the number of screen visits, distinct users, visit duration, count of gestures, app quit rate %, visits with crashes and UI freezes. The % change compared to the previous period is also displayed.
On the right side, you can see statistics on gestures used in the selected screen. You have an actual breakdown of the proportions of each type of gesture and sub-gesture. (Tap : Single Tap, Double Tap, Long Press Swipe : Up, Down, Left, Right, Trail Zoom : Zoom In, Zoom Out) You can easily identify what is the most common gestures users interact with a particular screen.