Organic Hair Products E-Commerce Redesign
Redesigning Loba Mane e-commerce website resulted in increase in overall conversion rate by 12.8%.
In One Glance
Overview
Loba Mane is an 100% organic hair care brand dedicated to empowering individuals with textured and curly hair through scientifically formulated, high-performance hair products.
Challenge
In a rapidly evolving e-commerce landscape, Loba Mane faced a critical challenge:
low conversion rates among female millennial consumers. As the sole product designer, I was tasked with reimagining the digital experience with minimal resources and maximum impact.
Solution
Website redesign with a focus on the product detail page and purchase user flow.
Results
The redesign resulted in a more engaging experience that increased conversion rates by 12.8% while simultaneously reducing development costs by 94%.
BEFORE
AFTER
The Journey
The Hunt for Truth: Uncovering User Reality
My investigation began with a comprehensive research strategy in two areas:
Understanding users
Aggregated reviews from the website, Amazon, and social media platforms.
Analyzed customer sentiments and preferences.
Created four detailed user personas representing our target market.
Conducted three usability testings with real customers.
- Technical Exploration
Conducted heuristic analysis and cognitive walkthrough.
Identified potential technical interaction issues.
Identified Technical Issues
Subscription & Contact Us Issues: No confirmation email after subscribing led to repeated attempts. The “Contact Us” page lacked visibility and feedback, causing user frustration after message submission.
Irrelevant Subscription Confirmation: Users received an unrelated image after subscribing, and no immediate welcome email or 10% discount code, undermining trust.
1
User Personas based on User Feedback Analysis
Based on the all the reviews on the website, Amazon, and social media platforms I developed 4 detailed user personas to guide the redesign process and align it with target market needs.
Lack of trust in sustainability claims and limited eco-friendly packaging options.
Difficulty finding hair care products specifically for curly hair and lack of education about proper usage.
Curly Carla
2
Sustainable
Sarah
Hard time finding hypoallergenic, transparent, and locally available products with clear ingredients.
Sensitive Susan
Struggles with affordability and finding value-packed options.
Budget-Savvy
Beth
Bringing Data to Life: Four Faces of Our Users
Beyond Personas: Real Customer Stories
2- Authenticity of Reviews
When I see a customer review next to a picture, I'm going to assume this is the same person... it doesn't give me confidence that it's a real customer review.
I didn’t stop at creating user personas, I wanted to hear directly from our customers and uncover their real struggles during their purchase journey. I conducted three targeted usability tests, diving deep into their experiences. What I uncovered were three critical pain points that couldn’t be ignored.
1- Need for Detailed Product Information
3- Streamlined Checkout Process
I still, by the way, don't know how much I'm paying, I don't know how much shipping is going to be, I don't know how much tax is going to be.
Insights
Insights
I don’t understand what these words mean... the ingredients are very vague. Someone allergic or who doesn’t like coconut oil wouldn’t know if this product has it.
From Insights to Action
Testing Our Way to Success
After gathering insights and understanding their pain points, I sketched multiple wireframe variations for product detail page focusing on different ways of presenting product info.
Validating Insights
Conducted A/B testing on two different variations of the product detail pages using Hotjar platform.
Iterating the Design
To reduce the implementation cost, I took Shopify training course and made the design iterations on the website.
Redesigned the website keeping the users' pain points in mind, simplified their purchase flow.
3
A/B Test
vs
Considering my findings, I sketched multiple wireframe variations for product detail pages and conducted A/B testing using Hotjar. By comparing user interactions, I identified layout B significantly improved user engagement based on time spent on the page and received more Clicks on “Add to card” button.
A
B
Product information is placed below the product images listed in separate sections and are expandable.
Main Ingredients are visually highlighted to see without needing to expand sections.
The product information and details are positioned directly next to the product image in a tabbed format, and the “Add to cart” button below it.
Design Comparison for Optimal Conversion Results
Product details in tabs:
for seeing the info next to the image, categorized, and before add to card button.
Horizontal photo bar:
improving accessibility and creating a more familiar browsing experience.
Breadcrumbs:
allowing users to easily navigate the site and move between pages efficiently.
Verified reviews:
to strengthen customer confidence,
a verified review system added to showcases authentic customer experiences with each product.
Sticky “Add to Cart” button: to enhance convenience and drive conversions.
Streamlined checkout flow: condensed a three-step process into a single seamless page, reducing cart abandonment and accelerating the path to purchase.
Dedicated shopping cart page:
replaced the cart experience from a cramped sidebar to a dedicated full-page view, enhancing focus and clarity during checkout.
Empathy-Driven Design Solutions
4
The Final Design and Reflections
Final Design Prototype
Breakthrough Results:
12.8% increase in conversion rate.
94% reduction in development costs.
Enhanced user experience aligned with customer expectations.
Personal Insight:
I’ve realized the value of staying calm and solution-focused during challenging situations.
Design is more than aesthetics—it's about creating meaningful connections between users and products.
Key lessons learned:
Small changes can lead to big results over time.
User empathy is the cornerstone of effective design.
Maintaining a growth mindset reduces organizational costs.
Outcomes, Takeaways, Reflections
Other Projects
Let's create future experiences together :)
Copyright © 2025 Mahnaz H.
