Le Creuset Mobile Audit
With the goal of optimizing the mobile shopping experience, Le Creuset asked for design solutions that would improve conversion and customer satisfaction. Design solutions were to be informed and supported by extensive quantitative and qualitative research.
Process
To begin understanding the problems of the mobile shopping experience, I performed a hueristics audit of the current experience as well as reviewed heatmaps collected via Hotjar.
These findings were married with insights gathered from a quantitative analysis of Google Analytics data to illuminate two key problem areas of the experience: the Product Listing and Product Detail pages.
User testing was also employed to balance any expert bias or validate painpoints.
-
-
The assumption developed that Product Listing pages were suffering from a bounce rate of over 50% due primarily to the inefficient use of screen real estate (with a single column layout) and an un-engaging presentation of key product details such as color.
User testing corroborated this theory - “In real life, I would not scroll this much to find what I was looking for.”
-
On Product Detail pages, about 67% of sessions were exiting without any engagement - a text heavy presentation of key product details, which required extensive scrolling, was assumed to be the likely culprit.
One user expressed: “[The] shopping experience feels lacking because I love the products [but don’t love this page].”
-
Concepts
Armed with key insights from the research findings, my proposed solutions focused on decreasing page length while presenting a more visually engaging experience in order to ease friction surrounding product browsing and selection.
The proposed Product Listing page design sought to take advantage of best practices for presenting product results while also highlighting key differentiating features.
The 2-column layout would allow users to more quickly assess available products (by reducing page length by 50%) as well as help to visually indicate to users that they were one page deeper in the shopping funnel from the Category page (Dutch Ovens vs. Cookware).
New text styling was introduced to visually separate price from product options. Additionally, the communication of available colors was changed from text to a swatch presentation and material was added to further inform users.
A main focus of the redesigned Product Detail page was improving the presentation of the product images - I proposed updating the product image gallery to a more conventional pattern (a swipeable gallery vs. a modal) as well as leading with a lifestyle image to more clearly communicate product details such as color and size.
The rest of the page was adjusted with a focus on shortening the overall page length and create a more enjoyable shopping experience.
The desktop hotspot Explore experience was added to communicate product features in a more engaging and visual manner. Sections such as Description, Reviews, and Recipes were collapsed partially or completely so users could more quickly scroll through the page and intuit the proper emphasis on the most important information.
Other proposed improvements included removing elements such as the the size slider to declutter the page ‘above the fold’ and adding return details to improve user confidence.
-
-
Validation
To further support my design decisions and help to build a case for return on investment, I tested user’s preferences between two versions of the Product Detail page: a silohuetted product image vs. a lifestyle product image.
Users overwhelmingly preferred the version with the lifestyle image because it provides environmental context for sizing.