Main Navigation Redesign
The primary website navigation/menu has been updated to give customers a more simplified path to purchase and an improved product-exploration experience.
Role
Leading the entire design process including User research, Wireframing, Usability testing
Tools
Figma, UserTesting
Duration
9 Months
Project Overview
The main website navigation/menu has been redesigned to simplify the path to purchase and enhance product exploration. This expands the company’s reach and aligns with two key DTC objectives:
- Enhancing brand distinctiveness and differentiation at all touchpoints.
- Improving the discovery of the complete product range to boost conversions and basket-building.
Old
New
Accomplishment
Within a three-week timeframe!
+31.6% Increase in purchase rate
+10% Increase in the customer journey from HP to PCPs on mobile devices
- Business Feedback: Internal feedback from DTC and ELT has been consistent that the website’s navigation is an opportunity for improvement.
- User Analysis: User Testing (live) sessions confirmed that the navigation was an experiential obstacle and validated our design as a solution
- Well-organized menu
- There was a lot of interest in image with text
- A simple navigation system
- The design is clean and minimalistic
Identifying The Problems
The current state of our website presents several significant issues affecting user experience and engagement:
-
User Frustration (Content Square): Users are experiencing frustration when interacting with our website, which is negatively impacting their overall experience.
-
Low User Engagement (Google Analytics): Our website is suffering from low user engagement, suggesting that users are not finding the content or features that captivate their interest.
-
Baymard Audit Score: Our website’s Baymard audit score is lower compared to other e-commerce platforms, indicating that we lag behind industry standards and best practices in providing a seamless online shopping experience.
-
User Confusion (User Testing): User testing has revealed that our website is causing user confusion, particularly in the process of finding products or information necessary to complete a purchase.
“As a user, I can’t easily find the product or information I’m looking for to complete a purchase, resulting in user frustration, low engagement, and subpar performance compared to other e-commerce platforms.”
Solving this problem is essential to improve user satisfaction, increase engagement, and enhance our website’s competitive position in the e-commerce market.
Design Strategy
Measurement Plan (KPIs)
- Increased traffic distribution to non-CP PDPs (i.e., expose more of the portfolio)
- Reduced Frustration score -ContentSquare metric- for users interacting with navigation
-
Reduction in on-site search utilization (because people can browse easier)
-
Bounce rate on pages clicked from navigation (because users can more easily find what they are looking for)
Navigation made easier
Navigation Home Page
- Reduced navigation ‘pathways’ from 6 to 3 to simplify e-commerce navigation
Shop Product
- Refined “Shop by Product” experience to connect customers with product categories (PCP) instead of individual products (PDP) while maintaining space for targeted messaging
Shop by Benefit
- Refined “Shop by Benefit” experience gives customers an easy avenue for discovery products that align with their own goals/needs
