Mobile Product Pages: 5 Beautifully Functional Examples

Posted by Hannah Stacey 29 Jul 14

Mobile commerce: it’s here, it’s thriving and it isn’t going anywhere anytime soon.

Indeed, it's becoming increasingly difficult to overlook the abundance of evidence - both statistical and anecdotal (see the tweet from Matt Curry of Love Honey below) - confirming the rapidly increasing consumer appetite for mobile shopping. 

As a result, online retailers are having to completely re-think the experience they offer customers. And fast: according to statistics collated by Mobify, 30 per cent of mobile shoppers abandon a transaction if the experience isn’t optimised for mobile.

Designing a mobile shopping experience that matches desktop in terms of conversion rates is no mean feat, especially when it comes to product pages. Compacting all the information essential to a great product page - compelling images, calls to action, user reviews, postage and packaging rates, detailed product description - into a format that works on a mobile screen is, undoubtedly, incredibly difficult.

Some retailers are rising to the challenge, however, creating mobile product pages that not only get the job done from a UX perspective, but look pretty darn slick to go with it. Here are five of the best mobile product page design:

 

1) Gilt

Members-only online store Gilt hosts designer fashion 'sales' in which members can buy designer wear at a marked down price.

Gilt

Features we love (that you might want to steal for yourself):

  • Side-swipeable images - created for thumbs, not computer mice
  • A collapsable sizing chart - functional but unobtrusive
  • Estimated delivery times - these days pretty much standard on desktop sites, but a rarity on mobile

 

2) Warby Parker  

US-based vintage-inspired eyewear boutique Warby Parker was founded in 2010 and has been shaking up the traditionally bricks-and-mortar eyewear market ever since.

warby

Features we love (that you might want to steal for yourselves):

  • Image-led - the mobile product pages revolve around beautiful hi-res product imagery
  • Big, clear CTA buttons - no room for confusion here, folks
  • Tabbed product detailswith product pages this sleek, you don't want large amounts oftext to be messing with the flow of the design

 

3) Harry's

Online shave shop Harry's sells itself on its fairly-priced, German-designed razors, which you can buy one-off or as part of a 'shaving plan' on its very swish website. 

harrys

 

Features we love (that you might want to steal for yourself):

  • Simple design - clean and practical
  • Contextual images - mobile needn't mean sterile, and Harry's uses images to tell the brand's story in a mobile setting

 

4) Cos

Launched in 2007, the H&M spin-off 'creates fashion pieces that look and feel at once classic and modern' - a theme that is replicated in the fashion retailer's website

cos

 

Features we love (that you might want to steal for yourself):

  • Swipeable multi-view product images - specificaly tailored to the mobile experience with the ability to zoom
  • Links to shipping and delivery details popup - no nasty surprises in the checkout area
  • Careful use of textkeeping text brief but descriptive to avoid cluttering the layout

 

5) Dolls Kill

Dolls Kill is a US-based online boutique 'for the misfits and miss legits' selling punk rock, goth, glam and festival fashion.

dollskill

 

Features we love (that you might want to steal for yourself):

  • Social sharing buttons - visitors are immediately greeted with social validation of the product
  • Clever use of drop down menus - extra product information is hidden in drop down menus to keep the page as concise-looking as possible
  • Product recommendations - eye-catching, image-led product recommendations at the bottom of the page

 

 

Artboard 10 B-1.png