Heatmaps

Heatmaps uses Session Replay to provide a visual representation of user engagement on your website or application over time. Analyze patterns of events to identify trends, anomalies, and areas of your product that drive the most engagement.

Use the following map types, depending on your use case,

Feature availability

Heatmaps are available to customers on Growth and Enterprise plans who have the Session Replay addon.

Prerequisites

Before you create a heatmap, ensure your Amplitude instrumentation meets the following requirements.

Session Replay

Heatmaps requires the following minimums:

• Session Replay Browser SDK Plugin: 1.7.0
• Session Replay Standalone SDK: 1.14.0

No server-side identifiers

Heatmaps requires Amplitude's default device identifiers from the Browser SDK and doesn't support device identifiers from server-side SDKs or third party data sources.

Create a development project (optional)

Amplitude recommends that you create a separate development project to test Heatmapping without impacting your production environment.

Create a Heatmap

To create a new Heatmap:

1. Navigate to Heatmaps in the left navigation in Amplitude.
2. Click + New Heatmap.
3. Choose a Heatmap type. You can update the map type after at any point.
4. Select the URL to analyze. Use the following URL matching options to more easily target the pages you care about.
   • Exact match: Matches the URL exactly as you specify it. Ideal for single URLs. For example, https://amplitude.com.
   • Pattern match: Uses wild cards to match more than one URL with a similar patterns. Useful for targeting dynamic paths. For example, https://amplistore/prodcuts/* matches /products/shoes and /product/accessories.
   • Contains: Matches URLs that contain a specific keyword or segment anywhere in the URL. Useful for common themes. For example /search?q= matches the search results page for any user query.
   • Starts with: Matches all URLs that begin with a specific prefix. Useful for capturing sections of a site. For example, https://amplitude.com/blog captures the /blog page and all subpages.
5. Select or create a Segment using user properties or cohorts to narrow the focus to a specific set of users.
6. Optionally, select different device types to see how users interact on devices of different widths.
7. Choose a background to select the background of your heatmap. Backgrounds are snapshots of a session replay, and represent the page's state during replay collection. Each heatmap generates eight backgrounds, based on the state of the page that generates the most actions during a session.

Map types

Heatmaps provides three views that help you understand how users engage with a specific page.

Click map

Click maps provide a color-coded display of the clicks, or "heat" on your page. Areas with few clicks appear blue, while busier areas appear green, yellow, orange, and red in order of increasing clicks.

Microscope

Highlight an area of the click map to access Microscope. From there, you can:

• View the events in the highlighted area for deeper visibilty into user actions or create a chart to further analyze trends and behaviors across your data.
• View replays of user sessions that contain the events in your selection to combine the quantitative insights from Heatmaps to the qualitative context from Session Replay.
• Create a cohort of users who interact with a specific area of a page. For more information, see Behavioral Cohorts

Selector map

The Selector view displays a wire frame of clickable elements on the page, ranked by number of clicks in descending order. Select an element on the map, or in the list to watch Session Replays of those events, view the raw events, or create a cohort of users who engaged with selector.

Microscope

Select a ranked element on the page to access Microscope. From there you can:

• View the events associated with the element area for deeper visibilty into user actions or create a chart to further analyze trends and behaviors across your data.
• View replays of user sessions that contain an interaction with the selected element to combine the quantitative insights from Heatmaps to the qualitative context from Session Replay.
• Create a cohort of users who interact with a specific element. For more information, see Behavioral Cohorts

Scroll map

The Scrollmap shows the unique users, and percentage of unique users who have scrolled that part of the page into their view port. Use the handle on the slider to adjust the scroll depth.

This view also shows the average fold of your page. The amount of the page that appeared on a user's device without the need to scroll.

On the list to the right of the map, click Watch Replays to view Session Replays of users who saw at least that much of your page.