Things to consider when running and interpreting heatmaps

So, we get that you are enthusiastic and excited to start running heatmaps for every single design you can think of, but first let's give it some thought. 

Like with any research study, there are a couple of important things to consider before we do anything.

Start at the beginning
Simply running a research study and expecting the outcome to tell you something might work in some cases, but we wouldn't call it a best practice. The first thing you need to ask yourself is "What is the primary goal of the material I'm testing?". It might sounds silly to state this, but many people will forget about this.

• If you're running a paid ads campaign, are you focusing on brand awareness or are you looking to generate new sales or attract leads? The same goes for an Out-Of-Home campaign.
• Is your web page purely informative or do you want users to act on what they see, like they would in a webshop or marketing focused landing page?
• If you're building an app, are you purely looking to push users through a flow quickly or do you prefer them to take the time and focus on other aspects?
• Is your packaging meant to only be informative or do you want to push your USP's, sustainability etc initiatives as well?

There is always something you are looking to achieve with your material.

Second thing to ask yourself is "What am I testing?", followed by "What am I testing for?". In every design there is something that is important to you, often linking to your goal, otherwise you wouldn't be creating it. It might be a single element, but it might also be multiple. Think about it. 

• Are you working on visuals for a brand awareness campaign? Then your brand name, logo and/or tagline are likely the most important factors in your design. 
• Do you know a certain product in your brochure or magazine will pull people towards your store? You would probably want people to notice that product first, but you also don't want them to miss your brand name.
• Want people to sign up for something on your landing page? Your CTA will probably be the thing to focus on.
• Running a sales campaign soon? Product and CTA are the way to go.

If we know WHAT we want to test, it becomes a lot easier to interpret the output data and with that it will become a lot easier to generate insights on which you can adjust/optimize/update your materials.

Once we have this in our heads, it's time to run our analysis. But first, let's take a look at an example we will be using over the rest of this article.

This is the visual of a social post published from the Xbox account on Twitter. The goal of this post was to share the pricing for the Xbox Series X and Series S for the first time. A couple of things we know in advance

• This is an informative post with one unique element noone had seen before: the pricing. 
• This will be posted from an Xbox branded account.
• The copy will mention the naming convention as well as the brand and pricing.
• People are already familiar with the name and looks of these consoles.
• The Xbox brand is well established: gamers would instantly recognise the Xbox logo.

Based on this knowledge, we would want to test attention for the pricing elements.

Running your analysis
Now we've done some thinking around what we actually want to test we can start running a prediction. Follow the steps, decide on the right heatmap pre-set or settings and wait until your result is shown in the mediaviewer. 

Let's take a look at the result of our example, on which we ran a prediction using the Normal heatmap pre-set.

Taking a look at the results
No we have a generated heatmap, it's time to take a look at the results, considering the questions we set in the beginning:

• "What is the primary goal of the material I'm testing?"
• "What am I testing?"
• "What am I testing for?"

It's important to note that, even if you've chosen a different visualisation of the heatmap (like our Reveal pre-set for example), the found salience values will always be the same. In our case, we've used the Normal heatmap, which uses the Jet color scheme, as depicted below.

The scale goes from dark blue (areas that aren't salient, salience = 0.01) to dark red (areas that are highly salient, salience = 1.00). For visualisation purposes areas that aren't salient at all (the salience value is 0) the heatmap becomes transparant.

Based on the generated heatmap, we might already be able to tell if the elements we find most important get enough attention, but to make things even clearer you can always use Areas Of Interest (AOI's). Since AOI's generate a percentage value of how likely it is that area receives attention, it also makes comparing designs a lot easier, for example if you have multiple variations of a design, or if you've created a new design based on previous outcomes.

Using AOI's is straight forward, so we recommend always using them. Simply draw them around the elements that are most important to you and take a look at the found values. The recommended value to ensure an element receives enough attention really depends on the material you are uploading, as we use the total size of the material in the AOI calculation. For example, a CTA on a website might draw 10% attention, but is only a fraction of the total size of the material. In this case the value is high enough. But, if you have an ad with in which the product is most important and the product takes up half the size of the ad but only gets about 30% attention, something is going wrong.

Let's take a closer look at our example ad, after adding the AOI's around the areas that are most important to us.

Not exactly what we wanted. We see our pricing only grabs 5.2% and 4.8% attention and we can also see there are loads of other elements drawing away attention, for example the the term XBOX as well as the name of the device, but also the tagline on the bottom left and the Series logo on the bottom right. On the upside, now we have some stuff to improve on.

Acting on the results
Now it's time to act on what we see. If you notice that the elements that are important to you don't get the desired amount of attention it's time to iterate the design. There are multiple things you can try to get the result you want, without losing the creative concept of your material:

• Experiment with contrast and colours (if your brand color scheme allows for it)
• Experiment with different layouts for your ad, sometimes just moving things further apart of closer together will help people focus on what's most important
• Ensure you aren't throwing in too many elements, clutter drastically impacts salience, use this to your advantage (Apple's website is a great example of a decluttered environment!)
• Keep things easy on the eyes, if viewers get bombarded with information they tend to not take anything in at all

Based on these lines, we've started adjusting this ad. It took us a couple of tries, but we ended up with a version that worked a lot better than the initial one!

It took us a couple of tries, but we definitely improved the attention for the price points!

So there you have it, a step by step approach covering various things to consider when running your predictions. For more best practices, take a look at this article.