Estee Lauder Foundation finder is a new innovative application designed to disrupt the existing foundation matching process. Through the use of AI powered shade matching and AR technologies, users are able to discover their perfect shade of foundation without physically stepping in the store.

The Opportunity

Finding the perfect shade of foundation shade is complicated, it depends on several factors including skin tone, skin texture, and undertone. Women often struggle to find the correct shade of foundation and the process becomes even more difficult when browsing online as they cannot try the product on their skin. With over 50 shades of foundation to choose from, user’s needed a simple and effective way to find their perfect shade online

The Solution

We created an application that leverages AI and AR technologies to identify the closest possible foundation match for our users. It takes the guesswork out of shade detection, and education around foundation application. It is an easy and accessible way for the users to discover their perfect foundation match.

 

Platform

Mobile Web

Role

UX/UI Designer (Business and Competitive Research, Ideation, Wireframing, Visual Design)


Hi-Fi Mockups of Key Screens

Hifi mockup of key screens.png

Scope of Work

Our team was tasked with designing an MVP of the interface for the foundation finder. Some of the features that we wanted to showcase were

  1. Shade matching

  2. Trying on online to see a before and after

  3. Capability to Add to bag


Research 

RESEARCH TECHNIQUES: COMPETITIVE FEATURE ANALYSIS, USER INTERVIEWS, USER PERSONA, USER TESTING, ETHNOGRAPHIC FIELD STUDY

The goal of our research was to understand how people currently buy foundations, and learn of any objectives or frustrations users may have when shopping for foundations. To this end, we spoke with several knowledge experts in the industry, to learn more about what goes into the making of a foundation and what factors contribute to matching a foundation perfectly with a skin tone.

 
“ I’m very particular about my makeup, I don’t want it to look cakey”
— -Jules, 61
“I trust the salesperson to help me find the right shade of makeup”
— Sienna, 25
 
“I never buy foundation online because I never know how it will actually look on me”
— Marrisa, 24
“I want to see how the shade looks on my skin before buying it”
— - Davida, 43

Problem Statement

Finding the perfect shade of foundation is difficult because most women are not sure of their exact skin undertone which is a crucial factor in the matching of foundations.


How might we help our users fulfill their quest for the perfect foundation from the comfort of their home?

 

Research Insights

RESEARCH INSIGHTS

The biggest problem that users face when shopping for foundations is correctly identifying their undertones. They want to try the shade on their skin before buying it.

They trust the recommendation of the beauty agents because they believe them to be more knowledgeable when it comes to identifying skin and foundation formulas.

Although some competitor brands offered a foundation finder quiz on their website, none of them had any virtual ‘Try-On’ features.


 

DESIGN DECISION

Virtual ‘Try-On’ to help users try foundations on their face before buying

 

Competitive Studies

 

We looked at what Gilt's biggest competitors are currently doing, to identify possible areas of opportunity.
Possible opportunities -  

  • Creation of wish lists

  • Offering recommended items based on variables like season, occasion, location etc.

  • Allow barcode scanning to suggest similar items

  • Creation of a style profile

 
Competition Logos.png

Strategy

Problem Statement

 
 
Gilt Storyboard.png

The indecisive online shopper needs a way to interact socially while shopping so that they can corroborate and consult with someone they trust before making a purchase.

We created two personas that would portray possible Gilt shoppers in order to anticipate their wants and needs.

 

Primary Persona

Monica Michaels.jpg
 
 

Secondary Persona

Jerrard Jones.jpg

Ideation & Design Decisions

Feature Prioritization.jpg

After defining the problem, we brainstormed ideas to come up with the most effective solution using a Feature Prioritization matrix.

For this iteration, we decided to build a direct messaging feature for the users as it offered maximum value with minimum expense.


Design

 
 

I took the lead in sketching some ideas onto paper and doing a quick user test to make sure the features made sense . Then we followed it up with mid-fidelity wireframes, and put them in Invision to create a prototype and do further user tests.

 

Mid-fi wireframes of key screens

Wireframes of key screens.jpg
 
 

With our paper prototypes and wireframes completed, we set up our own usability lab and conducted a series of User Tests. These are some of the takeaways from the tests -

  1. All 3 user test participants agreed that the interface was simple and easy to navigate

  2. Since we wanted users to be able to access the validation of their friends directly and quickly, without having to go through the general settings on the sticky navigation, we redesigned the app to feature a bottom navigation bar with a messaging icon

  3. In our first design, we had the ‘ask a friend’ and the ‘compare' buttons right next to each other, but through user testing it was clear that people were getting confused here and it was also competing hierarchically with the ‘add to cart’ button

 
A4.png
 

Prototype

 

Scenario

In this prototype, our primary persona Jenna is looking to buy a red dress. She wants to ask her friend for advice. She chooses a friend from her most recent list and sends her a message.
The friend receives the message from Jenna and quickly votes her choice.
Jenna then gets a notification and checks to see what the verdict is.
This is a simple and intimate feature that can help Gilt win a loyal customer base. 

 
 

Next Steps

  1. Further user testing to validate efficacy, ease of use and purpose of features

  2. Build out messaging capabilities to further the user-to-user engagement

  3. More ways to connect socially

  4. Addition of ‘Wishlists’

 
 
Design is not just what it looks like and feels like. Design is how it works.
— Steve Jobs