Return to knowledge base main page

What is a Focus map, and how to interpret it?

Our feature Focus map is based on attention data, and it uses a transparency gradient to show which content users will see and which they will miss in the first few seconds when they see your design for the first time. 

The focus map highlights the parts that viewers will notice in the first 4 seconds by revealing them, and it also hides the design areas that users don’t notice in the first seconds under a black overlay.

A focus map of Muse meditation headband landing page.

A Focus map comes in very handy when using the 3Ws analysis method. In web design, the 3Ws method introduces three questions (What? Why? Where to?) that your design should address.

Your page should answer:

  • What is this page about?
  • Why should I care?
  • Where should I go next?

 

What” represents a product, service, or cause that the page is promoting. “Why” would be a value proposition. Finally, “Where to” is a call to action. It can also be applied to any other design in a similar fashion.

Find those elements in your design. Now toggle the Focus map and check if they’re still visible. If you can’t see either of these elements in the Focus map view, your users can’t see them also.

Make sure that users see the most critical elements of your designs. You can change the layout of your design or adjust positions, colors, contrast, whitespace, etc., to increase the visibility of either of these elements.

Here’s an example of a very well design product landing page:

The focus map of oura ring landing page

All the main elements – value proposition (heading and subheading), the product, and the Call to Action button – are revealed and definitely noticed by visitors.

0
151