Almost every online store customer visits a product card before making a purchase. However there are different reasons why it is viewed. Some customers enter the product pages without any specific expectations about a particular model or brand, others know exactly what they want and going straight to the details (or even to the checkout) is their priority. The product card should therefore provide such a selection of elements that the information provided to customers is satisfactory and leads them directly to the shopping cart.

Product photos

You probably don’t need to remind anyone that the pictures on the product card should be large enough and of good quality. However, when it comes to their selection, the matter is not so obvious. It is a good idea to share photos that give a comparison of the product on a scale. The possibility to estimate the actual dimensions of the product on the basis of a “real life” photo or in case of clothes on a model will greatly facilitate the customers’ purchase decisions. In stationary stores you can easily compare the physical size of an item, estimate whether it will fit into e.g. a backpack or a bag, as it looks on the shelf. That’s why product cards on online stores should also provide the best possible representation of features, attributes or other physical properties of the assortment in pictures.

The number of photos available to the customer also matters. Customers should see a maximum of 3-4 additional photos, without having to move them with the arrows themselves. Only photos that meet the sales targets should be selected, which will complement them next to or below the main photo. Too many of them will not convince the customer more, but only take up valuable space on the server and may have a negative impact on the loading time of the store.

“Add to cart” button

It is a strategic element in the product sheet, so it should be properly exposed. If the customer cannot find it easily and quickly, he will probably treat the product as unavailable and leave the store. To make sure that the button in our store meets the standards of intuitiveness, you should analyze whether “add to the cart” button:
is large enough and visible enough, there are no other distracting elements around it, it is colourfully different from the background, it is located in a location intuitive for customers (preferably on the right side of the card), and whether above the page scrolling line it has a clear call to action, so that the customer has a clear view of its function.

Buying products out of stock

In order to improve the customer’s shopping experience in the online store, it is worth allowing the product card to order also those items from the assortment that for some reason are temporarily out of stock. Often in this case, online stores completely hide the cart button, thus preventing the purchase of the missing product. Some customers will leave the card in search of an alternative product, but according to the Baymard Institute, as many as 30% of users will completely give up shopping in the store. So give your customers an alternative in the form of a “notify me of availability” button or allow them to order products that are temporarily unavailable. The customer will be informed how long he will have to wait for the delivery of such a product, which will help him decide to buy or return to the store. A very similar option is taking orders for pre-sale products, i.e. those that are yet to appear in the assortment and are not yet available in the regular offer. This option is a guarantee that users will not be forced to visit the competition.

User reviews

A very important part of the product card is the visible opinions and ratings of other users who have purchased the product. As many as 95% of customers rely on them for their purchase decision. What is interesting is that users are most likely to suggest the overall result and distribution of all ratings from the whole, located at the top of the review section. Baymard Institute tests have shown that when such collective summaries are not available, users more often claim that the reviews are false. For example, when you see mainly positive reviews listed first, such comments are not considered reliable in this case. The best solution is to use a graphical form for the summary of reviews e.g. a bar chart, where it is possible to filter the ratings in order to display e.g. only 5-star reviews or only 1-star reviews. This summary of the rating distribution should be automatically hidden for products with a small number of reviews.

Cross selling modules for alternative and additional products

According to Forrester’s estimates, additional suggestions for customers in the product card generate approx. 10-30% of the turnover in the e-commerce industry. However, they must be selected and displayed in an appropriate, non-accidental way. Good cross-selling should offer alternative and complementary products separately. For example, a section that only includes alternatives allows an undecided user to move from one side of the product to the next until they find an item that meets their requirements. It is an effective way to keep customers in the store even if they did not find a satisfactory offer right away. Once the user has found the desired product, he often needs various extras or accessories to complete the purchase. However, finding such complementary products can be an extremely tedious task, so it will be a lot easier to list them as suggestions directly on the product page. Both types of cross-selling mentioned above are a great way to increase the total value of your order.

Summary

Product card on internet store should convince the clients to buy. Therefore, the selection of information, its form or possible activities in the product card should be thought out and properly positioned.

If you want to ask about what we can do on your online store to adapt it to the latest trends, write to us.

Source:

https://baymard.com/blog/rei-product-page-ux