Navigation Redesign
Lume is a disruptive DTC personal care startup that was founded in 2018. During my tenure from 2022–2024, it saw tremendous growth–launching new site features, products, scent offerings and a men's spinoff brand, but with still much more room to grow. A revamped navigation was in order to accommodate imminent needs and future growth.
The Objective
Improve site navigation to accommodate current and future product and site expansion. Also, improve CVR (conversion rate) and encourage high AOV (average order value) and LTV (lifetime value) flows.
The Challenge
Design optimal site navigation for today AND tomorrow using scalable design patterns. Accommodate multiple navigation systems, organize and label items that straddle multiple lines.
Previous State
With future product and site feature growth, the current design patterns used and structure are not scalable.
The use of labels such as “Body Care” are ambiguous.
Does not prominently feature new high AOV (average order value) and LTV (customer lifetime value) user flows.
The accordion interaction pattern (instead of a modal) seems clunky and outdated.
The imagery is not interesting nor totally indicative of the category it is intended to encapsulate.
Known Knowns
Top AOV & LTV Flows
Subscribers are high lifetime value customers, Shop by Concern (on the Shop Page) has a high conversion rate and average order value.
Future Additions
Need to make room for future initiatives and experiences like a rewards program, quiz and new mini sampler bundles.
Existing Additions
Mando (men’s spinoff brand), Lume Social Club and Curated Bundles are new initiatives and experiences that are not prominently featured on site.
Considerations
CTR Redistribution
There will be new overarching Product Category Collection pages which will redistribute some traffic.
New & Future Products
Solid Stick Deodorant + Sweat Control, Spray Deodorant, new Mini Samplers and Vanilla Bliss (new scent) will all launch within a year.
Future Site Features
A rewards program and a quiz experience are on the horizon and will launch in the next 2 quarters. Both will need prominent placement.
EXISTING NAV + SHOP PAGE USER TESTING
“Seems like things are easy to find. I wish the navigation had some of the functionality on the Shop page. I can zero in on things more and compare.”
— Kendra, user testing participant
Success Metrics
Click Through Rate
While clicks may be redistributed between links, we’d like CTR to improve to our various Collection and Bundle pages.
Conversion
Ultimately, we want users getting to what they want quicker to make a purchase.
Average Order & Lifetime Values
By featuring new higher AOV & LTV flows such as Build Your Own Bundle and Subscribe & Save.
Existing Site References
-
![Lume footer navigation]()
Footer
-
![Lume's Shop page shopping by product]()
Shop All Page - Product Filter
-
![Lume's Shop page shopping by scent]()
Shop All Page - Scent Filter
-
![Lume's Shop page shopping by concern]()
Shop All Page - Concern Filter
The Process
-
After a concept is generated, key questions and known unknowns are formulated. Existing data is identified and scoured to help answer those key questions. These may come in the form of:
Traffic logs
User surveys
Customer service requests
Previous user research
Previous and relevant A/B tests
Marketing analytics
From there, any gaps and relevant research methods are identified before crafting a research plan.
-
Informed by A/B testing results, clickstream analysis, session recordings, and moderated user testing, new UI concepts are created to help mitigate any monetary and UX performance shortcomings.
From there, new concepts are user tested before moving anything into development.
User research methods used:
Qualitative attitudinal methods: User interviews
Qualitative behavioral methods: Moderated user testing, session recordings, heat maps
Quantitative attitudinal methods: User surveys
Quantitative behavioral methods: A/B testing, clickstream analysis
-
Experiment designs are crafted in close collaboration with product management and marketing.
Testing plans include:
Success metrics
Number of variants
Testing inventory needed
Traffic allocation
Experiments are then slotted into the experimentation roadmap.
Design Iterations
-
![Design iteration of Lume's new mobile navigation using a 2x2 card layout]()
2 Column Category Cards
Categories with multiple products opens a submenu
-
![Design iteration of Lume's new mobile navigation using a full width sections layout]()
Full Width Category Cards
Single click to access all products
-
![Design iteration of Lume's new mobile navigation using a horizontal scroll]()
Horizontal Scroll
Single click for all Deodorants, submenu for non-Deodorant categories with multiple items. Shop by Scent Profiles.
Test Results
Collection traffic +9% 🧗🏽♂️
CVR +4% 🛒
Future Tests
-
Play With Order
Change order of categories as well as links within categories.
-
Shop by Scent
Although it does not perform on the Shop, see if it performs better in the nav.
-
Comparison Modals
Already featured on Collections and Shop, it may aid new users.
