Product List Page Grid View
Overview
The Mega Menu is one of the most important parts of an ecommerce website. The ability to navigate through and expedite the arrival of the user to a transaction action is crucial. The more efficient the Menu, the higher the conversion for that user session.
Problem Statement
In this phase of Lole’s ecomm maturity, the ability to capture new visitors and enable a conversion is significant. With the cost to acquire customers through paid ads, organic growth and marketing campaings, it is necessary to evaluate one of the first interactions that the user will have on the site.
Our current issue shows that the user will take 2 levels of interactions (clicks) in order to get to a specific category (level 2 selection)
Our current issue shows that the user will take 2 levels of interactions (clicks) in order to get to a specific category (level 2 selection)
The Goal
The Goal is to minimize the level of interactions for the user to arrive to their desired destination.
Users & Audience
Lole’s target demographic places the female shopper with disposable income at a range of 30-45 years old. A good portion of our users are repeat customers. Almost 80% of customer transactions come from users that have previously bought on the site. The rest are customers that are new and want to try the product.
Currently, the ability for us to capture new users for a return purchase is about 30% of the 20% traffic that we do convert.
Currently, the ability for us to capture new users for a return purchase is about 30% of the 20% traffic that we do convert.
Roles & Responsibilites
Lead Product Designer
Product Strategy, User Research & Analysis, User Interaction, Visual Design, Prototyping & Testing, Information Architecture
My role was the lead designer for this project. I was tasked with revamping the end to end experience that our users had with the mega menu. I worked closely with the Head of Ecomm to set business requirements and build use cases (including edge cases). I had also worked with two front-end developers to ensure that the menu was pixel perfect and one back-end developer to ensure that the back-end references were accurate to the architecture of the product categories.
Product Strategy, User Research & Analysis, User Interaction, Visual Design, Prototyping & Testing, Information Architecture
My role was the lead designer for this project. I was tasked with revamping the end to end experience that our users had with the mega menu. I worked closely with the Head of Ecomm to set business requirements and build use cases (including edge cases). I had also worked with two front-end developers to ensure that the menu was pixel perfect and one back-end developer to ensure that the back-end references were accurate to the architecture of the product categories.
Scope & Constraints
The project touches on the entire architecture of the product categories. The way that this menu is built (and to some extent the data architecture) determines how the user will navigate through the site.
Process
This design process spanned two weeks with the intent to have an aligned schedule with the upcoming sprint.
1. Understand
2. Analyze
3. Design
4. Stakeholder Validation
5. Developer Handoff
6. Gather Data and Iterate
1. Understand
2. Analyze
3. Design
4. Stakeholder Validation
5. Developer Handoff
6. Gather Data and Iterate
Outcomes
The outcome was very positive. We have concluded (within a 2 week period) that users were now able to shop at a more efficient way. The reduced level of interactions increased our average pages per session on the site by 2.1 (4.7 pages to 6.8 pages) and increase our conversion for the session by 0.9%. User interviews also suggested that users were now able to understand the architecture of the site a little better with increased efficiency.
Key Takeaways
The bottom line is that users want the least barrier to success (or in this case, to purchase). I would conclude that the users that have to click less, will most likely convert more. In terms of the user experience, I think it is important to empower them to do what they want to do. Sometimes simple is better.