Ecommerce product page design and micro conversion: an oft-forgotten KPI

What should the ecommerce product page design be like to convert users? What is micro conversion and why should you track it on this page? In this article we will give you illustrative examples of 7 effective ways to improve the add-to-cart rate and provide you with practical tips on the product page optimization.

What is micro conversion in the product card?

Micro conversions are steps and actions a website visitor takes before making a purchase. Every micro conversion brings the users closer to the target action.

According to Nielsen Norman Group, “micro conversions help you measure the impact of incremental user-experience improvements. Often, the effect of individual small changes cannot be detected at the macro-conversion level.”

The sales funnel of an online store consists of micro steps that users should make before the purchase. Adding the article to the shopping cart on the product page is one of those key micro steps that bring them closer to macro conversion.

Thus, all your efforts should not be focused exclusively on the sales increase (macro conversions). Conversion rate suffers when the online store fails to stimulate its customers’ micro actions and maintain the sales dynamics. Start with the optimization of micro conversions –– for example, from the improvement of the product card design.

What should the ecommerce product page design be like to ensure high micro conversion?

Here are some basic tips that will help you design the product card so that to increase the probability of adding the product to the cart.

1. Use high-quality product images and video reviews

One of the best ways to gain trust and improve KPIs on the product page is to place big clear product pictures and interactive videos there. If possible, 3D product reviews should be also added to make the users feel as though they are shopping offline.

With a limited budget, many new online stores neglect this aspect. However, despite the costs involved, there is nothing that persuades the visitors to press the “Buy” button better than high-quality product photos and videos made from different angles.

2. Add social proof

You can spend all your marketing budget on the ads on Google, Facebook and other platforms, but they will never be as powerful as recommendations of real customers.

• 93% of customers read online reviews before buying a product.
• Positive reviews remain a key way for companies to sell their product, with customers willing to spend 31% more on a business with excellent reviews. 
• 72% of customers don’t take any actions until they read product reviews.
• 84% of people trust the reviews they read on the Internet as much as personal recommendations.

Posting reviews of real customers in the product card helps build trust and gives potential customers the emotional information they need for making a decision.

Thus, for example, a review block is an absolute must-have for children’s products online stores. It is crucial for new parents to understand the experience of other users and learn from it. By providing an opportunity to post or read a product review you enhance trust in the product and brand.

 3. Give some thought to the hierarchy of elements in the product card

Thanks to such giant brands as Apple, Nike, Beats and many others, customers began to appreciate and even expect minimalistic design in online shopping.

In order to avoid basic mistakes in the product page web design:

• Leave only the most relevant and important information about the product;
• Use the space rationally, so that the blocks could be easily distinguished;
• Prioritize the target actions. Place one CTA button that stands out with a high-contrast color and make it available when the page is scrolled.

4. Increase your website loading speed

A Google research showed that 90% of mobile users leave websites whose loading takes more than three seconds. And according to a MachMetrics report, the loading time for most of the sites is 8-11 seconds, which means they are losing potential customers.

Pay attention to the loading speed of the product card when the user moves there from the product list page, as well as at the speed with which the adding to the cart is displayed.

To make your product page and website in general load faster:

• Reduce HTTP requests on your site.
• Compress files and website images.
• Fix broken links.
• Make sure that the site is optimized for mobile devices. This can be done with the help of Mobile Friendly Test.
• Check the website speed using Google PageSpeed Insights, and then identify and eliminate any additional reasons for slow loading.

5. Make mobile conversions a priority

According to Statista, 72.9% of the whole e-commerce market is expected to be generated through m-commerce in 2021. Therefore, if you want to increase the conversion rate, first of all it is necessary to optimize the product card for mobile devices.  

If the page is loading too long or displayed incorrectly on a mobile device, the user will simply leave. Make sure that you can not only view the product, but also buy it from mobile devices.

Thus, when designing your website, use the mobile-first principle and follow the patterns of mobile applications. That is, the interaction with the website should be similar to that with a mobile app.

• Use swipes.

• Use fixed CTA buttons, so that the user could add the product to the cart at any moment.

• Dropdown windows and pop-ups should look like a separate screen, and not like a modal window. Thus, the user can focus on the action the screen calls for without being distracted by the background of the page.

6. Use cross-sell and upsell tools

Product card design is most effective when cross-sell and upsell tools are used. Add a block “Frequently bought together”, “Similar items you may like”, “Customers who bought this item also bought”, etc.

7. Use nudge marketing techniques

Users can be encouraged to make a purchase when they are informed that the amount of the goods in stock is limited or the product is in high demand. Add such messages as “100+ people bought this product this week”, “Only N left in stock”, “This product is viewed by N people now”, etc. These are examples of nudge marketing encouraging users to make fast purchasing decisions.

However, it is important not to overdo it, so as not to drive away the customer with excessive triggers.

Why should micro conversions in the product card be optimized?

As our UX designer Max says, “It’s better to eat your pie piece by piece”, which means that it is much easier to understand and optimize user tasks at each particular step, rather than try and change the entire funnel at once. Thus, it is easier to understand the user experience and the arising problems in order to be able to address each of them in the interface later on.

Optimize your ecommerce product page design taking into account micro actions, and you will increase user conversion and, consequently, improve the KPIs of your online store.