BitmapCreated with Sketch.

Website Redesign

2018 Lead UX Designer

Website Redesign Comprehensive redesign to create a more intuitive, visually appealing, and conversion-driven online shopping experience.

The Challenge

The original product page faced several challenges, including a cluttered layout, limited product information, and a lack of interactive elements to engage and inform customers. Additionally, the checkout process was not optimized for seamless transactions, leading to potential barriers in completing purchases. User feedback and analytics highlighted the need for a redesign to address these usability issues and to elevate the overall user experience.

Surveys & Research

We conducted a Maxfiff survey to better understand the importance of product page attributes among Ontario residents aged 20 and above who have browsed or purchased alcohol in the last 6 months. Our goal was to gather insights for a more user-friendly and informative online shopping experience. The survey was conveniently delivered via email, with participants invited to opt in and complete a quick 10-minute online survey.

User Confusion
0 %

On the product page, 70% of surveyed users reported feeling confused and disoriented, which led to reduced engagement, increased bounce rates, and a negative impression toward conversion.

Drop-off Rate
0 %

50% of users emphasized the critical importance of clear and enticing product descriptions, competitive pricing, and effective sales and discounts to keep users engaged.

Feature Overload
0 %

85% of users felt overwhelmed by too much on the page, suggesting a need to prioritize and stagger information. Users felt that fulfillment options didn’t belong on a product page, but instead should feature further down the sales funnel. 

User Pain Points

The following screenshot highlights the main pain points and problems identified on the old Product Page. Identifying the issues your users face is crucial for improving the site and increasing retention.

“Featured” products appear random to users.

Using clear logic to surface related products would add value, however when they perceive little to no link it undermines users trust in the site & brand.
Users did not like the word “Fulfillment” and didn’t like being forced to decide shipping method when adding their first product.

They think that this choice should be made later in the conversion funnel.
The randomization of the recipe carrousel, made users feel little connection between them and the product.

Users expressed interest and value in a couple of recipes that pair with the product.
Users felt that the product image needs to be bigger.

They would like some way to Zoom, but not mouseover.

They also would like to see the back of the bottle.
Inconsistencies in perspective. “Buy In-Store” is understood by users as an action they take.

Conversely, the phrase “Deliver to Store” describes a task the LCBO will carry out.

Aligning all text to reflect the users perspective to remain consistent and center the users perspective over the LCBO.
Users feel like there should be a scale to indicate how sweet this would be in taste.

Analyzing User Feedback

MaxDiff results of user servey.

Total

Price

Discounts/Sales

Product Description

Delivery Costs

Brand

Wine

Price

Product Description

Discounts/Sales

Delivery Costs

Product Category

Spirits

Price

Discounts/Sales

Product Description

Delivery Costs

Brand

Beer/Cider

Price

Discounts/Sales

Product Description

Brand

Delivery Costs

Price toped the list in importance across all purchaser groups. Discount/ sales was the second highest concern for all groups except Wine, for whom product description is more important. Delivery costs are high for purchasers of heavier or higher value products then it it for Beer Purchasers. Brand is more important to Beer Purchasers than other groups, particularly Wine.

User Testing
By incorporating user feedback and iterative design into the wireframing process for the product page I could deliver a user-centric design that enhances the overall shopping experience and encourages user engagement.
Wireframing
When I start the wireframing process, I begin by identifying the key elements that need to be included on the product page, such as product images, descriptions, pricing, reviews, and call-to-action buttons. It's important for me to consider how users will navigate through different products, filter options, and make purchasing decisions. I design the layout of the product page to be visually appealing and easy to navigate, with a focus on highlighting the unique selling points of each product. I ensure that clear and concise information, including product details, tasting notes, and food pairing suggestions, is readily accessible to the user.

Conclusion

The product page redesign successfully addressed the initial challenges and significantly enhanced the overall user experience. By prioritizing visual appeal, comprehensive product information, interactive elements, and a streamlined checkout process, the redesigned product page effectively drove increased user engagement, conversion rates, and customer satisfaction, solidifying its position as a leading online destination for purchasing alcoholic beverages.

User Retention
+ 0 %

The redesigned Product Page increased user retention by 25%, with more users converting and continuing to the checkout.

User Satisfaction
+ 0 %

Post redesign user surveys showed a 30% increase in satisfaction, with users appreciating the clear, simple design and engaging elements.

Feature Adoption
+ 0 %

Usage of key elements increased by 20%, indicating that the new hierarchy effectively educated users on where to find the information they are seeking.

© COPYRIGHT 2024  •  All Rights Reserved  •  EMILY DALTON  •  TORONTO, ON CANADA

Skip to content