It’s Thursday evening, and the kids are in bed. So it’s a good time to turn on the TV. Coincidence or not, a new episode of *Kamp van Koningsbrugge* is about to start. It’s a great show about perseverance and team spirit during special forces commando training. The participants have been awake for hours and are running on fumes. Having barely eaten and fighting off sleep, the next nighttime mission is on the agenda. They must find tags with their own names on them in the pitch-black forest. The only equipment the participants are given is a headlamp, a compass, and a map. It’s a challenge with little sleep and very little light—so little that you can only see about a meter ahead of you. The surrounding landscape remains hidden in the dark of night. Add to that the extreme physical exhaustion and the cold, and you’ve got an incredibly grueling mission.
Evaluation
It’s interesting to see how the different participants handle this. Some struggle immensely, others a little less, and still others not at all. Afterward, there’s a debriefing about the various challenges everyone faced. What I (Wim Snoep) found myself wondering while watching this assignment: How can you train even more for a situation like this? Can you learn from your navigation mistakes? Or learn from others? Wouldn’t it be great to be able to look back and see: How did I navigate? Where did I go wrong? How did the other person fare on their route to the same point? What did I actually see at that moment at 3 a.m.? Of course, you need a tracker that can tell you this. But imagine if you were wearing one. Then you could map out your route(s) from that night, and you could also map out the routes of others. Then you could compare your route with those of the others. Where did I stop for a long time? What was I looking at then? What might I have been looking for? Can I see and experience again what I saw myself at that moment—or what the other person saw?
A visualization like this is very useful for identifying, in practical terms, where your routes could be improved—where everyone got stuck, which point was easiest to reach, and so on. This type of visualization is called a heat map. Heat maps use “thermal images” to show you which areas are hotspots and which places are visited less frequently. This is particularly valuable in the situation described above.
From the Commando heatmap to the organization
Try applying this idea to your organization. Like any company, we use many different types of business applications to do our work—for example, as a controller, a buyer, or an engineer on the factory floor. Do people know exactly how the various applications work? How effective are they? Where are the opportunities for improvement?
As you can imagine, a heatmap like this can provide a very insightful picture. A heatmap shows which features in your application are being used—and which aren’t. A heatmap also shows which buttons are being used (or not) and how often they’re clicked. This, in turn, can lead to further investigation. Why aren’t they being used? Which user groups are using them—and which aren’t? For example, it might become apparent that certain buttons aren’t visible in a particular type of browser. You can imagine that once you can look over the user’s shoulder—almost literally—after the fact, or get a picture of what 10,000 users per day are doing (or not doing) in various applications, this can yield a wealth of insights.
Here’s an example:
Features
- There are various solutions that you can “integrate” into your web application(s) to help you analyze behavior and functionality. Here are a few examples of such solutions:
- Mouse movement per individual user.
- Heat maps by application. The heat map uses colors to indicate whether there is a lot or a little activity within your application. These can be further broken down into click maps, scroll maps, and mouse maps.
- Clicks by an individual user.
- No activity/focus (anymore) insight.
- Recording a user’s activity. The visit is recorded. This allows you to review mouse movements and clicks. You can use this to map out your user flow.
- Blurring or masking certain parts of the screen, such as when the user’s name is displayed in the upper-right corner, or content that could be traced back to a user.
- Filtering/segmenting data in the heat map.
- Exporting/importing data/user segments.
Depending on the solution, the scope may sometimes be broader or narrower than the list above.
Click Map, Scroll Map, Movement Map
Click maps are very useful for determining whether users are actually clicking buttons, or whether they simply think a particular visualization is a button and therefore expect to find one there. You can also use them to find out, when a feature can be accessed in two ways, which one is used most often (or stands out the most).
A scroll map uses color to show how many users actually scroll down your page. For example, how thoroughly is a blog post or article being read? Or, to give another example, is the user looking for something they can’t find because they aren’t scrolling far enough down?
A Movement Map shows the position of the mouse cursor. This is very interesting because users often “read” by moving the mouse across the page. This allows you to easily determine what is being read or viewed frequently, where people linger, and thus what might be more difficult to read or understand. You can also see if a user is looking for something. This might be an indication that you should simplify things a bit.
In particular, the combination of user behavior data and the various maps mentioned above provides a very clear picture of where potential areas for attention or improvement lie.
This heatmap software is often used in conjunction with implicit feedback (tracking the number of users per application or page) or explicit feedback (asking about user experience). Some solutions offer a combination of implicit feedback.
Well-known heatmap tools include:
- Mouseflow
- Contentsquare (Clicktale)
- Hotjar
How does it work?
Well, it’s actually very simple. A small piece of JavaScript needs to be added to the webpage code. This is often very easy with custom-built applications that are actively being modified. Is the application a standard SaaS solution? In that case, adding a piece of script might not be possible or could be very difficult. If your organization uses implicit or explicit feedback solutions, the script can undoubtedly be integrated with them. Even more convenient is using a tag manager that handles the script within the application. In the tag manager, you can link it to a heat map, analytics, or an explicit feedback solution.
Want to learn more about optimizing UX?
Would you like to learn more about different heatmap solutions or about gathering feedback in general? Feel free to leave a message below or contact us.
