Amazon Beauty
2023
Principal Design Lead
UX, Testing, Visual
Responsibilities
Competitor Analysis
Product Northstar
Design Strategy
Stakeholder Approval
Designs / Prototypes
Usability Testing
Dev Handoff
Adoption Strategies
Amazon Beauty
2023
Principal Design Lead
UX, Testing, Visual
Responsibilities
Competitor Analysis
Product Northstar
Design Strategy
Stakeholder Approval
Designs / Prototypes
Usability Testing
Dev Handoff
Adoption Strategies
120
Overview
Overview
Background
Background
In 2020, Amazon launched its first in-house virtual try-on (VTO) tool, starting with lipstick. While the product offered improved performance compared to the existing third-party option, it didn't quite match the capabilities of industry leaders. Recognizing this, Amazon set a goal to eliminate reliance on external VTO tools and develop a comprehensive VTO solution encompassing the full spectrum of makeup products.
In 2020, Amazon launched its first in-house virtual try-on (VTO) tool, starting with lipstick. While the product offered improved performance compared to the existing third-party option, it didn't quite match the capabilities of industry leaders. Recognizing this, Amazon set a goal to eliminate reliance on external VTO tools and develop a comprehensive VTO solution encompassing the full spectrum of makeup products.
Objective
Objective
Close the gap on VTO Industry Leaders, and transform VTO from a singular product try-on to a full-fledged virtual makeup studio, empowering users to create complete looks and shop with confidence.
Close the gap on VTO Industry Leaders, and transform VTO from a singular product try-on to a full-fledged virtual makeup studio, empowering users to create complete looks and shop with confidence.
120
Research
Research
Findings
Findings
Initial user research and competitor analysis indicated that static images provided the most accurate representation of makeup application. Additionally, users expressed a desire to seamlessly switch between product categories without restarting VTO. Ideally allowing users to experiment and create full makeup looks using a range of 3-5 products. The research also highlighted the need for detailed product information to support informed purchasing decisions, and that sharing capabilities would be a valuable tool for users to validate product choices and looks.
Initial user research and competitor analysis indicated that static images provided the most accurate representation of makeup application. Additionally, users expressed a desire to seamlessly switch between product categories without restarting VTO. Ideally allowing users to experiment and create full makeup looks using a range of 3-5 products. The research also highlighted the need for detailed product information to support informed purchasing decisions, and that sharing capabilities would be a valuable tool for users to validate product choices and looks.
Observations
Observations
Further analysis of existing beauty and cross-category VTO experiences exposed inconsistencies in interaction patterns and design system implementation, which contributed to user confusion.
Further analysis of existing beauty and cross-category VTO experiences exposed inconsistencies in interaction patterns and design system implementation, which contributed to user confusion.
120
Existing Experience
Existing Experience
Ingress
Permissions
Modality Selection
Virtual Try-On
Ingress
Permissions
Modality Selection
Virtual Try-On
Ingress
Permissions
Modality Selection
Virtual Try-On
Ingress
Permissions
Modality Selection
Virtual Try-On
Ingress
Permissions
Modality Selection
Virtual Try-On
Ingress
Permissions
Modality Selection
Virtual Try-On
Ingress
Permissions
Modality Selection
Virtual Try-On
Ingress
Permissions
Modality Selection
Virtual Try-On
120
Ideation
Ideation
Tasks
Tasks
To validate individual features, mid-fidelity designs were tested through unmoderated UserZoom sessions. This allowed for rapid iteration with winning design concepts translated into high-fidelity prototypes for moderated sessions with a smaller group of users, ultimately leading to the selection of the best solutions for the final VTO experience.
To validate individual features, mid-fidelity designs were tested through unmoderated UserZoom sessions. This allowed for rapid iteration with winning design concepts translated into high-fidelity prototypes for moderated sessions with a smaller group of users, ultimately leading to the selection of the best solutions for the final VTO experience.
120
Design Implementation
Design Implementation
80
01
Modaility Selection
Modaility Selection
Video onboarding showcased the power and inclusivity of VTO for all skin tones and features. Users could choose from diverse static models, upload their own photo for a personalized experience, or see the virtual makeup applied to their face in real-time via live camera.
Video onboarding showcased the power and inclusivity of VTO for all skin tones and features. Users could choose from diverse static models, upload their own photo for a personalized experience, or see the virtual makeup applied to their face in real-time via live camera.
80
02
3D Headshot
3D Headshot
The Northstar design delved into 3D headshot creation, allowing users to capture their likeness with exceptional detail. This translates to unmatched precision when applying virtual makeup. Furthermore, intuitive gestures like pinch, zoom, and rotate empower users to see the finest details and customize their avatar with unparalleled control.
The Northstar design delved into 3D headshot creation, allowing users to capture their likeness with exceptional detail. This translates to unmatched precision when applying virtual makeup. Furthermore, intuitive gestures like pinch, zoom, and rotate empower users to see the finest details and customize their avatar with unparalleled control.
80
03
Virtual Try-On
Virtual Try-On
The experience prioritized a large viewport to maximize focus on the user's face. Secondary information, like product discovery, reviews, and ingredients, were readily accessible through intuitive interactions within the interface.
The experience prioritized a large viewport to maximize focus on the user's face. Secondary information, like product discovery, reviews, and ingredients, were readily accessible through intuitive interactions within the interface.
80
04
Compare
Compare
For confident product selection, VTO offers a side-by-side comparison feature. Allowing users to experiment with multiple shades of beauty products and see them instantly applied to their virtual self.
For confident product selection, VTO offers a side-by-side comparison feature. Allowing users to experiment with multiple shades of beauty products and see them instantly applied to their virtual self.
80
05
In VTO Recommendations
In VTO Recommendations
Multi-product browse and search functionality allowed shoppers to create a complete look without having to leave the VTO experience.
Multi-product browse and search functionality allowed shoppers to create a complete look without having to leave the VTO experience.
80
05
Social Sharing
Social Sharing
Integrated social sharing to enable customers to seek feedback, gather opinions, and make informed purchasing decisions.
Integrated social sharing to enable customers to seek feedback, gather opinions, and make informed purchasing decisions.
120
120
Design System
Design System
A core aspect of this project was the creation of a VTO cross-category design system built upon Amazon's established Rio design patterns. This system prioritizes reusability and is adaptable to other VTO categories. By providing a library of essential UI components, consistent interaction patterns, and a unified visual language, the design system streamlines development across all VTO experiences, not just beauty.
A core aspect of this project was the creation of a VTO cross-category design system built upon Amazon's established Rio design patterns. This system prioritizes reusability and is adaptable to other VTO categories. By providing a library of essential UI components, consistent interaction patterns, and a unified visual language, the design system streamlines development across all VTO experiences, not just beauty.
120
120
Adoption
Adoption
Developed strategies and designs to make VTO prominent and interactive for shoppers at various touchpoints, attracting both new and existing customers.
Developed strategies and designs to make VTO prominent and interactive for shoppers at various touchpoints, attracting both new and existing customers.
120
120
120