LISTINGPRODUCT OPTIONS

E C O M M E R C E

H o w t o l i s t p ro d u c t o p t i o n s o n p ro d u c t p a g e s

e C o m m e r c e U X D e s i g n a M i n e W h a t i n i t i a t i v e

1e c o m m e r c e u x d e s i g n . c o m

Allow shoppers to select quantity

Shoppers might want to get more than one unit of the same product and it can be quite frustrating if they have to repeat the entire process multiple times. If you expect your shoppers to buy more than one item, then provide a text field to specify quantity. This might help in increasing your average order value and reduce cart abandonment. Keep the default option as 1 so you can cut down on one extra click/step for users who want to buy just one unit.

1

2e c o m m e r c e u x d e s i g n . c o m

Add color swatches

If your product comes in multiple color variants, use color swatches or a drop down list to display each. If you have a default color option, make sure your product images reflect the selected color. Disable variants that are out of stock.

2

Swatches are useful if you want to allow your shoppers to quickly determine if theproduct is available in the color they like

3e c o m m e r c e u x d e s i g n . c o m

If you are worried about the lack of page consistency that might come up as a result ofhaving color swatches of different sizes, then a drop down list is a good option to have.

Read on to f ind out how a Shopify based luxury retai ler increased their landing page conversion by 200%.

4e c o m m e r c e u x d e s i g n . c o m

Include a size Guide

If your product comes in a variety of sizes, then give a link to size guide right above the size option. It is a good way to guide shoppers who are not sure of the size they need to choose. Provide detailed instructions and measuring tips with the size guide and show sizes for many international countries. Open up the size guide in a new tab or in a new browser rather than in the same product page.

3

5e c o m m e r c e u x d e s i g n . c o m

Design for product variants

Some products on your store might require shoppers to choose more than one product option such as color, size, etc. Disable combinations that are not available. For some of these options you can pre-fill default values with the most popular variant. But, for certain options such as size, don’t use defaults as your shoppers might end up purchasing the wrong size. Leave it blank and prompt the user to enter the correct size.

4

Time saved on category management everyday 2Hrs. See how MineWhat brought an entire team onto one page.

6e c o m m e r c e u x d e s i g n . c o m

Dealing with out of stock product variants

If you have a product with multiple variants and any of them are out of stock, then ask for your shopper’s email address and let them know once you have the product again. You could also use this opportunity to make them subscribe for your newsletters.

5

P O W E R E D B Y

Product Analytics for eCommerce

T h e # 1 e C o m m e rc e i n t e l l i g e n c e p l a t f o r m f o r y o u r s a l e s a n d m a r k e t i n g t e a m s .

Quick ly spot what works and what doesn’ t on your s tore. Dr ive more convers ions.

w w w. m i n e w h a t . c o m > >