Making confusing purchases easy (and profitable).
E‑Commerce UX
E‑Commerce UX
2021
2021
the challenge
The marketing & sales team had a clear goal: increase toilet seat market share by 37% while maintaining a 60% profit margin. Through user research, we uncovered the real blocker: most people didn’t know which seat fit their toilet.
through a tool that removed friction in the buying process.
through a tool that removed friction in the buying process.
through a tool that removed friction in the buying process.
by helping users buy the right product the first time — reducing returns and confusion.
by helping users buy the right product the first time — reducing returns and confusion.
by helping users buy the right product the first time — reducing returns and confusion.
what began as a toilet seat finder became a platform for identifying all types of replacement parts.
what began as a toilet seat finder became a platform for identifying all types of replacement parts.
what began as a toilet seat finder became a platform for identifying all types of replacement parts.
01. Research & Discovery
01. Research & Discovery
01. Research & Discovery
People were walking away not because of price or stock, but because they didn’t know which seat matched their toilet at home. The fear of buying the wrong product blocked the sale before it could begin.
Using design thinking frameworks, we conducted interviews, mapped user journeys, tested in stores, and analyzed the e-commerce flow. The insight was clear: lack of product confidence was the bottleneck.
People were walking away not because of price or stock, but because they didn’t know which seat matched their toilet at home. The fear of buying the wrong product blocked the sale before it could begin.
Using design thinking frameworks, we conducted interviews, mapped user journeys, tested in stores, and analyzed the e-commerce flow. The insight was clear: lack of product confidence was the bottleneck.
People were walking away not because of price or stock, but because they didn’t know which seat matched their toilet at home. The fear of buying the wrong product blocked the sale before it could begin.
Using design thinking frameworks, we conducted interviews, mapped user journeys, tested in stores, and analyzed the e-commerce flow. The insight was clear: lack of product confidence was the bottleneck.
02. Concept & early design
02. Concept & early design
02. Concept & early design
We proposed an AI-powered flow embedded in the e-commerce experience that would analyze user-uploaded photos to recommend compatible models. This would reduce guesswork and drop-off, especially among non-technical buyers.
We explored different UX directions in Miro and Figma, mapping out a step-by-step experience that worked across desktop and mobile. The challenge was making the AI feel both helpful and invisible, something that empowered users without overwhelming them.
We proposed an AI-powered flow embedded in the e-commerce experience that would analyze user-uploaded photos to recommend compatible models. This would reduce guesswork and drop-off, especially among non-technical buyers.
We explored different UX directions in Miro and Figma, mapping out a step-by-step experience that worked across desktop and mobile. The challenge was making the AI feel both helpful and invisible, something that empowered users without overwhelming them.
We proposed an AI-powered flow embedded in the e-commerce experience that would analyze user-uploaded photos to recommend compatible models. This would reduce guesswork and drop-off, especially among non-technical buyers.
We explored different UX directions in Miro and Figma, mapping out a step-by-step experience that worked across desktop and mobile. The challenge was making the AI feel both helpful and invisible, something that empowered users without overwhelming them.
Unexpected Challenge
Unexpected Challenge
Unexpected Challenge
When testing early mockups with the backend team, we learned the AI could not recognize toilets with any object placed on top. Decorative plants, toilet paper, and covers were skewing results. We redesigned the flow with animation and visual prompts to teach users how to take clean, usable photos.
When testing early mockups with the backend team, we learned the AI could not recognize toilets with any object placed on top. Decorative plants, toilet paper, and covers were skewing results. We redesigned the flow with animation and visual prompts to teach users how to take clean, usable photos.
When testing early mockups with the backend team, we learned the AI could not recognize toilets with any object placed on top. Decorative plants, toilet paper, and covers were skewing results. We redesigned the flow with animation and visual prompts to teach users how to take clean, usable photos.
Static mockups didn’t guide users to remove obstructions, resulting in unusable images for model detection.
Animations improved clarity by showing ideal photo conditions: clean, centered, and obstruction-free.
03. Low & high-fidelity prototyping
03. Low & high-fidelity prototyping
03. Low & high-fidelity prototyping
Each screen was designed to reduce friction: from the moment a user landed on the site, we anticipated their doubts, guided their actions, and helped them reach a confident match.
We paired clear instructional steps with clean UI, and baked in fallbacks in case the AI couldn’t find a match. We also included platform-specific paths and motion elements to make the flow feel supportive — not clinical.
The result was a frictionless, guided journey that felt just as intuitive for first-time mobile users as it did for someone browsing from a desktop.
Each screen was designed to reduce friction: from the moment a user landed on the site, we anticipated their doubts, guided their actions, and helped them reach a confident match.
We paired clear instructional steps with clean UI, and baked in fallbacks in case the AI couldn’t find a match. We also included platform-specific paths and motion elements to make the flow feel supportive — not clinical.
The result was a frictionless, guided journey that felt just as intuitive for first-time mobile users as it did for someone browsing from a desktop.
Each screen was designed to reduce friction: from the moment a user landed on the site, we anticipated their doubts, guided their actions, and helped them reach a confident match.
We paired clear instructional steps with clean UI, and baked in fallbacks in case the AI couldn’t find a match. We also included platform-specific paths and motion elements to make the flow feel supportive — not clinical.
The result was a frictionless, guided journey that felt just as intuitive for first-time mobile users as it did for someone browsing from a desktop.
04. VALIDATION & IMPLEMENTAtION
04. VALIDATION & IMPLEMENTAtION
04. VALIDATION & IMPLEMENTAtION
For user validation, individuals were stationed within physical stores equipped with the prototype. This allowed for direct user interaction and interviews to gather valuable opinions. The insights collected from these interviews informed successive iterations of the product, leading us to the development of our MVP. This iterative process ensured that the final product resonated with users and aligned seamlessly with their preferences and expectations.
For user validation, individuals were stationed within physical stores equipped with the prototype. This allowed for direct user interaction and interviews to gather valuable opinions. The insights collected from these interviews informed successive iterations of the product, leading us to the development of our MVP. This iterative process ensured that the final product resonated with users and aligned seamlessly with their preferences and expectations.
For user validation, individuals were stationed within physical stores equipped with the prototype. This allowed for direct user interaction and interviews to gather valuable opinions. The insights collected from these interviews informed successive iterations of the product, leading us to the development of our MVP. This iterative process ensured that the final product resonated with users and aligned seamlessly with their preferences and expectations.
