Sephora E-Commerce UX/UI Redesign

Overview

                                          Redefining the mobile shopping flow to improve clarity, trust, and conversion.

                                            Sephora is a global beauty retailer with a massive, mobile-first audience. But while the brand reflects elegance and luxury, its mobile experience felt visually crowded and functionally disconnected from user expectations.

                                        As a UI/UX designer, I set out to redesign the Product Detail and Cart pages focusing on usability, visual hierarchy, and user trust, all while honoring the Sephora brand.

                                        This wasn’t just about making it prettier. It was about making decisions easier, checkout smoother, and users feel sure about their purchase.

Design Goals

Simplify product info layout for quicker decision-making

Streamline cart & checkout flow to reduce drop-offs

Declutter UI by organizing content into collapsible sections

Ensure visual consistency aligned with Sephora’s brand

Prioritize mobile usability with responsive and thumb-friendly design

Highlight trust signals like ratings, badges, and reviews

Before Design Snapshots

Here’s what I noticed in the original design:

  • Too many competing visual elements

  • Important actions like "Add to Cart" felt buried

  • No clear journey through product selection and checkout

These screens made it clear: the visual weight wasn’t supporting the decision flow

Design Enhancements and Evolution

With key issues identified, I refined the UI to boost clarity and conversion:

  • Expandable product sections for a cleaner, scannable layout

  • Sticky Add to Cart button with live shade and price info

  • Smart product carousel to suggest without distracting

  • Whitespace and dividers to improve readability

  • Checkout progress tracker to guide users step by step

Every decision aimed to simplify, reassure, and convert

After Design Showcase

Final Outcome:

Clean, accessible, and brand-aligned screens

Improved both usability and performance

What I Learned:

Great design clears the path—users should never second-guess actions

If I were to continue, I’d explore:

AI-driven product suggestions

Microinteractions for instant feedback

Voice support & high-contrast accessibility

Lets build something beautiful