AI-driven personalized avatar & stylist clothing shopping
Summary
Based on research, despite its market prominence, global fast fashion retailer ASOS faces challenges with an average 25% return rate for online shopping. To boost its brand loyalty and reduce return rate, I designed a personalized AI stylist feature with customized avatars and tailored outfit suggestions based on individual skin tones, body types, fashion styles, and occasions to enhance customer satisfaction.
My Roles
UX designer
UI designer
Tools
Figma/FigJam, Procreate, Gform
Methods
Qual survey
Qual interviews
Moderated usability test
Duration
Jun 2024 (3 weeks)
Opportunity & Constraints
Enhancing ASOS with an AI stylist feature
ASOS, with diverse fashion offerings but suffer from high return rates ~25% for online shopping, mainly due to the sizing and style mismatch problem. Due to its experience of AI innovation in improving user experiences, it is ideal for integrating an AI stylist feature.
The Challenge
Online shoppers can’t find clothes that match their body types, skin tones, fashion styles, or occasions
The current market still lacks diverse representations in the realm of online clothing shopping. Without in-store, in- person fittings, online shoppers face significant challenges, including selecting outfits suited to their personal style, body type, and skin tone. These issues often lead to higher return rates and missed opportunities for deeper customer engagement. With projected to grow to 285 million US online shoppers by 2025—addressing these pain points is critical.
Struggle with personal fashion styles
Lack of diverse models for accurate representation
Difficulty choosing appropriate attire for various events
Solution
Personalized avatar for AR fitting + AI stylist outfit suggestions
The ASOS AI Stylist feature, built into the e-commerce platform, streamlines shopping with three main components: personalized avatar creation for AR fitting, an adaptive style quiz, and intuitive result display with item swapping and cart functionality. This AI-driven solution merges user feedback and advanced technology for a uniquely satisfying shopping experience.
Personalized avatar creation for AR fitting
A fashion style quiz to analyze user preferences
Intuitive results display with options to swap items and add to the cart
Key screens of personalized avatar for AR fitting
Fill in basic body measurements to start the avatar body building
Pick a body shape to share muscle and fat distribution
Submit a headshot so the AI can assess skin tone, race, and facial features, enabling tailored recommendations
Fine-tune body shape by customizing chest, waist, hip, etc measurements for a more accurate representation
Key screens of AI stylist to help find the missing pieces
Typical style keyword quiz but with image support when hover over
Upload favorite outfit images to help AI personalized recommendations, with the option to choose from a database
Select preferred item(s) in submitted outfits to assist the AI in recognizing and refining your style preferences
Define the purpose of the AI's outfit recommendation
AI outfit recommendations with the feature of “go to the item”, “save the look”, and “swap item”
What Do Online Clothing Shoppers Struggle?
Sizing, fitting, event outfits choosing, and personal style development
A survey, interview, and affinity map regarding online clothing shoppers lifestyles, shopping habits, experiences, styling, and closet management were conducted. The result highlights that 50% of online clothing shoppers face sizing issues, struggle with defining personal style, have a hard time finding outfits & missing pieces for various events.
How does clothing shopping fit into their daily life professionally and personally?
What are these clothing shoppers shopping and styling experience and pain points?
60% of shoppers need realistic representation of clothing on diverse body types and skin tones.
100% of shoppers want guidance for event dressing, style matching, finding missing outfit pieces, or shopping recommendations.
33% shoppers experiment with mix-and-match, trial-and-error methods to develop their fashion style and make decisions.
What Do Our Competitors Do?
Major fashion brands lack sustained AI stylist features with high return rates result from sizing issues and style mismatch
Leading fast-fashion retailers like Zara, H&M, Uniqlo, and Forever 21 have yet to implement dedicated AI stylist features, despite exploring AR and AI technologies for try-ons and personalization. While some brands offer personalized sizing recommendations or limited AI tools, full integration of AI-driven features has not been achieved. See the complete analysis for more details.
How & what kind of cutting edge technology do the competitors adopt and incorporate into their user experience?
What kind of problems these competitors are facing and what kind of solution they adapt to resolve the problem?
None of ASOS competitors ever implemented AI stylist feature.
While all of them had AR try-on or AI related feature but not widespread, reflecting the room of growth.
These brands has average 20%-24% returning rate while the top two reason are sizing issue and style mismatch.
Who are our target customers?
Fashion enthusiasts pursue expanding style knowledge while busy professionals seek effortless fashion solutions
Our survey and interviews revealed two key personas: Fashion enthusiasts who value meticulous style details, and busy professionals seeking personal style development amidst time constraints. The personas are represented by a 41-year-old creative fashion designer and a 28-year-old outgoing business student.
Feature Set & User Flows
The user flows designed are focus on the onboarding process: accurate avatar building and user fashion style/ need quiz
Implementing "skip", "pre-built database", and "save for later" options will help avoid choice overload, accommodate time constraints, and gather sufficient information.
Designing a flow that balances conversational and intelligent adaptability with sufficient guidance to gather necessary information.
Combining keywords and representative images is the guiding principle behind designing a visually impactful AI stylist user flow.
Avatar building user flow
AI stylist fashion quiz user flow
Click the image to see a full size image
Lo-Fi Wireframe
The AI stylist lo-fi wireframe highlights key pop-up window screens and designs for the onboarding process.
Click the image to see a full size image
Brand Design & UI Kit
To preserve brand consistency, I combined original brand design elements with newly designed components. The new designs includes creating product cards, interactive select states, a status bar, and modal open/close tabs while maintaining the brand's established design aesthetic.
Usability Test
Users require flexible, image-assisted onboarding with progress-saving skippable steps to balance information & efficiency
How user-friendly is the AI stylist icon's location and design on the ASOS website?
Is the onboarding process clear, easy to follow, and pleasant for users?
Average icon search time is 5” while total task completion is 5’ 52”.
The lengthy onboarding process detracts from user satisfaction, though the AI stylist feature is highly valued.
Unclear guidance for body type queries confuses users in accurately depicting their physique.
Flexible onboarding with progress-saving steps, allowing skip without losing provided information is needed.
Click here to see the full usability test result.
Iteration
Users need the flexibility to choose from uploading pictures or presets
Before
No flexibility
After
With flexibility to choose from uploading pictures or presets
2. Break single long onboarding process down to shorter tasks
Before
One single long process
After
Break the single AI stylist flow into savable, editable Avatar & Fashion Preference tasks
3. Change from “open ended questions” to “guided body type questions”
One open ended question
Before
Multiple guided body type questions
After
Prototype
What I accomplished
I designed an AI Stylist feature for ASOS with personalized avatar creation for AR fitting and AI outfit suggestions.
This feature aims to resolve online shoppers’ challenges in matching outfits to their body types, skin tones, unique fashion styles, and occasions.
A seamless onboarding process balances AI intelligent adaptability and user guidance, offering flexible image options, text-image explanations, auto-saving steps, and manageable tasks while gathering sufficient information.
Next Steps and Reflection
Reflecting on my ASOS AI stylist project, I recognized the importance of guiding users through the onboarding process to ensure their comfort and trust in the platform's accuracy. Key lessons learned included avoiding standalone open-ended questions when integrating AI functionality, the effectiveness of a text-image questionnaire over text-only or image-only options, and the value of combining multiple-choice and open-ended questions. This approach offered clearer guidance for users while encouraging them to express their unique needs and preferences.
Simultaneously, I acknowledged the pressing need to delve into AI ethics within the fashion world. By promoting ethical integration and usage of AI technology, I sought to contribute positively to the industry and foster responsible innovation. Enhancing avatar accuracy and harnessing the swap function for feedback-driven outfit suggestions also became crucial components of my vision to blend technology and ethics harmoniously.
<< Previous
Effortless Sustainable Shopping: Website + Chrome Extension
Next >>
Transform Obscure User Experience in Background Check