Scope
UX Research
UX Design
Accessibility ResearchDuration
2 - 3 months
Worked 2x a Week
Tools
Google Forms
Figma
Scope
Scope
UX Research
UX Design
Accessibility Research
UX Research
UX Design
Accessibility Research
Duration
Duration
2 - 3 months
Worked 2x a Week
2 - 3 months
Worked 2x a Week
Tools
Tools
Google Forms
Figma
Google Forms
Figma
Project Overview
Project Overview
Project Team: Anika Gupta, Arushi Gupta, Tiffany Lau
Project Team: Anika Gupta, Arushi Gupta, Tiffany Lau
Background: Lauder’s ELC Accessible Beauty Virtual Hackathon wants teams to ideate/develop inclusive technology solution that enhances accessibility in the beauty industry.
Background: Lauder’s ELC Accessible Beauty Virtual Hackathon wants teams to ideate/develop inclusive technology solution that enhances accessibility in the beauty industry.
Goal: Design an application for an inclusive technology solution to help tackle accessibility challenges in the beauty industry. Solutions can address online or in-person shopping experiences, accessibility in UX design, equal access to beauty products, and more.
Goal: Design an application for an inclusive technology solution to help tackle accessibility challenges in the beauty industry. Solutions can address online or in-person shopping experiences, accessibility in UX design, equal access to beauty products, and more.
Challenge: In the beauty industry, there is a lack of accurate & user-friendly resources to help visually impaired people use and apply makeup. This makes it difficult for them to apply makeup and they have to seek alternative ways without help.
Challenge: In the beauty industry, there is a lack of accurate & user-friendly resources to help visually impaired people use and apply makeup. This makes it difficult for them to apply makeup and they have to seek alternative ways without help.
My Role:
Competitive Analysis, UX Research, Affinity Diagramming, Ideation, Wireframing, Prototyping
Milestone 2:
Ideating and Evaluating the Existing Interface
Goal: Craft a solution which uses our research to improve an existing product in the industry or create our own product/app.
Approach: We started brainstorming solutions based off of the research we did.
Milestone 2:
Ideating and Evaluating the Existing Interface
Milestone 2:
Ideating and Evaluating the Existing Interface
Goal: Craft a solution which uses our research to improve an existing product in the industry or create our own product/app.
Approach: We started brainstorming solutions based off of the research we did.
Milestone 2:
Ideating and Evaluating the Existing Interface
Milestone 3:
Finalizing Features & Developing the Prototype
Goal: Organize the features of the app so that a userflow can be made to structure the app. Then make wireframes and a high-fidelity prototype of the app.
Approach: We started by making a list of the features and then made a userflow diagram to organize the user's tasks. Then we made the prototype on Figma.
Final Deliverables:
Utilize any relevant developer tool and build a project
Include a link to functional code repository
Include a demo video (around 5 minutes)
Contribution Overview:
Competitive Analysis, UX Research, Affinity Diagramming, Ideation, Wireframing, Prototyping
Competitive Analysis
Project Team: Anika Gupta, Arushi Gupta, Tiffany Lau
Background: Lauder’s ELC Accessible Beauty Virtual Hackathon wants teams to ideate/develop inclusive technology solution that enhances accessibility in the beauty industry.
Goal: Develop a functional application for an inclusive technology solution to help tackle accessibility challenges in the beauty industry. Solutions can address online or in-person shopping experiences, accessibility in UX design, equal access to beauty products, and more.
Project Overview
Problem Statement: In the beauty industry, there is a lack of accurate & user-friendly resources to help visually impaired people use and apply makeup. This makes it difficult for them to apply makeup and they have to seek alternative ways without help.
Final Deliverables:Utilize any relevant developer tool and build a project Include a link to functional code repositoryInclude a demo video (around 5 minutes)
Contribution Overview: Competitive Analysis, UX Research, Affinity Diagramming, Ideation, Wireframing, Prototyping
Jump to F nal Design
i
Milestone 1:
Understanding the needs of users requiring accessibility
Goal: My team wanted to better understand what solutions already existed for providing accessibility in the makeup industry. We wanted to research both online shopping and makeup products themselves.
Approach: We performed competitive analysis of accessible apps in the makeup industry to find out solutions that exist already. We knew that Lauder had their own app called the Estée Lauder Virtual Make-up Assistant so we performed a heuristic analysis of it to find their strengths and weaknesses.
Aff nity Diagramming
Competitive Analysis
We organized the best insights from the information on Figjam
i
P&G app called Be my eyes answers blind and low-vision consumers' haircare questions
Colorful QR codes, people can scan these to receive information out loud in a smartphone app
Google Lookout reads grocery labels for blind people and what people are holding
Starbucks has partnered with Aira, to connect customers to visual interpreters who relay visual info through their app. Their employees also learn sign language
Asda has an indoor map service so when shopping you can use location to find the product
Products that have the same size and design should be differentiated
Embossed text or other tactile differentiators are very useful
Different types of packaging for types like (mat or glossy) are useful
Make shade palettes with 12 or fewer colors to make it easy to map out
Adding fragrance is helpful in being able to tell which product it is
Products should have bigger surface areas to reduce the chance of slipping from the user's hand
Make packaging designs with higher color contrast
Braille (dot writing system) is difficult to read and only 10% of blind people can read braille
80% of visually impaired people are aged 50 or older
Someone can be legally blind but still see colors, shapes and varying degrees of light
Deaf people have two main ways of communicating with others – lip reading and sign language.
70 million deaf people use sign language
Only 30% of spoken English can be accurately lip read
Research
What are things people don't know about visual and hearing impairment?
What are the features of the services researched? What is their unique selling proposition?
How is the makeup industry specifically creating solutions?
What can be done to improve the accessibility of makeup products?
Usability Testing
Solution
We organized the best insights from the information on Figjam
Ideation
We did a group brainstorming session
where we all thought of potential ideas
After some research we found out about Estee Lauder's
existing makeup AI assistant app
What features will our version of the app include?
Through analyzing the existing Estee Lauder Voice-enabled Makeup Assistant, we decided to focus on improving their original app based on our research since their app laid the groundwork for what we envisioned.
Round 1
Near Field Communication Chips
Radio-frequency identification Chip
Smart Mirrors with Voice Assistance
Customizable Makeup Kits
Audio Tutorials and Guides
Round 2
We analyzed how to improving the existing app:
Make-up consultation/anyone can help and based on that it scans the face and gives personalized specialised feedback
Pre-setted makeup routines (filters)
Go through their color customization
Skin-care included
More customization
Easier and more accessible
Go through that process or something faster
Will be used step by step and give feedback (if they don’t want help from a live specialist then they can skip it )
App Insights:
One of our team members tested out the app to see if it works.
The AI scanning is inaccurate since when she applied eye shadow only 1 eyelid, it said that her makeup was perfect so it didn’t check properly before asking to move on to the next step.
Voice-enabled Makeup Assistant's voice is very annoying
Not enough features to help visually impaired people (e.g. nothing to teach how to apply makeup)
If there were consultations then users could get live feedback and advice on products for their skin
Skincare is a huge part of makeup so it would be ideal to include step-by-step routines
image: showing my teammate testing the app and getting the eye shadow error
Our App Features:
It will have information on each product of the makeup routine
It can scan your face and tell you where to apply each product
One-time free Estee Lauder Beauty Expert consultation which helps you determine what to buy (in person / online)
Different looks and different steps for those looks
Desk Research
After looking at several videos and articles on skincare and makeup, we began to understand the most important components of skincare and makeup and their purposes.
10 Step Basic Makeup & Skincare Routine
Serum - hydrate skin and prevent uneven skin tone
Moisturizer - warm up and apply
Eye cream
Foundation
Concealer
Eye gel
Powder
Blush
Mascara
Lipstick
We went through our research and figured out what features were most important to implement so that we could figure out the userflow based on these needs.
App Features
We went through our research and figured out what features were most important to implement so that we could figure out the userflow based on these needs.
Userf ow Diagram
The app would start with a splash screen
Then it would proceed to login/signup
The onboarding screens: show off the features
There will be face-scanning
Makeup or Skincare Navigation
Then in each section you could choose from the options
There will also be the option to talk to an expert
l
Wireframing
High-Fidelity Prototype
Final Design
Since we didn’t have time to make a low-fidelity prototype, we used Figma to make a high-fidelity prototype which encompassed all the features that we wanted.
Contribution Overview:
I researched eight general companies to explore their approaches to accessibility and conducted a specific competitive analysis within the makeup industry. Using affinity diagramming, I drew insights that guided our ideation process to enhance Estee Lauder's app. My focus was on wireframing and high-fidelity prototyping, leveraging my experience with Figma to bring the app mockups to life.
What I learned:
This project marked my first deep dive into accessibility-focused UX work, a topic I've been eager to explore. It reinforced the importance of improving accessibility for users, a principle I'll carry forward in all my future projects. Additionally, I saw significant growth in my prototyping skills and benefited from collaborating with a teammate who brought valuable expertise to the table.
Thank you for visiting!
Come say hi!
Directory
© 2024 Anika Gupta
Designed by Anika Gupta
Lauderlook
Aff nity Diagramming
Competitive Analysis
We organized the best insights from the information on Figjam
i
P&G app called Be my eyes answers blind and low-vision consumers' haircare questions
Colorful QR codes, people can scan these to receive information out loud in a smartphone app
Google Lookout reads grocery labels for blind people and what people are holding
Starbucks has partnered with Aira, to connect customers to visual interpreters who relay visual info through their app. Their employees also learn sign language
Asda has an indoor map service so when shopping you can use location to find the product
Research
What are the features of the services researched?
What is their unique selling proposition?
How is the makeup industry specifically creating solutions?
Braille (dot writing system) is difficult to read and only 10% of blind people can read braille
80% of visually impaired people are aged 50 or older
Someone can be legally blind but still see colors, shapes and varying degrees of light
Deaf people have two main ways of communicating with others – lip reading and sign language.
70 million deaf people use sign language
Only 30% of spoken English can be accurately lip read
What are things people don't know about visual and hearing impairment?
Products that have the same size and design should be differentiated
Embossed text or other tactile differentiators are very useful
Different types of packaging for types like (mat or glossy) are useful
Make shade palettes with 12 or fewer colors to make it easy to map out
Adding fragrance is helpful in being able to tell which product it is
Products should have bigger surface areas to reduce the chance of slipping from the user's hand
Make packaging designs with higher color contrast
What can be done to improve the accessibility of makeup products?
How is the makeup industry specifically creating solutions?
P&G app called Be my eyes answers blind and low-vision consumers' haircare questions
Colorful QR codes, people can scan these to receive information out loud in a smartphone app
Google Lookout reads grocery labels for blind people and what people are holding
Starbucks has partnered with Aira, to connect customers to visual interpreters who relay visual info through their app. Their employees also learn sign language
Asda has an indoor map service so when shopping you can use location to find the product
Braille (dot writing system) is difficult to read and only 10% of blind people can read braille
80% of visually impaired people are aged 50 or older
Someone can be legally blind but still see colors, shapes and varying degrees of light
Deaf people have two main ways of communicating with others – lip reading and sign language.
70 million deaf people use sign language
Only 30% of spoken English can be accurately lip read
What are things people don't know about visual and hearing impairment?
Products that have the same size and design should be differentiated
Embossed text or other tactile differentiators are very useful
Different types of packaging for types like (mat or glossy) are useful
Make shade palettes with 12 or fewer colors to make it easy to map out
Adding fragrance is helpful in being able to tell which product it is
Products should have bigger surface areas to reduce the chance of slipping from the user's hand
Make packaging designs with higher color contrast
What can be done to improve the accessibility of makeup products?
How is the makeup industry specifically creating solutions?
P&G app called Be my eyes answers blind and low-vision consumers' haircare questions
Colorful QR codes, people can scan these to receive information out loud in a smartphone app
Google Lookout reads grocery labels for blind people and what people are holding
Starbucks has partnered with Aira, to connect customers to visual interpreters who relay visual info through their app. Their employees also learn sign language
Asda has an indoor map service so when shopping you can use location to find the product
Braille (dot writing system) is difficult to read and only 10% of blind people can read braille
80% of visually impaired people are aged 50 or older
Someone can be legally blind but still see colors, shapes and varying degrees of light
Deaf people have two main ways of communicating with others – lip reading and sign language.
70 million deaf people use sign language
Only 30% of spoken English can be accurately lip read
What are things people don't know about visual and hearing impairment?
Products that have the same size and design should be differentiated
Embossed text or other tactile differentiators are very useful
Different types of packaging for types like (mat or glossy) are useful
Make shade palettes with 12 or fewer colors to make it easy to map out
Adding fragrance is helpful in being able to tell which product it is
Products should have bigger surface areas to reduce the chance of slipping from the user's hand
Make packaging designs with higher color contrast
What can be done to improve the accessibility of makeup products?
How is the makeup industry specifically creating solutions?
P&G app called Be my eyes answers blind and low-vision consumers' haircare questions
Colorful QR codes, people can scan these to receive information out loud in a smartphone app
Google Lookout reads grocery labels for blind people and what people are holding
Starbucks has partnered with Aira, to connect customers to visual interpreters who relay visual info through their app. Their employees also learn sign language
Asda has an indoor map service so when shopping you can use location to find the product
Braille (dot writing system) is difficult to read and only 10% of blind people can read braille
80% of visually impaired people are aged 50 or older
Someone can be legally blind but still see colors, shapes and varying degrees of light
Deaf people have two main ways of communicating with others – lip reading and sign language.
70 million deaf people use sign language
Only 30% of spoken English can be accurately lip read
What are things people don't know about visual and hearing impairment?
Products that have the same size and design should be differentiated
Embossed text or other tactile differentiators are very useful
Different types of packaging for types like (mat or glossy) are useful
Make shade palettes with 12 or fewer colors to make it easy to map out
Adding fragrance is helpful in being able to tell which product it is
Products should have bigger surface areas to reduce the chance of slipping from the user's hand
Make packaging designs with higher color contrast
What can be done to improve the accessibility of makeup products?
How is the makeup industry specifically creating solutions?
P&G app called Be my eyes answers blind and low-vision consumers' haircare questions
Colorful QR codes, people can scan these to receive information out loud in a smartphone app
Google Lookout reads grocery labels for blind people and what people are holding
Starbucks has partnered with Aira, to connect customers to visual interpreters who relay visual info through their app. Their employees also learn sign language
Asda has an indoor map service so when shopping you can use location to find the product
Milestone 2:
Ideating and Evaluating the Existing Interface
Goal: Craft a solution which uses our research to improve an existing product in the industry or create our own product/app.
Approach: We started brainstorming solutions based off of the research we did.
Ideation
Usability Testing
Soolution
Desk Research
Milestone 2:
Ideating and Evaluating the Existing Interface
Goal: Craft a solution which uses our research to improve an existing product in the industry or create our own product/app.
Approach: We started brainstorming solutions based off of the research we did.
Ideation
Usability Testing
Soolution
Desk Research
Usability Testing
Solution
We organized the best insights from the information on Figjam
Ideation
We did a group brainstorming session
After some research we found out about Estee Lauder's
existing makeup AI assistant app
What features will our version of the app include?
Through analyzing the existing Estee Lauder Voice-enabled Makeup Assistant, we decided to focus on improving their original app based on our research since their app laid the groundwork for what we envisioned.
Round 1
Near Field Communication Chips
Radio-frequency identification Chip
Smart Mirrors with Voice Assistance
Customizable Makeup Kits
Audio Tutorials and Guides
Round 2
We analyzed how to improving the existing app:
Make-up consultation/anyone can help and based on that it scans the face and gives personalized specialised feedback
Pre-setted makeup routines (filters)
Go through their color customization
Skin-care included
More customization
Easier and more accessible
Go through that process or something faster
Will be used step by step and give feedback (if they don’t want help from a live specialist then they can skip it )
image: showing my teammate testing the app and getting the eye shadow error
Our App Features:
It will have information on each product of the makeup routine
It can scan your face and tell you where to apply each product
One-time free Estee Lauder Beauty Expert consultation which helps you determine what to buy (in person / online)
Different looks and different steps for those looks
Desk Research
After looking at several videos and articles on skincare and makeup, we began to understand the most important components of skincare and makeup and their purposes.
10 Step Basic Makeup & Skincare Routine
Serum - hydrate skin and prevent uneven skin tone
Moisturizer - warm up and apply
Eye cream
Foundation
Concealer
Eye gel
Powder
Blush
Mascara
Lipstick
App Insights:
One of our team members tested out the app to see if it works.
The AI scanning is inaccurate since when she applied eye shadow only 1 eyelid, it said that her makeup was perfect so it didn’t check properly before asking to move on to the next step.
Voice-enabled Makeup Assistant's voice is very annoying
Not enough features to help visually impaired people (e.g. nothing to teach how to apply makeup)
If there were consultations then users could get live feedback and advice on products for their skin
Skincare is a huge part of makeup so it would be ideal to include step-by-step routines
Milestone 3:
Finalizing Features & Developing the Prototype
Goal: Organize the features of the app so that a userflow can be made to structure the app. Then make wireframes and a high-fidelity prototype of the app.
Approach: We started by making a list of the features and then made a userflow diagram to organize the user's tasks. Then we made the prototype on Figma.
App Features
Userflow Diagrams
Wireframe
Prototyping
Milestone 3:
Finalizing Features & Developing the Prototype
Goal: Organize the features of the app so that a userflow can be made to structure the app. Then make wireframes and a high-fidelity prototype of the app.
Approach: We started by making a list of the features and then made a userflow diagram to organize the user's tasks. Then we made the prototype on Figma.
App Features
Userflow Diagrams
Wireframe
Prototyping
Come say hi!
Designed by Anika Gupta
Directory
Thank you for visiting!
© 2024 Anika Gupta
Come say hi!
Designed by Anika Gupta
Directory
Thank you for visiting!
© 2024 Anika Gupta
We went through our research and figured out what features were most important to implement so that we could figure out the userflow based on these needs.
App Features
We designed a userflow based on the features and a user journey that we created.
Userf ow Diagram
l
The app would start with a splash screen
Then it would proceed to login/signup
The onboarding screens: show off the features
There will be face-scanning
Makeup or Skincare Navigation
Then in each section you could choose from the options
There will also be the option to talk to an expert
Wireframing
High-Fidelity Prototype
Final Design
Since we didn’t have time to make a low-fidelity prototype, we used Figma to make a high-fidelity prototype which encompassed all the features that we wanted.
Contribution Overview:
I researched eight general companies to explore their approaches to accessibility and conducted a specific competitive analysis within the makeup industry. Using affinity diagramming, I drew insights that guided our ideation process to enhance Estee Lauder's app. My focus was on wireframing and high-fidelity prototyping, leveraging my experience with Figma to bring the app mockups to life.
What I learned:
This project marked my first deep dive into accessibility-focused UX work, a topic I've been eager to explore. It reinforced the importance of improving accessibility for users, a principle I'll carry forward in all my future projects. Additionally, I saw significant growth in my prototyping skills and benefited from collaborating with a teammate who brought valuable expertise to the table.
Milestone 1:
Understanding users
requiring accessibility
Goal: My team wanted to better understand what solutions already existed for providing accessibility in the makeup industry.
Approach: We performed competitive analysis of accessible apps in the makeup industry to find out solutions that exist already.
Competitive Analysis
Milestone 1:
Understanding users
requiring accessibility
Goal: My team wanted to better understand what solutions already existed for providing accessibility in the makeup industry.
Approach: We performed competitive analysis of accessible apps in the makeup industry to find out solutions that exist already.
Competitive Analysis
P&G app called Be my eyes answers blind and low-vision consumers' haircare questions
Colorful QR codes, people can scan these to receive information out loud in a smartphone app
Google Lookout reads grocery labels for blind people and what people are holding
Starbucks has partnered with Aira, to connect customers to visual interpreters who relay visual info through their app. Their employees also learn sign language
Asda has an indoor map service so when shopping you can use location to find the product
How is the makeup industry specifically creating solutions?
Competitive Analysis
We organized the best insights from the information on Figjam
Research
What are the features of the services researched?
What is their unique selling proposition?
Products that have the same size and design should be differentiated
Embossed text or other tactile differentiators are very useful
Different types of packaging for types like (mat or glossy) are useful
Make shade palettes with 12 or fewer colors to make it easy to map out
Adding fragrance is helpful in being able to tell which product it is
Products should have bigger surface areas to reduce the chance of slipping from the user's hand
Make packaging designs with higher color contrast
What can be done to improve the accessibility of makeup products?
How is the makeup industry specifically creating solutions?
P&G app called Be my eyes answers blind and low-vision consumers' haircare questions
Colorful QR codes, people can scan these to receive information out loud in a smartphone app
Google Lookout reads grocery labels for blind people and what people are holding
Starbucks has partnered with Aira, to connect customers to visual interpreters who relay visual info through their app. Their employees also learn sign language
Asda has an indoor map service so when shopping you can use location to find the product
Braille (dot writing system) is difficult to read and only 10% of blind people can read braille
80% of visually impaired people are aged 50 or older
Someone can be legally blind but still see colors, shapes and varying degrees of light
Deaf people have two main ways of communicating with others – lip reading and sign language.
70 million deaf people use sign language
Only 30% of spoken English can be accurately lip read
What are things people don't know about visual and hearing impairment?
Products that have the same size and design should be differentiated
Embossed text or other tactile differentiators are very useful
Different types of packaging for types like (mat or glossy) are useful
Make shade palettes with 12 or fewer colors to make it easy to map out
Adding fragrance is helpful in being able to tell which product it is
Products should have bigger surface areas to reduce the chance of slipping from the user's hand
Make packaging designs with higher color contrast
What can be done to improve the accessibility of makeup products?
How is the makeup industry specifically creating solutions?
P&G app called Be my eyes answers blind and low-vision consumers' haircare questions
Colorful QR codes, people can scan these to receive information out loud in a smartphone app
Google Lookout reads grocery labels for blind people and what people are holding
Starbucks has partnered with Aira, to connect customers to visual interpreters who relay visual info through their app. Their employees also learn sign language
Asda has an indoor map service so when shopping you can use location to find the product
Braille (dot writing system) is difficult to read and only 10% of blind people can read braille
80% of visually impaired people are aged 50 or older
Someone can be legally blind but still see colors, shapes and varying degrees of light
Deaf people have two main ways of communicating with others – lip reading and sign language.
70 million deaf people use sign language
Only 30% of spoken English can be accurately lip read
What are things people don't know about visual and hearing impairment?
Products that have the same size and design should be differentiated
Embossed text or other tactile differentiators are very useful
Different types of packaging for types like (mat or glossy) are useful
Make shade palettes with 12 or fewer colors to make it easy to map out
Adding fragrance is helpful in being able to tell which product it is
Products should have bigger surface areas to reduce the chance of slipping from the user's hand
Make packaging designs with higher color contrast
What can be done to improve the accessibility of makeup products?
How is the makeup industry specifically creating solutions?
P&G app called Be my eyes answers blind and low-vision consumers' haircare questions
Colorful QR codes, people can scan these to receive information out loud in a smartphone app
Google Lookout reads grocery labels for blind people and what people are holding
Starbucks has partnered with Aira, to connect customers to visual interpreters who relay visual info through their app. Their employees also learn sign language
Asda has an indoor map service so when shopping you can use location to find the product
Braille (dot writing system) is difficult to read and only 10% of blind people can read braille
80% of visually impaired people are aged 50 or older
Someone can be legally blind but still see colors, shapes and varying degrees of light
Deaf people have two main ways of communicating with others – lip reading and sign language.
70 million deaf people use sign language
Only 30% of spoken English can be accurately lip read
What are things people don't know about visual and hearing impairment?
Products that have the same size and design should be differentiated
Embossed text or other tactile differentiators are very useful
Different types of packaging for types like (mat or glossy) are useful
Make shade palettes with 12 or fewer colors to make it easy to map out
Adding fragrance is helpful in being able to tell which product it is
Products should have bigger surface areas to reduce the chance of slipping from the user's hand
Make packaging designs with higher color contrast
What can be done to improve the accessibility of makeup products?
How is the makeup industry specifically creating solutions?
P&G app called Be my eyes answers blind and low-vision consumers' haircare questions
Colorful QR codes, people can scan these to receive information out loud in a smartphone app
Google Lookout reads grocery labels for blind people and what people are holding
Starbucks has partnered with Aira, to connect customers to visual interpreters who relay visual info through their app. Their employees also learn sign language
Asda has an indoor map service so when shopping you can use location to find the product
Braille (dot writing system) is difficult to read and only 10% of blind people can read braille
80% of visually impaired people are aged 50 or older
Someone can be legally blind but still see colors, shapes and varying degrees of light
Deaf people have two main ways of communicating with others – lip reading and sign language.
70 million deaf people use sign language
Only 30% of spoken English can be accurately lip read
What are things people don't know about visual and hearing impairment?
Aff nity Diagramming
Ideation
We did a group brainstorming session
Round 1
Near Field Communication Chips
Radio-frequency identification Chip
Smart Mirrors with Voice Assistance
Customizable Makeup Kits
Audio Tutorials and Guides
Round 2
We analyzed how to improving the existing app:
Make-up consultation/anyone can help and based on that it scans the face and gives personalized specialised feedback
Pre-setted makeup routines (filters)
Go through their color customization
Skin-care included
More customization
Easier and more accessible
Go through that process or something faster
Will be used step by step and give feedback (if they don’t want help from a live specialist then they can skip it )
After some research we found out about Estee Lauder's
existing makeup AI assistant app
Usability Testing
App Insights:
One of our team members tested out the app to see if it works.
The AI scanning is inaccurate since when she applied eye shadow only 1 eyelid, it said that her makeup was perfect so it didn’t check properly before asking to move on to the next step.
Voice-enabled Makeup Assistant's voice is very annoying
Not enough features to help visually impaired people (e.g. nothing to teach how to apply makeup)
image: showing my teammate testing the app and getting the eye shadow error
Solution
Our App Features:
It will have information on each product of the makeup routine
It can scan your face and tell you where to apply each product
One-time free Estee Lauder Beauty Expert consultation which helps you determine what to buy (in person / online)
Different looks and different steps for those looks
What are the features will our version of the app offer?
We decided to focus on improving their original app based on our research since their app laid the groundwork for what we envisioned.
Desk Research
After looking at several videos and articles on skincare and makeup, we began to understand the most important components of skincare and makeup and their purposes.
10 Step Basic Makeup & Skincare Routine
Serum - hydrate skin and prevent uneven skin tone
Moisturizer - warm up and apply
Eye cream
Foundation
Concealer
Eye gel
Powder
Blush
Mascara
Lipstick
Milestone 3:
Finalizing Features & Developing the Prototype
Goal: Organize the features of the app so that a userflow can be made to structure the app. Then make wireframes and a high-fidelity prototype of the app.
Approach: We started by making a list of the features and then made a userflow diagram to organize the user's tasks. Then we made the prototype on Figma.
Milestone 3:
Finalizing Features & Developing the Prototype
Goal: Organize the features of the app so that a userflow can be made to structure the app. Then make wireframes and a high-fidelity prototype of the app.
Approach: We started by making a list of the features and then made a userflow diagram to organize the user's tasks. Then we made the prototype on Figma.
App Features
We went through our research and figured out what features were most important to implement so that we could figure out the userflow based on these needs.
Userf ow Diagram
We designed a userflow based on the features and a user journey that we created.
The app would start with a splash screen
Then it would proceed to login/signup
The onboarding screens: show off the features
There will be face-scanning
Makeup or Skincare Navigation
Then in each section you could choose from the options
There will also be the option to talk to an expert
Wireframing
High-Fidelity Prototype
Since we didn’t have time to make a low-fidelity prototype, we used Figma to make a high-fidelity prototype which encompassed all the features that we wanted.
Final Design
Contribution Overview:
I researched eight general companies to explore their approaches to accessibility and conducted a specific competitive analysis within the makeup industry. Using affinity diagramming, I drew insights that guided our ideation process to enhance Estee Lauder's app. My focus was on wireframing and high-fidelity prototyping, leveraging my experience with Figma to bring the app mockups to life.
What I learned:
This project marked my first deep dive into accessibility-focused UX work, a topic I've been eager to explore. It reinforced the importance of improving accessibility for users, a principle I'll carry forward in all my future projects. Additionally, I saw significant growth in my prototyping skills and benefited from collaborating with a teammate who brought valuable expertise to the table.
Come say hi!
Directory
Designed by Anika Gupta
Thank you for visiting!
© 2024 Anika Gupta
Come say hi!
Directory
Designed by Anika Gupta
Thank you for visiting!
© 2024 Anika Gupta
l
Process
Process
Usability Testing
Solution
We organized the best insights from the information on Figjam
Ideation
We did a group brainstorming session
where we all thought of potential ideas
After some research we found out about Estee Lauder's
existing makeup AI assistant app
What features will our version of the app include?
Through analyzing the existing Estee Lauder Voice-enabled Makeup Assistant, we decided to focus on improving their original app based on our research since their app laid the groundwork for what we envisioned.
Round 1
Near Field Communication Chips
Radio-frequency identification Chip
Smart Mirrors with Voice Assistance
Customizable Makeup Kits
Audio Tutorials and Guides
Round 2
We analyzed how to improving the existing app:
Make-up consultation/anyone can help and based on that it scans the face and gives personalized specialised feedback
Pre-setted makeup routines (filters)
Go through their color customization
Skin-care included
More customization
Easier and more accessible
Go through that process or something faster
Will be used step by step and give feedback (if they don’t want help from a live specialist then they can skip it )
App Insights:
One of our team members tested out the app to see if it works.
The AI scanning is inaccurate since when she applied eye shadow only 1 eyelid, it said that her makeup was perfect so it didn’t check properly before asking to move on to the next step.
Voice-enabled Makeup Assistant's voice is very annoying
Not enough features to help visually impaired people (e.g. nothing to teach how to apply makeup)
If there were consultations then users could get live feedback and advice on products for their skin
Skincare is a huge part of makeup so it would be ideal to include step-by-step routines
image: showing my teammate testing the app and getting the eye shadow error
Our App Features:
It will have information on each product of the makeup routine
It can scan your face and tell you where to apply each product
One-time free Estee Lauder Beauty Expert consultation which helps you determine what to buy (in person / online)
Different looks and different steps for those looks
Desk Research
After looking at several videos and articles on skincare and makeup, we began to understand the most important components of skincare and makeup and their purposes.
10 Step Basic Makeup & Skincare Routine
Serum - hydrate skin and prevent uneven skin tone
Moisturizer - warm up and apply
Eye cream
Foundation
Concealer
Eye gel
Powder
Blush
Mascara
Lipstick
We went through our research and figured out what features were most important to implement so that we could figure out the userflow based on these needs.
App Features
We went through our research and figured out what features were most important to implement so that we could figure out the userflow based on these needs.
Userf ow Diagram
The app would start with a splash screen
Then it would proceed to login/signup
The onboarding screens: show off the features
There will be face-scanning
Makeup or Skincare Navigation
Then in each section you could choose from the options
There will also be the option to talk to an expert
l
Wireframing
High-Fidelity Prototype
Final Design
Since we didn’t have time to make a low-fidelity prototype, we used Figma to make a high-fidelity prototype which encompassed all the features that we wanted.
Contribution Overview:
I researched eight general companies to explore their approaches to accessibility and conducted a specific competitive analysis within the makeup industry. Using affinity diagramming, I drew insights that guided our ideation process to enhance Estee Lauder's app. My focus was on wireframing and high-fidelity prototyping, leveraging my experience with Figma to bring the app mockups to life.
What I learned:
This project marked my first deep dive into accessibility-focused UX work, a topic I've been eager to explore. It reinforced the importance of improving accessibility for users, a principle I'll carry forward in all my future projects. Additionally, I saw significant growth in my prototyping skills and benefited from collaborating with a teammate who brought valuable expertise to the table.
Thank you for visiting!
Come say hi!
Directory
© 2024 Anika Gupta
Designed by Anika Gupta
Thank you for visiting!
Come say hi!
Directory
© 2024 Anika Gupta
Designed by Anika Gupta