If you use a Figma prototype in a usability test and connect your Figma account, Dscout will generate heat maps for your prototype. Dscout will include heat map thumbnails of each frame that was visited by participants during the duration of the usability task.
Requirements to generate heat maps
- Heat maps only work with Figma prototype URLs.
- Heat maps are only available for task questions in usability tests.
- Once a Figma prototype has been introduced to participants through a task question, all subsequent tasks where participants have access to the prototype will generate heat maps as long as at least one participant interacts with the prototype during the duration of that task.
- You must connect your Figma account to Dscout to see heat maps.
Viewing heat maps
If the above criteria are met, heat maps will be available in the analysis for that task. To view a heat map, select the Heat maps tab in your task analysis.
Here, you'll find thumbnails of each frame visited by your participants. If a frame was not visited by any participants during the duration of the mission, it will not be included in the heat map.
Clicking on a thumbnail will open up a modal that shows a heat map representing the density of clicks from all participants.
- Red = more clicks
- Lighter blue = fewer clicks
Navigating the heat map
Once you open a thumbnail to view the heat map, you can zoom in on the heat map and scroll to focus your view.
On the left sidebar, you can select a different heat map frame to view.
You can hover over an area of the heat map or on a click area in the Click areas sidebar to see the following details on the heat map: the click area outlined in blue, the click area title (Figma layer that was clicked), and the number of clicks across participants for that click area. The order of the click groups is determined by the Figma design file. Learn more about Click areas below.
You can filter the data being displayed in the heat map using the Filters icon. If filters are applied, the heat map will show the filtered participant view with an updated participant count (for example, 15/24 participants).
Click areas
Clicking on an area of a heat map or on a click area in the sidebar will bring that area into focus. In this selected state:
- The click area (in the right sidebar) will expand to show all participants who clicked in that area.
- Clicking on a participant within a click area opens their session recording in a new tab at the moment of this click.
- The Heat map also highlights the click area(s). You can hover over the click areas to further explore the number of clicks by participant for that click area.
To exit the Click area focused view, click anywhere on the heat map, the “x” button on the click area label, or select a new click area in the sidebar.
Viewing click data in the Clicks tab
If you select a participant in the Click areas sidebar, you will be navigated to the participant’s full video session at the moment of that click. A Clicks tab will appear in the right sidebar with all of the click events from that prototype for that participant. The Clicks tab will show the timing of each click and the name of the Figma design element that was clicked. If you did not connect a Figma account prior to launching the mission, the clicks will be labeled “clicks,” and no specific element will be shown.
Exporting your Heat maps
Heat map thumbnails can be exported as a PNG file using the export button on each thumbnail.