Skip to content

How to analyse an attention heatmap

Read the original image, the predicted map and the design objective together. Learn what warm regions, coverage and a score can actually tell you.

By the Heatpoints team · Updated 9 September 2026

Try the image heatmap
Fictional Nimbus landing page used as model inputUNISAL prediction over the same landing page
Teaching example, not a customer result. The page is fictional; the map was calculated with UNISAL. Colours show relative saliency within this image, not clicks or a gaze path. Read the method

First identify the kind of heatmap

A click heatmap aggregates clicks from visitors. A scroll map summarises how far visitors reached. An eye-tracking heatmap aggregates gaze measurements from participants. An AI attention heatmap predicts saliency from an image. These maps can look similar while answering different questions.

Heatpoints produces the last kind. There is no visitor sample behind your uploaded image. Its colours are relative to that image and its processing settings, so a red area is not a percentage of visitors or a measurement of time spent looking.

References: UNISAL paper and implementation

Read the map against a stated objective

In the example below, the input is a fictional landing page and the overlay is a real model output. Decide which part should carry the message before inspecting the colours. This avoids inventing a story around whichever region happens to be warm.

  1. Identify the headline, product and intended action in the original.
  2. Locate the stronger regions in the prediction and name the elements they overlap.
  3. Check whether important information competes with navigation, decoration or a secondary offer.
  4. Return to the original image to check legibility, meaning and visual balance.
  5. Write one testable revision, not a general verdict that the page is good or bad.

Understand the summaries

The image tool's attention value is derived from average intensity in a normalised saliency map. Coverage is the share of pixels above a threshold. Hierarchy compares average intensity across regions of a three-by-three grid. Those summaries reduce a complex image to a few numbers.

They cannot identify a button semantically or measure the probability of a click. A small change near a grid boundary can alter the dominant zone. Compare outputs from the same tool and settings, and inspect the actual overlay before interpreting a numerical difference.

References: Metric definitions and scoring

Turn an observation into a test

For example: ‘The illustration attracts a stronger predicted region than the offer’ is an observation. ‘Reduce the illustration and preserve the offer's size’ is a revision. ‘More visitors will buy’ is a separate hypothesis that needs behavioural evidence.

Save comparable screenshots of the two versions. If the revised map supports your intended hierarchy, put the revision in front of users or measure it in a properly designed live experiment. Attention alone cannot establish comprehension or conversion.