Five of the best… mobile product pages

Designing attractive, usable mobile product pages is a fine art that many sites still struggle with.

I feel that responsive design has been a brilliant agent for change in mobile design because it has forced people to strive for simplicity, as pages need to be usable across multiple devices.

And with this in mind, I thought I’d highlight five of my favourite mobile product pages, with examples coming from apps as well as mobile sites.

In all honesty the criteria for making the top five list are quite woolly, but essentially they’re the product pages that I think offer the best aesthetics and usability.

Personally I like mobile sites to have giant images so I don’t have to squint, as well as massive buttons to make navigation easy.

By David Moth April 17th 2013 11:49

If possible the product pages should also include all the necessary details we’d expect from a desktop site, but price, description and additional images are the options that I want to jump out and hit me in the face.

Skinny Ties

If you’re unaware of my love for the Skinny Ties website then you obviously haven’t been paying attention.

It’s a brilliant example of responsive design in ecommerce and the product pages look great on a smartphone.

Simplicity is its main asset – the images are crisp and clear, the description is snappy and concise, and you can’t miss the price and CTA.

Other brands should take note of the uncluttered, clean design, as it means the site is incredibly user-friendly in my opinion.

H&M

This example is actually taken from H&M’s app, but it’s a fantastic example of how to present a simple, user-friendly mobile product page.

The image takes up the entire screen, with the description accessible via an ‘i’ button in the top right.

Other functions – such as additional product images and size and colour options – are available by pressing the relevant buttons at the bottom of the screen.

When you click to add the item to your bag a graphic shows the product moving up into your shopping basket, so you’re not left guessing whether it’s actually worked.

It’s missing some of the features that one would expect to find on a product page, such as reviews and shipping information, but in terms of usability I feel the design is extremely intuitive.

United Pixelworkers

Another great example of responsive design, United Pixelworkers has an incredibly simple design that makes it perfect for a mobile screen.

It crams in a decent amount of information but the simple colour scheme means that it remains uncluttered and easy to read.

The page design includes product availability, big images, an unmissable price tag, a concise but detailed product description and a huge CTA.

It would be useful to have shipping information as well, but overall I think the design is great in terms of aesthetics and usability.

Etsy

Etsy’s page puts the large, swipeable product images front and centre, which somehow even makes this bent garden fork look attractive.

It also allows you to zoom in on each image simply by tapping the photo. Furthermore, the page includes the price (though it could be more obvious), brief product description, a big CTA and seller information.

Zappos

Though I’m not a huge fan of the colour scheme, I feel that Zappos ticks most of the boxes in term of usability.

It allows you to swipe through several different product images, displays an unmissable CTA, uses bullet points for the description and crams in several customer reviews.