top of page
Frame 7_2x.png

My Personal Stylist

Create an immersive and combined experience to solve problems among young people group on clothing collocation and clothing management.🥼👚👕👖

project info

Duration 
 

Sept - Dec.2020

my role

Project Planning

User research 

Product Design

Product management 

User test

Video producing 

Key words
 

User Research 

Immersive Experience Design

Service Design

Product Design 

group members
 

Sinan XIE

Pengchang ZHENG

Overview
Background
Don't Know WHAT TO WEAR Everyday Before Going Out?

You must be familiar with the following scene, especially girls...😂

According to our observation, modern young people nowadays have different degrees of trouble managing their clothes. Their clothing management problems most happened in clothing collocation and chose clothes they should wear, such as:

nrm_1411132548-clueless.jpeg

Don't know how to match a good suit.​

56ddd5893d714141b9876fcee132cc59.jpeg

Collocation errors occur in clothes shopping between new clothes and old clothes,

c3b3f92172442d6cd7cee8df57d82ff3.jpeg

Waste too much time trying on different outfits of clothes every day before going out.

TB288kCvUlnpuFjSZFjXXXTaVXa_!!2873770540-0-headline_editor.jpeg

Always feel lack of clothes, even they had bought thousands of clothes in home, especially in girls.

landscape-1435336002-landscape-1435257370-landscape-1435244854-lizzie-lead.jpeg

Don't know how to choose a suit for particular occasions.

0783ba73ab987cddc97fdff80535d781.jpeg

Have little aesthetic in clothes collocation. 

Overview
Our solution

A Digital "Personal Closet" Could Help U!

We designed a system that combined a mobile app and smart home closet to help people solve all the problems on clothing collocation and clothes set purchasing, providing an immersive experience on a new way of matching clothes and clothing management. 

Smart Home Closet

(provide AR mirror )

Mobile App

our final ​design
Key Features 
1. Start Journey:
Create a digital personal closet quickly, collecting all your clothes. 

Upload your clothes to a digital closet

by importing purchased clothes data through a shopping app or code label recognition, you can quickly create your own digital closet.🤩

渲染closet3 1.png
首页套装.gif
2. Auto matching 
Virtual Fitting

When you want to wear some clothes but don't know how to collocate with them?

Try to use our Recommended Collocation

and "Try" it on the AR mirror : )

3. Get your daily Outfits Recommendations : )

Don't want to think about what to wear?

Just pick up Daily Outfits Recommendations on the home page : )

Based on your historical preference data, we recommend the daily outfits through real-time weather, the style you like, and times you wear the clothes...based on your historical preference data.

首页套装.gif
4. Organize all your clothes with tags
Good for searching! 
创建tag.gif
5. Economical Purchasing Guidance 
Decrease clothes waste.

We provide the most economical purchasing guidance for you! 

You can see the outfits of collocations on to-be-purchased clothes and old clothes in advance.

浏览购买.gif
Design Solution
​design process
User Research

User Research on Questionnaire, Interview and Obersvation

We discussed some troubles people may have about clothing management, purchasing, collocation and other aspects through early brainstorming, and got questionnaire answers from different groups through online questionnaires. In conclusion, a total of 133 people filled in the questionnaire. The questionnaire results let us have a preliminary understanding of people's current situation and their attitude in clothing purchase, wear, clothing management and other aspects. In view of this common problem among young people, we conducted observations, online surveys, and in-depth interviews

observation-key-icon-long-shadow-260nw-1858040014.jpeg
v2-6550c4ef18120e9fcb241678b81d3018_1440w.png
work-travail-banner-1024x341.jpeg

Observation at shopping mall

Online survey: 133 feedbacks

(image from google)

Focus group & individuals interview

Observation 
  • What do people usually do at shopping mall when buying a new clothes?
_应时代和群众的要求而作_简评田间的诗歌道路_伦海.png

At shopping mall

  • Girls always check if the clothes could match with other clothes, while boys usually check clothes' color and size.

  • Instead of buying a set of clothes, people tend to separate the clothes to buy.

Oline Survey
lO3JGdCwt3_small.jpeg
  • We divided the questionnaire into two versions: the workplace and campus versions. The two editions have the same title and only distinguish target groups.

  • In the end, a total of 133 people filled in the questionnaire. The questionnaire results help us obtain a preliminary understanding of people's current situation and their attitude in clothing purchase, wear, clothing management, and other aspects.

e.g. Question1:

截屏2022-01-21 00.51_edited.jpg
截屏2022-01-21 00.51_edited.jpg

e.g. Question 2:

  • Almost everyone has trouble in dressing in some occasion.

  • When buying new clothes, most people would consider whether to match the clothes before.

  • Most of them follow a particular style, occasionally try different styles

In-depth Interview
IMG_8851.jpg
  • We interviewed 11 people, including 4 people for 1on1 interviews and 7 people for a focus group interview. Each of our interviews was written and recorded. 7 people are boys and 4 are girls, 2 of whom have work experience. Their answers and feedback provided us with many important needs and problems related to clothing, which guided us to further comb out the needs of users in this aspect.

  • Focus Group

截屏2021-11-10 20.41.37.png
  • 7 participants: 4 boys & 2 girls

  • 6 students  & 1 white-collar 

  • Interview time: about 2 h

  • Individual Interviews 

截屏2021-11-10 20.42.14.png
  • 4 participants: 3 boys & 1 girl

  • 2 students & 2 white-collar 

  • Interview time: about 50min/person

  • major finding on user behavior 

We concluded users' typical behavior on clothing searching, purchasing, management, collocation, arranging, finding recommendations through the questionnaires and interviews. And we analyzed some troubles people may have on that whole journey.

               Clothes Purchasing

  • When most people buy clothes, they will consider how to collocate new clothes with old clothes they already have.

  • But a few people don't think at all about matching new clothes with existing clothes.

   Search for Clothes Online

  • There are two main ways to find specific kind of clothes they want online:

  • Search for results after manually entering text.

  • Use image recognition function in some online shopping apps.

           Clothes Management

  • Two reasons for those clothes people don't wear very often:

  • They found the effect of upper body clothing isn't ideal after buying.

  • People are too lazy to try on new outfits of other clothes since they alreaady havd some accustomed collocation

Find Outfits Recommendation 

  • They type to search a specific style first, and then find outfits recommendations about that style, instead of aimlessly getting recommendations in different styles.

  • Some people like to see the outfit recommendations through online BBS, but they do not directly buy  them due to fear of commercial ads.

    Arrange the Closet

  • When seasons change, some just exchang the clothes mechanically, putting the clothes of current season to the outer layer.

  • Others reorganize the clothes carefully, eliminating some clothes, and counting  some ignored clothes  under the bottom.

     Clothing Collocation Problems 

  • Three common problems:

  • Some people don't know how to wear a outfit even they know the  specific style they want.

  • They don't know how to match other clothes with a certain cloth they want to wear.

  • Just spend TOO MUCH time on that, like trying on many new suits, searching for many outfits online.

截屏2021-11-10 21.04.14.png
截屏2021-11-10 21.03.25.png
截屏2021-11-10 21.03.47.png
截屏2021-11-10 21.03.54.png
截屏2021-11-10 21.03.25.png
截屏2021-11-10 21.04.27.png
-major finding
  • User classes

Through the research questionnaires and interviews research, we divide the target users of our product into the following 4 groups, And we organized different characteristics and pain points of different user groups.

截屏2021-11-10 21.04.53.png

Girls in School

Characteristics:

  • Young

  • Good aesthetic

  • Love shopping

  • But on a tight budget

  • Specific dressing style

截屏2021-11-10 21.05.01.png

Women at Work

  • Mature 

  • Have plenty of clothing

  • A wide range of  dressing style

截屏2021-11-10 21.05.14.png

Boys in School

  • Have some social demands

  • Have consciousness of outfits

  • But lack aesthetic

截屏2021-11-10 21.05.19.png

Men at Work

  • Stable dressing style

  • Aesthetic taste can be improved

  • User persona 

Here are a example of specific user PERSONA with their needs and goals. We take a typical girl in school to present their different characteristics in very detail.

PERSONA - Light.png
  • User Goals

After we determined our target users classes and analyzed their different characteristics, we figured out 6 types of user goals on their clothing collocations, management, purchasing, and aesthetics. 

  • Get personalized daily  recommendations of outfits.

  • Balance the number of times the clothes in the closet, to avoid some unfound clothes being wasted

  • Expect the most cost-effective clothing guide

  • Improve aesthetic taste on outfits (mostly needed by boys)

  • Reduce time spent on matching clothes

  • Each clothes has its own suit (more demand for girls)

-user goal

Ideation 

So many insights we gained from our user research. Now comes our ideation part in the product design.

Ideation
  • Product requirements 

First, we need to ideate the main functions of  the product we want to design,  to conquer most pain points we got from our user research.

截屏2021-11-15 23.44.05.png

​Upload Data

Firstly, we hope users can upload their clothing database quickly so that they can establish a personal digital closet, which is helpful for subsequent clothing recommendations and other functions.

截屏2021-11-15 23.43.59.png

Clothing Match

Give clothing-matching suggestions (in multi-occasion and multi-style), based on the existing clothes in user's closet. Thus they can save a lot money in buying unnecessary new clothes.

截屏2021-11-15 23.43.31.png
截屏2021-11-15 23.43.40.png

 Recommendation of Outfits

 Purchasing guidance

Recommendations for outfits (not provided by merchants), and users can search for similar clothes in the closet to dress like the recomanded outfits.

Clothes shopping guide, which allows users to not only meet the present needs of users, but also match the existing clothes they have while purchasing clothes.

截屏2021-11-15 23.43.52.png

​Clothing management

Discover the potential of each piece of clothing. 

Balance the frequency of wearing all the clothes in the closet, and try to avoid clothing waste

  • Marketing research

After we ideate preliminary functions of  our product,  we investigated more than 10 apps on the market about "clothing and outfit" management. We analyze their product positioning, context of use, relative function, advantages and disadvantages.

The following is the analysis of 2 competitive products that inspired us a lot. 

13261637056075_.pic.jpg
小红书icon.png

 Red

1. Positioning: user-created content, shopping sharing community, community e-commerce

2. Different users directly upload their personal style of wearing, presenting it as graphic notes

3. Users are allowed to directly search the characteristics of clothing, brands and directly get matching suggestions

7. Disadvantages: Users could only see other people's outfits and still had no idea what they were going to wear.

13271637056076_.pic.jpg
13281637056556_.pic.jpg

Qing qi

1. Positioning: personal electronic wardrobe;

2. Daily wear: the daily wear take advice and according to the weather, occasion, etc., can be targeted to recommend;

3. Today's outfits: user upload collocation information manually.

4. Simple functions, to input your current clothes, jewelry, a batch input function and taobao directly import;

5. Can look at the clothes cost, clothes to wear a number, etc.;

6. Interface is clean and simple.

7. Disadvantages: users to upload photos collocation information, may be more trouble

-marketing research
  •  Conlusion on Comparative Analysis
截屏2021-11-16 18.28.04.png

The existing design in the market mostly concern recording your daily outfit, checking clothes' basic information finding some inspiration about others outfits (nothing every convenient or meaningful).

The core problem is you couldn't get recommendations of outfits based on your own clothes, so every time you see thousands of good outfits in your phone, you still don't know how to collocate your own clothes. 

  •  our design goal

we get many inspirations from current product in the market, their functions, advantages and disadvantages. Conbined with the user goal and product requirements we concluded before, we have the preliminary design inspirations on our own products.  

截屏2021-11-17 18.46.00.png

Through scanning code labels (like Taobao's code label scanning function) or connected to an e-commerce platform(Amazon, Taobao) to import users' clothes they bought into the digital personal closet. Meanwhile, import the electronic data of clothing, such as brand, color, style, material, or other data, to help the auto-collocation in that digital closet.

  •   Step 1

After users create their digital closet, we can directly provide complete sets of wear recommendations (based on the user's EXISTING CLOTHES).

If users require a specific style of outfits, we can also do it according to the style they give.

  •   Step 2
截屏2021-11-17 18.46.21.png
截屏2021-11-17 18.46.31.png

When users choose new clothes, They may struggle with the collocation between new clothes and existing clothes. We can also provide users with virtual collocation between the clothes they want to buy and the clothes they have and recommend many collocation schemes.

  •   Step 3
Our Design Goal
  • Hierarchical task analysis

Now we have some features and requirements for our product. Before we start to prototype, we analyze each task users may encounter, determine the characteristics of those tasks, and impact the interface design. 

Upload Clothes
截屏2021-11-17 20.10.22.png
Acquire Clothes Recommendation
截屏2021-11-17 20.10.44.png
Browse Through All the Clothes
截屏2021-11-17 20.11.32.png
Get Dressing Inspiration
截屏2021-11-17 20.11.16.png
Identify self
截屏2021-11-17 20.11.45.png
  • information architecture 

Before I create the low-fidelity prototype, I arrange all the functions and information architecture in our product. The key buttons on the menu are "Daily Dress," "Closet," "Explore," and "Me."

  • Daily Dress: Get daily outfits recommendations here.

  • Closet: Users' digital closet, showing all the clothes in categories. 

  • Explore: Learn inspirations of clothes collocations from others' good-looking outfits. 

  • Me: Something about your clothes statistical data.

The whole information architecture of the App is in the following diagram.

人因app.png

Prototyping 

In prototyping stage, we experienced 3 major ITERATIONS:

1. Low-fidelity prototype-Heuristic evaluation-

2. High-fidelity prototype-Usability test-

3. Final deisgn-Relection 

Prototyping

—— 1st Iteration ——

 Low-fidelity Prototype Deisgn & Heuristic Evaluation-

4 key tabs on the menu are "Daily Dress", "Closet", "Explore", and "Me".

  • low-fidelity prototype

Daily Dress    Closet    Explore    Me

截屏2021-11-18 16.16.39.png
截屏2021-11-18 16.15.33.png
截屏2021-11-18 16.15.44.png
截屏2021-11-18 16.15.53.png
截屏2021-11-18 16.16.04.png

Daily Dress Page:

Home page

Get daily outfits recommendations here. Also, you can search for a specific style of a recommended outfit.

Closet Page:

Users' digital closet. Show all the clothes in categories. You can also find a set of good-looking outfit by chosing one clothes here.

Explore Page:

Learn inspirations of clothes collocations from others' good outfits. At the same time get the most money-saving shopping guidance.

Me Page:

Something about your clothes statistical data, and clothes you delete or clothes in your favorites/collect list. 

Also some key features in our product, like uploading, auto-matching clothing, clothes organizing, getting outfits recommendations,  aesthetics taste improving,  are shown in our first prototype.

截屏2021-11-10 21.08.29.png
  • Heuristics evaluation

In Heuristic Evaluation section, we invited the professor, teaching assistant and 5 classmates of the same major to use the low-fidelity prototype we provided and give us some suggestions. According to 10 Jakob Nielsen's Usability Heuristics for UI design, we summarized a Heuristic Evaluation Feedback report, including some usability problems and their severity.

  • HE Feedback
  • Clothing details need to add a clothing's location (like in which wardrobe), size information, other information deleted to be determined.

  • The position of Custom tag buttons should change. Make adding icon fixed

  • Add a "create a new match" button in the clothing detail page to enter a new page to create a new set of outfits based on the clothing.

  • Unify the four buttons on the item details page.

  • Outfits Records need to deepen the secondary pages.

  • Purchasing recommendation logic changed a little: someone proposed whether he can get recommendations of ACC according to a set of outfits.

  • The sorting order of Daily Inspiration's recommendations can be according to the fit on the users' existing clothes. 

—— 2nd Iteration ——

High-fidelity Prototype Deisgn & Usabilityty Test

  • high-fidelity prototype

4 key tabs on the menu are "Recommend", "Closet", "Explore", and "Me".

4 Home page design
Frame 52_edited.jpg

Daily Dress

Closet 

Explore

Me 

  • Key features
淘宝导入.gif
标签导入.gif

Import purchased clothes data through shopping app

Upload by scanning code label

Start Journey:  Upload your clothes to digital closet

By photo recognition or importing purchased clothes data through shopping app, you can quickly upload clothes to the app.

Organize all your clothes

After importing them to your digital closet, our system can classify all your clothes by diffeerent styles and  other data tags 

Group 56.png
Group 58.png
套装推荐.gif

Automatic Matching: Get different clothes matching suggestions

when you want to wear some clothes but don't know how to collocate with them?

Try to use our Recommended Collocation of each clothes!

Pick up your daily Outfits in home page : )

13571637543896_.pic_hd.jpg

If u are a cute-style girl... your daily  recommendations will be like this 👆

Don't want to think about what to wear?

Just pick up daily Outfits recommendations on the home page : )

We recommend the daily outfits to you through real-time weather, the style you like, times you wear the clothes...based on your historical preference data.

截屏2021-11-22 20.31.36.png

If u are a sport-style man...

your daily  recommendations will be like this 👆

Group 55.png

Wanna buy some new clothes?

We provide the most economical purchasing guidance for you! 

you can see the outfits of collocations on to-be-purchased clothes and old clothes in advance.

Aesthetics taste improving!

Feeling like you don't have good aesthetic on clothes?

We Recommended plenty of picked Outfits based on your own clothes to give your inspirations about how to wear

浏览购买.gif
  • design improvement after Heuristic evaluation
回收站.gif

Clothes Recycle: make use of every clothes you don't like anymore

Wanna throw some old clothes you dont like anymore? 

Move them to Recycle Bin and contact the local recycle organization.

Customize outfits you like

Not only can you get many recommended outfits  from our recommendation mechanism, but also you can define what's your own style, what's your favorite outfits by yourself .

创建套装.gif
截屏2021-11-22 22.34.47.png
创建tag.gif

New way to edit the category 

In the clothes details page, we provide an access for user to edit the category tag, or create a new tag.

Key Features
  • Usability Testing

After the fully interactive prototype was completed, we found 5 users(both of them are students at Tsinghua University) to help us complete the usability testing, mainly doing some specific tasks we gave them.

During the testing, we focused on observing their usage problems, whether the product is simple, friendly, and intuitive to users, and collected various problems encountered by users and their thoughts on the product, to facilitate our next improvement.

  • Methodology 
  • Ask users to think aloud

  • Observe users, especially focus on what slow them down and what mistakes they made

  • Collect timing data

  • Interview users after user test

  • Task we designed
  • Upload a new clothes to the app

  • Search for keywords to get a set of outfit recommendation

  • Delete (discard) one clothes in the app and browse it in the Recycle Bin

  • Add a clothes item to your favorites

  • Create your own outfits based on a piece of clothes

  • Results (partial screenshot)
  • Suggestion & Comments
  • Sets the "Add Clothes" button to a fixed button in the interface.

  • After "Import" a new dress, users do not have to enter the details page, they can directly add it into the closet.

  • Collection functions and recycling functions could have a  "cancel" way. 

  • "Outfits Record" should allow users to have the choice to change suit (if ultimately choose another suit), and allow the same day with a different suit, can view the different suits.

  • The design needs to consider the size of the button range and human finger. 

  • Interesting Comments From Participants
User Testing

—— 3rd Iteration ——

Final Design: Revise after Usability Testing 

Reflection

For a UX designer, the capabilities of integration and synthesis are highly valuable. “Private Closet” project is my first full-featured service design during my junior year. The design aimed to liberate people from the consumerism trap, hoping that they would focus on assessing their self-consumption abilities, building aesthetics, and achieving rational consumption, instead of material consumption.

Initially, I started by tackling a trivial problem of how to dress every day. Through systematic research, questionnaire analysis, and user interviews in detailed and objective user information and behavior, I revealed the underlying logic of this phenomenon ranging from wondering how to dress to wondering what suited oneself. Consequently, I created a set of products by integrating an E-closet app and AR mirror. The concise interface and clear interaction logic were unanimously approved in users’ tests. Overall, this project showed me how to pinpoint detailed problems and specific demands and how to incorporate diverse personas for delivering ideal solutions.

bottom of page