Various types of heatmap analysis are done while conducting UX research. 1) Mouse Tracking A) Click or Tap Heatmap B) Mouse Movement Map C) Scroll Map D) Confetti Map 2) Eye Tracking Heatmap 3) Predictive Eye Tracking Heatmap Download the pdf version of the presentation https://dhitiai.hubspotpagebuilder.com/types-of-heatmaps-by-dhiti Get a free heatmap analysis https://form.jotform.com/202183299423456 For more information Dhiti - Design Smarter with Neuroscience and AI https://www.dhitiai.com/

1. Types of
Heat Maps
UI/UX Usability Research

2. A) CLICK OR TAP MAP
B) MOUSE MOVEMENT MAP
C) SCROLL MAP
D) COINFETTI MAP
1) MOUSE TRACKING
Those are the most popular and commonly used heat map types. In order to capture the
users data you need to add some monitoring code on your website.
It allows to operate long enough to gather appropriate data and end up with an fascinating
insight into how consumer communicate with their mouse while browsing a website. There
are four major forms of mouse heat map that you can use

3. A) CLICK OR TAP HEATMAP
1) MOUSE TRACKING
Image source- https://www.hotjar.com
Click or tap heat maps to see where the users click. Tapping can be monitored if it is on mobile
/ tablet devices based on a touch screen. Such heat maps help you spot problems easily with
your website such as are people clicking on the links? or are they clicking on links which are not
clickable? They view which sections of a page are clicked on most (and least).
Click maps are helpful to visualize what links & buttons are being used and also to find usability
issues. The heat map is color coded to display the most clicked items to least clicked (red ,
green, yellow).

4. B) MOUSE MOVEMENT HEAT MAP
1) MOUSE TRACKING
Image source - https://talkroute.com/heat-maps-worth-every-penny-or-a-waste-of-time/
Move maps are mouse tracking heat maps. Move maps watch where users move and stop
their mouse when browsing the website. The red spots points in a move map display when
you stop the mouse.
Evidence in research shows a correlation between where users are searching and where their
mouse is. A move map informs you where users are seeing when they are scrolling around the
website.

5. C) SCROLL MAP
1) MOUSE TRACKING
Image source - https://www.crazyegg.com
Scroll maps give you the actual proportion of people who scroll to any point on the page: the
more red the location, the more users had seen it. A scroll map is a website heat chart
displaying how quickly users travel down a site.
The most noticeable and least prominent portions of a website from hot (popular) to cold
(unpopular) can be obtained with scroll maps on a laptop, smartphone, tablet and screen.

6. D) CONFETTI MAP
1) MOUSE TRACKING
Image source - https://www.crazyegg.com
Confetti maps are special because they don’t just show the density of clicks. Instead, they
show it like it is, that is, how many users clicked and where exactly they clicked. As a result,
you can see all the mouse clicks on the page in the form of dots.
Most tools offering the confetti heat map as a feature often also feature a method of seeing
which clicks came from which sources. For example, depending on how long you waited to
aggregate the results, you’ll see a number of multi colored dots strewn about the screen
(hence the name confetti).

7. 2) EYE TRACKING HEAT MAP
Image source - https://www.neurotechnology.com//
There are 2 main types of heat maps in eye tracking, and they're very different. A fixation
volume heat map shows which parts of the page attracted the highest number of eye
fixations. Fixation duration heat map shows how long they looked in a particular spot.
For example, a fixation volume heat map will be more useful to understand which content
actually stands out in a design (i.e. is the most eye-catching), while a fixation duration heat
map might provide more insight into which content was most visually interesting for users.

8. 2) EYE TRACKING HEAT MAP
Image source - https://www.neurotechnology.com//
Pros –
• In depth insight beyond the transactional nature of clicks and mouse movements.
• Can conduct controlled study on prototypes and mock-ups designs
Cons –
• It tends to be expensive and time-consuming
• It needs respondents and takes weeks to complete the project

9. 3) ATTENTION HEAT MAP
(Predictive Eye Tracking)
Image source - https://www.dhitiai.com
Visual attention tool like Dhiti simulates human visions and shows which elements of design
are likely to get more attention by predicating visual saliency of it. This map is the equivalent of
a 5 seconds eye tracking session of 50 participants.
It shows which content is most and least eye catching for users when they first arrive. The
results from Dhiti are 90% as accurate as lab-based eye tracking. The Heat map displays the
most attractive elements of the image for viewers in the form of "hot" and "cold" spots
creating so called heat map.

10. Image source - https://www.dhitiai.com
The Core Principle
“As humans, irrespective of our cultures, genders and age groups, our visual system is wired
to look at very much the same aspect of any design/image in first few seconds of viewing.
That’s why it is possible to generate a predictive model of human visual attention.”
Dhiti AI- A predictive eye tracking tool for designers, advertisers, marketers , agencies and
brands to pre-test your print and digital advertisements, signage, websites, apps, e-mail,
packaging & shelf layouts.
3) ATTENTION HEAT MAP
(Predictive Eye Tracking)

11. Types of
Heat Maps
UI/UX Usability Research
www.dhitiai.com