A haircare brand, rebuilt for conversion
Role
UX Designer
UX Researcher
Played a key role in user research and analysis. Led the journey mapping and ideating stages, exploring multiple solutions.
Team
5 HCDE Students
Tools
Figma
Notion
Timeline
9 weeks
tl;dr
25%
Projected rise in conversion rate
Team estimate, based on usability testing
4
Pages of the site redesigned
Research
Website Evaluation
Before beginning the e-commerce site redesign, the team assessed the website's initial impressions across key pages and documented the thoughts.
Website evaluation notes ⟶
Data Analysis
By leveraging Shopify Partners, the team gained direct access to the company's Google analytics. This data revealed the most frequently visited sections of the website as well as where customers tended to drop off during the purchasing process enabling us to pinpoint areas requiring attention.
Competitor Analysis
We compared Masami with other haircare stores, to see what shoppers would expect from it.
Competitor analysis ⟶
Customer Survey
We gathered a combined total of 18 surveys from both loyal and potential customers.
Survey form ⟶Synthesis
Landing Page
- Unorganized IA and confusing nav bar nomenclature
- Inconsistent content hierarchy and alignment
- Missing primary CTA fails to guide users toward key actions.
- Cluttered layout leads to high drop-off rates.
- Lack of clear brand identity and value proposition affects trust.
Product Page
- Lack of information on the brand and products.
- No well-defined product categories.
- Separate page for each product size, creating frustration.
Collections Page
- Well-defined and functional filters are missing.
- No labels like "Back in stock" and "Most Purchased," missing the opportunity to communicate demand.
Cart Page
- Rewards and recommendations are missing.
- Missing "Other Items You Might Like" section
- No "Continue Shopping" button in the checkout page.
- No Clear payment options
- My Account section is missing, customer history can't be tracked.
Based on the research and insights gathered, and considering the constraints of a nine-week project cycle, the team decided to focus on redesigning 4 primary pages:
Landing Page, Product Page, Collections Page, and Cart Page.
Ideation
Moodboard
Together with the client, the team curated a mood board to establish a clearer direction for the new visuals, functions, and layout of the project.
Journey Maps
Developed journey maps for two user personas: These maps were instrumental in evaluating and refining the existing Masami website, providing us with a clear vision for optimization.
Low-Fi Wireframes
The team concentrated on exploring various page layouts and experimenting with new functionalities.
Prototype
Final Designs
After receiving feedback from the client on our wireframes, we refined and finalized the new designs, incorporating branding elements and creating prototypes.
LANDING PAGE
A clear hero and a Shop now button: the old page had no primary call to action and didn't say what Masami sells.
COLLECTIONS PAGE
Add to cart from the collection itself, so a shopper who knows what they want doesn't have to open each product.
PRODUCT PAGE
Every size on one page, with price, rating and description up top and the details folded below. Before, each size was its own page.
CART PAGE
The cart opens without leaving the page, so shoppers can keep browsing. The old cart had no way back to shopping.
Landing Page : Details
- Hero Image improved, giving clear idea of the website
- CTA added encouraging users to shop
- Carousel to view additional products
- Names and hierarchy of nav items fixed
- Clear tags of bestseller products
- Prominent section of top products allowing immediate “add to cart” option
Handoff
We created comprehensive documentation outlining the designs, ensuring they are prepared for handover to the development team that the client may engage in the future.
Reflection
Key Learnings
Data picked the pages
Shopify Partners gave us Masami's Google Analytics. Where shoppers dropped off, not our opinions, decided which four pages to redesign.
Nine weeks, four pages
The audit found problems across the whole store. We fixed the four pages that mattered most and left the rest, like a My Account section, for later.
Small, specific fixes
Most of what stopped shoppers was small: a page per product size, no call to action, no way back from the cart. Each fix answers one of those.
Five of us, one store
We split the work by stage. I led journey mapping and ideation, exploring several directions for each page.
Next Steps
Design changes will be gradually implemented by the co-founders or with developer support on Shopify.
The team plans to distribute a post-survey to initial participants after implementation to assess impact.
The client supports the survey plan and will provide follow-up opportunities.
The team aims to measure improvement from the previous 3.88 rating (on a 1-5 scale).
Next up
See all work
DesignScout.ai
Shipped · 2024An AI hiring platform that ranks candidates using evidence from their answers, making candidate evaluation 60% faster.
YouTube Shorts
Concept · 2025Generative AI tools that help creators ideate, film, and stay on-brand without taking creative control away.
Vodafone
Shipped · 2023A centralized pricing hub that replaced spreadsheets and email, making quote approvals 3× faster.