What are heatmaps?
Heatmaps are a visual way of showing where people are clicking on your website. You can also use heatmaps to monitor mouse movement and scrolling behaviour.
Real Life Example
This Volcanic website was re-designed in September 2015. As part of the post launch optimisation, we wanted to understand which components of our site were most interesting.
In a highstreet store you can quickly see how customers move through your store and see which products attract their attention. It is also clear which things can cause frustration, as your customers will tell you face to face.
We can achieve a similar feedback process using heatmaps.
By aggregating users behaviour together, we can quickly understand what's going on. Take a look at this heatmap showing a section of the homepage:
We can learn a number of things from this visual:
- People are more interested in build and launch.
- People expect to be able to click on the boxes and the green circles.
- People are actually interested in this area of the homepage becuase they are showing their interest through increased clicking
We can use this deeper understanding of their behaviour to improve their User Experience (also referred to UX).
We should aim to please our users by offering a reward for their activity. Like training a dog, we want to reward positive behaviour. If a user does something favourable we need a way to reward using a virtual dog biscuit.
It's also worth remembering that humans seek consistency (as do dogs). We can provide this reward at a very basic level by responding with the user's expectation.
Responding with the user's expectation
Heatmaps are a great way to provide the clues to what a user is expecting. In the example above, the user has accurately clicked on the boxes and circles expecting some specific response. At the point of launch this didn't do anything in response, which is bad.
What the user is expecting is some form of interaction. As they click, they expect their clicks to trigger some transformation and be presented with something in exchange for their attention and input. This is now an easy task, we simply need to enhance this component so it supports some interaction.
Repeat, Refine, Repeat
This process is referred to as continual improvement. Small changes made regularly all add up to an amazing user experience.
- Heatmaps visually describe users behaviour
- You can easily understand what actions to take
- Make the improvements and do it again