Heatcast: A Free Attention Heatmap Tool That Needs No Traffic

Heatcast is live in the Chrome Web Store. It’s a free attention heatmap tool that shows you where people are likely to look on a page, before anyone visits it.

I built it because I got curious about how people actually look at a web page. Not best practices. Where the eye physically goes first, and what it skips.

There’s a lot of research on it. Most of what I thought was design opinion turns out to be measurable.

Key takeaways

• It’s free, it works in Chrome, and the prediction runs on your own computer.
• You don’t need traffic or a tracking script, so it works on pages you haven’t launched and on sites you don’t own.
• You get a heatmap, the order people are likely to look in, how far down the page attention holds up, and an HTML report you can save as a PDF.
• It’s a prediction, not a recording. It won’t tell you about your specific visitors and it won’t move your rankings.

What the attention heatmap shows you

Open a page, click the extension, and it draws a heatmap over what’s on screen. Warm means people are likely to look there. Cool means they’re likely to skip it.

There’s more in it than the heatmap. The scanpath animates the order people are likely to look in. The scroll view shows how far down the page attention still holds up. The full-page report exports as an HTML file. Open it in your browser, or save it as a PDF to send on.

Why predict it instead of measuring it

Click maps and session recordings are good and I still use them. But they all need something to happen first. A page you haven’t launched has no clicks to map. A competitor isn’t going to let you put a script on their site.

A prediction works on those pages, and it costs nothing per page. The catch is that it tells you about people in general, not about your visitors. I went through how to read that properly in how to read an attention heatmap.

What it doesn’t do

It never touches your camera and it never watches a visitor.

There’s face detection in it, because research shows people look at faces first. All it does is notice that a face is there. It doesn’t guess who they are, how old they are, or how they feel, and it doesn’t save any face images.

The prediction runs on your computer. The model files ship inside the extension, so no page content is sent anywhere to build the heatmap.

And it won’t move your rankings. This is a design tool, not an SEO tool.

What’s coming next

This is just the announcement. Over the next couple of weeks I’m publishing the longer pieces: what the research actually found, who this helps and when, how to read a heatmap without drawing the wrong conclusion, and where the predictions stop being reliable.

More detail on the tool, including the privacy specifics, is on the Heatcast page.

FAQ

I built this to answer a question I had. It turned out to be useful, so it’s free. If it gets something wrong on your page, I’d like to hear about it.

Sources

1. Cerf, Harel, Einhäuser and Koch, “Predicting human gaze using low-level saliency combined with face detection,” NIPS 2007, on people fixating faces within their first two fixations. papers.nips.cc
2. Jiang et al., “UEyes: Understanding Visual Saliency across User Interface Types,” CHI 2023, on how people look at interfaces differently than at photos. github.com/YueJiang-nj/UEyes-CHI2023
3. Hu and McGuinness, “FastSal: a Computationally Efficient Network for Visual Saliency Prediction” (2020), the model behind the heatmap. arxiv.org/abs/2008.11151