We just launched a game-changing feature designed to optimize your e-commerce site and supercharge your sales. Say goodbye to guesswork and hello to data-driven insights that will revolutionize the way you understand customer interactions. With Conversion Heatmaps, you’ll gain specific and powerful data on conversions for each element of your website.

What is Conversion Heatmap?

Heatmaps show which portions of the website are getting more traction than others, but Conversion Heatmaps show which elements drive purchase conversions. This allows for a closer look at what website elements are producing the most value for the website owner. Below you’ll see a product with a 2.4% conversion rate based on the sessions interacted from that specific element on the page.

Viewing Conversion Map 

Here’s how it works: first, make sure that the Clarity tracking code is installed on all pages of your Shopify site. Then, log into Clarity, navigate to the Heatmaps tab, and hit the Conversion Heatmaps icon (1)! Pick a page and view the heatmap overlaid onto it. You’ll be able to view the conversion rate as a percentage (2) of all sessions that resulted in a purchase when a user clicks in a selected area. 

Editing Conversion Map 

Want even more control over your data? No problem! With our Edit Areas (3) function, you can select new regions on the maps or remove existing ones with just a few clicks. And if you want to see recordings of where users clicked an element, simply select “View Recordings (4).” Getting valuable insights into your e-commerce site’s performance has never been easier. 

How to use Heatmaps and Conversion Heatmaps together

If you’ve used click heatmaps and scroll heatmaps before, you know how helpful they are to understanding what your users are clicking on and how far down your page they’re viewing. By pairing this analysis with our purchase Conversion Heatmap, you can now optimize your site more strongly towards purchases. Let’s take a look at a couple examples. 

• Your Conversion Heatmap shows very high conversion rate on a product, meaning that a customer is likely to purchase whenever they click on that product. However, from the corresponding scroll heatmap, you can see that the product is below fold—meaning your customers typically don’t even see the product unless they scroll. One change you can consider here to increase sales is moving the product higher on your page, to be visible above fold. 
• Your Conversion Heatmap shows a very low conversion rate on an element, meaning that a customer is not likely to purchase whenever they click on that product. Additionally, from the corresponding click heatmap, you can see this same element has many clicks. This indicates the element is worth looking into, as something seems to be preventing your users who click on this element, from purchasing. 
  • One scenario could be your search bar. Users interact with your search bar frequently -but if an extremely low number actually purchase, it is worth looking at corresponding recordings to confirm what’s happening. It’s possible your search algorithm is poor, leading to users not finding what they’re looking for, or your advertisements are misleading, causing users to enter with mismatched expectations. 
  • Another scenario could be your “Add to cart” button. Users select that button frequently, but if there is an extremely low purchase rate from those users, something could be causing friction in the purchasing funnel. This could be anything from a confusing checkout process, pricing, or shipping discrepancies.

Don’t let the potential of your e-commerce site go untapped. Harness the power of Microsoft Clarity’s Conversion Heatmap feature and unlock the secrets to optimizing your online business. Start making data-driven decisions and watch as your sales soar to new heights. The future of e-commerce success is at your fingertips.

Final Thoughts

Want to learn more about Conversion Heatmaps? Check out the documentation here!

We’d love to hear how you use Conversion Heatmaps; let us know at: claritycasestudies@microsoft.com.

This feature is currently only available for Shopify stores, but if you want to see it on other platforms, let us know!