Overview
You know that little rush you get when you find a promo code right when you’re about to check out? Yeah, our users weren’t getting that. Instead, they were hunting for codes like they were buried treasure, only to find out they weren’t eligible or had missed the fine print. Not great for conversions, not great for user experience, and definitely not great for Sephora SEA.
Overview
You know that little rush you get when you find a promo code right when you’re about to check out? Yeah, our users weren’t getting that. Instead, they were hunting for codes like they were buried treasure, only to find out they weren’t eligible or had missed the fine print. Not great for conversions, not great for user experience, and definitely not great for Sephora SEA.
Overview
You know that little rush you get when you find a promo code right when you’re about to check out? Yeah, our users weren’t getting that. Instead, they were hunting for codes like they were buried treasure, only to find out they weren’t eligible or had missed the fine print. Not great for conversions, not great for user experience, and definitely not great for Sephora SEA.
Overview
You know that little rush you get when you find a promo code right when you’re about to check out? Yeah, our users weren’t getting that. Instead, they were hunting for codes like they were buried treasure, only to find out they weren’t eligible or had missed the fine print. Not great for conversions, not great for user experience, and definitely not great for Sephora SEA.
The Goal
Our goal? To make promo codes easy to find, easy to understand, and even easier to apply so users could shop seamlessly without frustration. More clarity, less confusion, and ultimately, more completed purchases.
The Goal
Our goal? To make promo codes easy to find, easy to understand, and even easier to apply so users could shop seamlessly without frustration. More clarity, less confusion, and ultimately, more completed purchases.
The Goal
Our goal? To make promo codes easy to find, easy to understand, and even easier to apply so users could shop seamlessly without frustration. More clarity, less confusion, and ultimately, more completed purchases.
The Goal
Our goal? To make promo codes easy to find, easy to understand, and even easier to apply so users could shop seamlessly without frustration. More clarity, less confusion, and ultimately, more completed purchases.
Where this went down:
Where this went down:
Where this went down:
Where this went down:
Platforms
Platforms
Platforms
Platforms
1.
Desktop, Mobile Site, App (Android & iOS)
1.
Desktop, Mobile Site, App (Android & iOS)
1.
Desktop, Mobile Site, App (Android & iOS)
1.
Desktop, Mobile Site, App (Android & iOS)
Countries
Countries
Countries
Countries
1.
Singapore, Malaysia, Indonesia, Thailand, Hong Kong, Philippines, Australia, New Zealand
1.
Singapore, Malaysia, Indonesia, Thailand, Hong Kong, Philippines, Australia, New Zealand
1.
Singapore, Malaysia, Indonesia, Thailand, Hong Kong, Philippines, Australia, New Zealand
1.
Singapore, Malaysia, Indonesia, Thailand, Hong Kong, Philippines, Australia, New Zealand
My Role: UX Strategy, Design & Team Alignment
My responsibilities included:
My Role: UX Strategy, Design & Team Alignment
My responsibilities included:
My Role: UX Strategy, Design & Team Alignment
My responsibilities included:
My Role: UX Strategy, Design & Team Alignment
My responsibilities included:
Defining UX strategy
Defining UX strategy
Defining UX strategy
Defining UX strategy
Conducting research and gathering data
Conducting research and gathering data
Conducting research and gathering data
Conducting research and gathering data
Designing wireframes, prototypes, and user flows for web and app
Designing wireframes, prototypes, and user flows for web and app
Designing wireframes, prototypes, and user flows for web and app
Designing wireframes, prototypes, and user flows for web and app
Collaborating closely with business stakeholders, PMs, and developers to ensure alignment on user goals and technical feasibility
Collaborating closely with business stakeholders, PMs, and developers to ensure alignment on user goals and technical feasibility
Collaborating closely with business stakeholders, PMs, and developers to ensure alignment on user goals and technical feasibility
Collaborating closely with business stakeholders, PMs, and developers to ensure alignment on user goals and technical feasibility
Digging into the Problem
Users were getting lost in promo code chaos—missing available discounts, struggling to find eligibility details, and ultimately bouncing before completing their purchase.
Digging into the Problem
Users were getting lost in promo code chaos—missing available discounts, struggling to find eligibility details, and ultimately bouncing before completing their purchase.
Digging into the Problem
Users were getting lost in promo code chaos—missing available discounts, struggling to find eligibility details, and ultimately bouncing before completing their purchase.
Digging into the Problem
Users were getting lost in promo code chaos—missing available discounts, struggling to find eligibility details, and ultimately bouncing before completing their purchase.
Key Pain Points:
Key Pain Points:
Key Pain Points:
Key Pain Points:
1.
Promo codes were hidden or hard to find
1.
Promo codes were hidden or hard to find
1.
Promo codes were hidden or hard to find
1.
Promo codes were hidden or hard to find
2.
Users didn’t know which promos they were eligible for
2.
Users didn’t know which promos they were eligible for
2.
Users didn’t know which promos they were eligible for
2.
Users didn’t know which promos they were eligible for
3.
No clear guidance on how to unlock better deals
3.
No clear guidance on how to unlock better deals
3.
No clear guidance on how to unlock better deals
3.
No clear guidance on how to unlock better deals
4.
The cart page lacked transparency on applied discounts
4.
The cart page lacked transparency on applied discounts
4.
The cart page lacked transparency on applied discounts
4.
The cart page lacked transparency on applied discounts
UX Strategy: Tackling It Head on
To turn things around, I rolled out a structured UX strategy that focused on:
UX Strategy: Tackling It Head on
To turn things around, I rolled out a structured UX strategy that focused on:
UX Strategy: Tackling It Head on
To turn things around, I rolled out a structured UX strategy that focused on:
UX Strategy: Tackling It Head on
To turn things around, I rolled out a structured UX strategy that focused on:
1.
User Research & Data Gathering:
1.
User Research & Data Gathering:
1.
User Research & Data Gathering:
1.
User Research & Data Gathering:
1.
Understanding where and why users were struggling
1.
Understanding where and why users were struggling
1.
Understanding where and why users were struggling
1.
Understanding where and why users were struggling
2.
Competitive Analysis:
2.
Competitive Analysis:
2.
Competitive Analysis:
2.
Competitive Analysis:
1.
Learning from six other major beauty retailers to see what worked
1.
Learning from six other major beauty retailers to see what worked
1.
Learning from six other major beauty retailers to see what worked
1.
Learning from six other major beauty retailers to see what worked
3.
Iterative Design & Testing:
3.
Iterative Design & Testing:
3.
Iterative Design & Testing:
3.
Iterative Design & Testing:
1.
Prototyping, user testing, refining, repeat
1.
Prototyping, user testing, refining, repeat
1.
Prototyping, user testing, refining, repeat
1.
Prototyping, user testing, refining, repeat
4.
Team Alignment:
4.
Team Alignment:
4.
Team Alignment:
4.
Team Alignment:
1.
Ensuring business goals and technical feasibility stayed on track
1.
Ensuring business goals and technical feasibility stayed on track
1.
Ensuring business goals and technical feasibility stayed on track
1.
Ensuring business goals and technical feasibility stayed on track
What We Learned From the Competition
I analyzed promo code experiences across six competitors, and a few patterns stood out:
What We Learned From the Competition
I analyzed promo code experiences across six competitors, and a few patterns stood out:
What We Learned From the Competition
I analyzed promo code experiences across six competitors, and a few patterns stood out:
What We Learned From the Competition
I analyzed promo code experiences across six competitors, and a few patterns stood out:
Always display applied promo details on the cart page.
Always display applied promo details on the cart page.
Always display applied promo details on the cart page.
Always display applied promo details on the cart page.
Have a dedicated promo selection page for easy browsing.
Have a dedicated promo selection page for easy browsing.
Have a dedicated promo selection page for easy browsing.
Have a dedicated promo selection page for easy browsing.
Grayed-out or separate tabs for ineligible promos = clarity.
Grayed-out or separate tabs for ineligible promos = clarity.
Grayed-out or separate tabs for ineligible promos = clarity.
Grayed-out or separate tabs for ineligible promos = clarity.
Show “how much more to unlock” info which motivates users to add more to their cart.
Show “how much more to unlock” info which motivates users to add more to their cart.
Show “how much more to unlock” info which motivates users to add more to their cart.
Show “how much more to unlock” info which motivates users to add more to their cart.
Once a code is applied, bring users back to the cart page with promo details clearly displayed.
Once a code is applied, bring users back to the cart page with promo details clearly displayed.
Once a code is applied, bring users back to the cart page with promo details clearly displayed.
Once a code is applied, bring users back to the cart page with promo details clearly displayed.
We took these insights and put them to work.
We took these insights and put them to work.
We took these insights and put them to work.
We took these insights and put them to work.
The images below highlight examples from two of the competitors I reviewed.
The images below highlight examples from two of the competitors I reviewed.
The images below highlight examples from two of the competitors I reviewed.
The images below highlight examples from two of the competitors I reviewed.
The Design Process
The Design Process
The Design Process
Wireframes
I kicked things off with low-fidelity wireframes, mapping out a smoother, more intuitive promo code experience. These early designs were reviewed by stakeholders and devs to ensure feasibility and catch any gaps before moving forward.
Wireframes
I kicked things off with low-fidelity wireframes, mapping out a smoother, more intuitive promo code experience. These early designs were reviewed by stakeholders and devs to ensure feasibility and catch any gaps before moving forward.
Wireframes
I kicked things off with low-fidelity wireframes, mapping out a smoother, more intuitive promo code experience. These early designs were reviewed by stakeholders and devs to ensure feasibility and catch any gaps before moving forward.
Wireframes
I kicked things off with low-fidelity wireframes, mapping out a smoother, more intuitive promo code experience. These early designs were reviewed by stakeholders and devs to ensure feasibility and catch any gaps before moving forward.
Prototyping & User Flows
With wireframes in place, I built detailed user flows for the Android app and tested them in usability sessions. The goal? To validate that our new design made promo code discovery and application feel effortless.
Prototyping & User Flows
With wireframes in place, I built detailed user flows for the Android app and tested them in usability sessions. The goal? To validate that our new design made promo code discovery and application feel effortless.
Prototyping & User Flows
With wireframes in place, I built detailed user flows for the Android app and tested them in usability sessions. The goal? To validate that our new design made promo code discovery and application feel effortless.
Prototyping & User Flows
With wireframes in place, I built detailed user flows for the Android app and tested them in usability sessions. The goal? To validate that our new design made promo code discovery and application feel effortless.
Default User Flow
Default User Flow
Default User Flow
Default User Flow
Multiple Gift With Purchase User Flow
Multiple Gift With Purchase User Flow
Multiple Gift With Purchase User Flow
Multiple Gift With Purchase User Flow
Usability Testing: Putting the Designs to the Test
To make sure we were on the right track, we tested the new flow with 30 users from Singapore, Malaysia, and Australia via UsabilityHub.
Usability Testing: Putting the Designs to the Test
To make sure we were on the right track, we tested the new flow with 30 users from Singapore, Malaysia, and Australia via UsabilityHub.
Usability Testing: Putting the Designs to the Test
To make sure we were on the right track, we tested the new flow with 30 users from Singapore, Malaysia, and Australia via UsabilityHub.
Usability Testing: Putting the Designs to the Test
To make sure we were on the right track, we tested the new flow with 30 users from Singapore, Malaysia, and Australia via UsabilityHub.
Task 1: Promo Code Discovery
Task 1: Promo Code Discovery
Task 1: Promo Code Discovery
Task 1: Promo Code Discovery
Task:
Task:
Task:
Task:
Find where to apply promo codes in the cart.
Find where to apply promo codes in the cart.
Find where to apply promo codes in the cart.
Find where to apply promo codes in the cart.
Result:
Result:
Result:
Result:
77% of users correctly clicked on the “View all promo codes” link. (We repositioned it based on feedback to push that number higher.)
77% of users correctly clicked on the “View all promo codes” link. (We repositioned it based on feedback to push that number higher.)
77% of users correctly clicked on the “View all promo codes” link. (We repositioned it based on feedback to push that number higher.)
77% of users correctly clicked on the “View all promo codes” link. (We repositioned it based on feedback to push that number higher.)
Task 2: Eligibility Awareness
Task 2: Eligibility Awareness
Task 2: Eligibility Awareness
Task 2: Eligibility Awareness
Task:
Task:
Task:
Task:
Identify which promos they were eligible for.
Identify which promos they were eligible for.
Identify which promos they were eligible for.
Identify which promos they were eligible for.
Result:
Result:
Result:
Result:
90% of users nailed it. Clear labeling for the win!
90% of users nailed it. Clear labeling for the win!
90% of users nailed it. Clear labeling for the win!
90% of users nailed it. Clear labeling for the win!
Task 3: “How Much More to Unlock” Clarity
Task 3: “How Much More to Unlock” Clarity
Task 3: “How Much More to Unlock” Clarity
Task 3: “How Much More to Unlock” Clarity
Task:
Task:
Task:
Task:
Understand what’s needed to qualify for a discount.
Understand what’s needed to qualify for a discount.
Understand what’s needed to qualify for a discount.
Understand what’s needed to qualify for a discount.
Result:
Result:
Result:
Result:
67% of users got it right.
67% of users got it right.
67% of users got it right.
67% of users got it right.
Task 4: Changing Applied Promos
Task 4: Changing Applied Promos
Task 4: Changing Applied Promos
Task 4: Changing Applied Promos
Task:
Task:
Task:
Task:
Swap out a promo code after applying one.
Swap out a promo code after applying one.
Swap out a promo code after applying one.
Swap out a promo code after applying one.
Result:
Result:
Result:
Result:
94% of users found the “Change promo” option instantly. No friction here!
94% of users found the “Change promo” option instantly. No friction here!
94% of users found the “Change promo” option instantly. No friction here!
94% of users found the “Change promo” option instantly. No friction here!
Final Design: A More Intuitive Promo Experience
The final design made promo codes easy to find, easy to apply, and transparent throughout checkout. After multiple testing rounds and stakeholder feedback, the new flow was successfully rolled out across all platforms.
Final Design: A More Intuitive Promo Experience
The final design made promo codes easy to find, easy to apply, and transparent throughout checkout. After multiple testing rounds and stakeholder feedback, the new flow was successfully rolled out across all platforms.
Final Design: A More Intuitive Promo Experience
The final design made promo codes easy to find, easy to apply, and transparent throughout checkout. After multiple testing rounds and stakeholder feedback, the new flow was successfully rolled out across all platforms.
Final Design: A More Intuitive Promo Experience
The final design made promo codes easy to find, easy to apply, and transparent throughout checkout. After multiple testing rounds and stakeholder feedback, the new flow was successfully rolled out across all platforms.
Seamless Development Handoff
Seamless Development Handoff
Seamless Development Handoff
Seamless Development Handoff
A great design means nothing if it doesn’t translate well in development. To ensure smooth execution, I provided detailed spec sheets covering:
A great design means nothing if it doesn’t translate well in development. To ensure smooth execution, I provided detailed spec sheets covering:
A great design means nothing if it doesn’t translate well in development. To ensure smooth execution, I provided detailed spec sheets covering:
A great design means nothing if it doesn’t translate well in development. To ensure smooth execution, I provided detailed spec sheets covering:
Subtotal Discount Breakdown
Clear guidelines on how discounts should be calculated and displayed.
Subtotal Discount Breakdown
Clear guidelines on how discounts should be calculated and displayed.
Subtotal Discount Breakdown
Clear guidelines on how discounts should be calculated and displayed.
Subtotal Discount Breakdown
Clear guidelines on how discounts should be calculated and displayed.
Character Limits
Ensuring promo code names fit neatly across different devices.
Character Limits
Ensuring promo code names fit neatly across different devices.
Character Limits
Ensuring promo code names fit neatly across different devices.
Character Limits
Ensuring promo code names fit neatly across different devices.
Coupon Arrangement
Best practices for sorting and displaying promotions.
Coupon Arrangement
Best practices for sorting and displaying promotions.
Coupon Arrangement
Best practices for sorting and displaying promotions.
Coupon Arrangement
Best practices for sorting and displaying promotions.
Error Handling
Defining UI responses for potential user errors.
Error Handling
Defining UI responses for potential user errors.
Error Handling
Defining UI responses for potential user errors.
Error Handling
Defining UI responses for potential user errors.
Empty State & Applied Promo States
Setting expectations for all user scenarios.
Empty State & Applied Promo States
Setting expectations for all user scenarios.
Empty State & Applied Promo States
Setting expectations for all user scenarios.
Empty State & Applied Promo States
Setting expectations for all user scenarios.
The Results: Did It Work? Hell Yes.
3.52% increase in conversion rates. Users had an easier, more seamless shopping experience. Promo-related confusion and cart abandonment went down.
The Results: Did It Work? Hell Yes.
3.52% increase in conversion rates. Users had an easier, more seamless shopping experience. Promo-related confusion and cart abandonment went down.
The Results: Did It Work? Hell Yes.
3.52% increase in conversion rates. Users had an easier, more seamless shopping experience. Promo-related confusion and cart abandonment went down.
The Results: Did It Work? Hell Yes.
3.52% increase in conversion rates. Users had an easier, more seamless shopping experience. Promo-related confusion and cart abandonment went down.
By taking a research-backed, user-first approach, we turned promo code frustration into a smooth, intuitive flow that helped users get the discounts they wanted without the hassle. A win-win for both shoppers and Sephora SEA.
By taking a research-backed, user-first approach, we turned promo code frustration into a smooth, intuitive flow that helped users get the discounts they wanted without the hassle. A win-win for both shoppers and Sephora SEA.
By taking a research-backed, user-first approach, we turned promo code frustration into a smooth, intuitive flow that helped users get the discounts they wanted without the hassle. A win-win for both shoppers and Sephora SEA.
By taking a research-backed, user-first approach, we turned promo code frustration into a smooth, intuitive flow that helped users get the discounts they wanted without the hassle. A win-win for both shoppers and Sephora SEA.
The Takeaway? Good UX = Good Business
When users don’t have to work hard to find what they need, they’re more likely to convert. Simple as that. This project reinforced the power of strategic UX in improving both user satisfaction and business outcomes.
The Takeaway? Good UX = Good Business
When users don’t have to work hard to find what they need, they’re more likely to convert. Simple as that. This project reinforced the power of strategic UX in improving both user satisfaction and business outcomes.
The Takeaway? Good UX = Good Business
When users don’t have to work hard to find what they need, they’re more likely to convert. Simple as that. This project reinforced the power of strategic UX in improving both user satisfaction and business outcomes.
The Takeaway? Good UX = Good Business
When users don’t have to work hard to find what they need, they’re more likely to convert. Simple as that. This project reinforced the power of strategic UX in improving both user satisfaction and business outcomes.