How to interpret the first analyses?

In your analysis, you see an attention heatmap overlayed over your design. Warmer colors indicate places that get more user’s attention. Cooler colors indicate places that get a little bit less attention, and where there are no colored spots, those places get 0% or very close to 0%. The warmest color that we use to indicate places that get the most attention is dark red, and the coolest is blue. 

You can also see a Clarity score in the right sidebar that shows how clear the design is for a new user, whether it is overloaded with elements and conflicting colors or it is clean and clear. The higher the score, the more clean-looking the design is. On the other hand, a low score indicates that your design is cluttered and important elements are not easily visible. Below the Clarity score, you can see the Clarity benchmark text that tells you how your design is doing compared to the most popular websites regarding clarity. 

On the heatmap, you can draw Areas of Interest that allow you to quantify data of the heatmap and get an exact Percentage of Attention a particular object receives. For example, you can draw an Area of Interest over your CTA button and find out how much average user’s attention it attracts. If you’re not happy with that result, you can adjust your CTA by changing its color, contrast, size, position, and text. Then you can test it again to see if you succeeded in increasing the attention it gets. 


You can see the attention percentages of your Areas of Interest in the left sidebar and, depending on the Benchmark type that you selected, design elements visibility benchmark, and some recommendations. 

If you want to learn more on how to test your design using Areas of Interest and the Percentage of Attention, you can check this: