Create a solution of a problem you are passionate about.
Tools:
Figma, Figjam, Procreate, the Classic Paper and Pencil ;)
problem statement
Trends often alienate people whose appearance does not fit the beauty standard.
When I look on social media, I often find myself searching for trendy clothes and beauty products. I've noticed that a lot of these trends center on people who fit the cultural beauty standard. Think of the trend of low-rise jeans in 2000s: it was to show off that toned stomach. This sparked a question: how could trendy fashion and beauty products be more accessible and inclusive to people who do not follow the beauty standard?
the solution
A fashion and beauty recommendation app using AI for a personalized user experience:
Meet Ufit!
Create a virtual avatar for a personalized shopping experience.
By scanning your body, we can accurately find the ideal clothes that fit your body shape, skin tone, and personal preferences!
A fashion and beauty feed curated just for U... and only U.
Clothes, beauty products, and even outfits!
The changing room made digital.
Whether using your avatar or a pre-made model, try any clothes you find on Ufit. If you think there's a Fit, add them to a Fit or Collection!
Before we start...
Let's take a quick look at my design process! For this project, I designed everything through a 5-step design process. Although I'm only showing the highlights, going through the process will give you the how and why of my final prototype.
"Why am I not as pretty?"
Ever since I was a child, that was the question that I asked myself whenever I watched a movie, read a magazine, or listened to song. I was a tan, chubby, Chinese girl: I was not what society deemed pretty. I was fortunate to have parents who cared about my parents, who bought me trendy clothes and makeup to help my confidence. Unfortunately, either nothing fit or matched my darker complexion, which tanked my self-confidence.
It was only until college where I found clothes and makeup that complimented my natural features. Conversely, once finding fashion and beauty products that suited me, I became more confident. Of course, this led me to the question: why did it take so long for me feel pretty?
Enjoy some a cool meme that accurately (?) depict the problem:
secondary research
Despite significant progress for inclusivity in the last decade, the beauty industry... isn't the most supportive of unconventional beauty.
In order to have some basis for my research, I started out sifting through papers and studies on topics of fashion, beauty, and its effects on society. Although the fashion and beauty industry have made strides since the 90s to be more inclusive, many people feel fashion and beauty trends still lack in inclusivity. Furthermore, the proliferation of social media has cemented an even higher unrealistic beauty standard perpetuated by fashion and beauty industry, and photo editing apps.
"67% of Americans agree social media has created impossible beauty standards."
Mintel Group, LTD
"Companies like Maybelline, Revlon... have promoted the idea that individuals of a certain demographic are the preferred standard of beauty... leaving several marginalized groups feeling unseen by brands."
cuny.edu
"By testing female alescents aged 13 to 18, we found that excessive social media use leads to unhealthy body esteem via intensified cognitive internalization...."
ncbi.nlm.nih.gov
"Although 32% of Gen Z think social media helps spread diverse beauty ideas, 31% also think [social media] influencers convey unrealistic beauty ideals."
Statista
Insights
Making fashion and beauty more inclusive...
As I researched about fashion and beauty inclusivity, I realized that the most effective ways to push inclusivity relies on the industry itself. Essentially, increasing accessibility and inclusivity is very hard on a microlevel. The most effective solution deals with racial representation and with the fashion brands themselves, which is realistic difficult to achieve on an individual level.
Confidence is the key.
Since many solutions for inclusivity seemed far fetched for an app, I decided to focus on changing the user's mentality. I hypothesized that a micro level solution for increasing user inclusivity in fashion and beauty is to increase the user's confidence in their physical beauty.
User Interviews
Interviewees expressed that fashion and beauty was a double-sword: it served as both a confidence booster and a form of insecurity.
Keeping in mind my insights I discovered from my secondary research, I conducted interviews with 7 women of color who expressed interest in fashion or beauty trends. From my user answers, I compiled everything in an affinity map. Then, from my affinity map, I created an empathy map and a persona to really hone on the user pain points.
Fashion + Beauty
Where are the most common places you purchase clothes or beauty products? What do you buy from there?
Influence
What are the biggest influences on your fashion and beauty styles?
Social Media Trends
How much do you think social media affect your purchasing decisions?
User Conflicts
Has there been any conflict obtaining and/or applying a fashion or beauty product?
Confidence
Describe to me about the time when you felt the best or most confident in what you looked like.
Perception of Beauty
What is your ideal standard of beauty?
Affinity Mapping
Personas + Empathy Map
Although my interviewees ranged from Millennials to Gen Z, I wanted to focus more on my Gen Z problems. My younger interviewees expressed higher feelings of insecurity, especially with the heightened usage of social media in general; I decided that I wanted to cater my app to a younger audience. To reflect my findings, my persona, Beverly, reflected the Gen Z users I interviewed: heavy into skincare, more adventurous, but also more self-conscious.
After creating Beverly, I tried to "put myself in her shoes" through empathy mapping. I thought up phrases based off what Beverly would say, do, think, and feel in regards to her appearance. By following Beverly's train of thought, I had a clearer picture of what problem I am trying to solve.
User Insights
When purchasing fashion and beauty products, many of my interviewees felt insecurity, inadequacy, and fear.
Although my interviewees expressed how looking good positively affected their mood, all interviewees expressed emotions of insecurity, inadequacy, or fear when purchasing products. These emotions were raised because of the user's fear that the product would not look good or even harm them.
Design + ideation
What is the "right" solution?
For almost a month, I had trouble with answering this question:
How might we encourage users to be feel more comfortable and confident in their physical appearance?
I initially played around with the idea of a social e-commerce app until I realized that the app would not directly target the negative emotions of fear, insecurity, and inadequacy that blocked a user from feeling confident in themselves and their shopping decision.
- add ideation, list view of ideation, add why I switched to recommendation app
User stories
Affirmation helps ease user's fears about shopping.
I took a step back, reevaluating my user interview and compiling user stories to find a MVP of the answer I was searching for: a fashion and beauty recommendation app. Specifically, the idea of an all-knowing fashion assistant would be worthwhile solution, addressing user's pain points by affirming the recommending products suit the user.
As a user, I want to see products being recommended to me that suit my physical features, so I can be self-assured in my appearance.
As a user, I want ways to discover fashion and beauty aesthetics and products, so I can expand my style
As a user, I want groups products under a specific theme, so I can dress to that specific theme.
As a user, I want to search for a specific fashion term, so I can quickly find my desired product.
An intelligent fashion assistant that guarantees every product suits each user’s unique features.
Red routes + user Flows
Finding the key features of my app
Based off my user stories and personas, I identified 3 major red routes:
The login feature where the user scans their body.
The user can find and track products from their recommendation feed.
The app assists the user in creating fashion and beauty looks that suit their preferences.
Iterations
From paper wireframes to working prototypes
My wireframes went through 4 main phases: sketches, paper wireframes, lo-fi wireframes, and than hi-fi prototypes. Each iteration underwent usability testing or review to sort out any potential issues.
Meet UFit: your personalized fashion & beauty guide.
Using an adaptive algorithm and user preferences, users will be able to find clothes and beauty products that will enhance their natural features!
Improvements
3 of the issues I solved during my prototyping process
Based off the feedback from my peers, mentors, and friends, I continuously iterated over my screens for over 2 months. From the start, I had a relatively intuitive user flow and layout, so many of my testers had no trouble completing the tasks. However, major issues were caused due to tinier things, such as misleading icons to confusing language.
How to effectively communicate daily recommendations.
Lasting for 4 different iterations, this was the biggest interface challenge for me: how to efficiently display an important notification in a non-intrusive way. Originally, I utilized a banner style, mimicking displays on a laptop, but I realized that it disrupted the experience of having an endless content feed. My solution was to have a small button in the upper right: noticeable but not disruptive to the user scrolling experience.
Addition of an app introduction.
Originally, my prototype started off with just the login/sign up page. However, during user testing, users got confused on what the app's purpose. This was especially problematic, considering that the app's experience was dependent on the user's personal information. Adding a small introduction before the official onboarding process set user expectations.
Reorganization of the closet.
Originally, the daily suggestions/outfits was supposed to be in the closet. However, during user testing people often did not register that daily recommendations were in this location. One user even questioned why daily recommendations would be in a closet if a closet is supposed to be a place “where you store the clothes you own”, not the clothes you want. As such, I stripped a lot of the original complexity to make the present closet more simple and user-friendly!
I'm finally done! Super fun to look back on my progress (5 months!) and even more fun to be wrapping up. I want to say thank you to whoever I interviewed and tested with. Special thanks to my mentor and Jackie, who served as a model for the AR prototype! Overall, although developing and drafting a new concept of an app was extremally mentally taxing, it has also been one of the most enriching experiences I have underwent. Here are some of my concluding thoughts:
The answer always lies in the user. Hinging on my previous point, I would always get stuck in my head about questions such as "would this work?" or "does this make sense?" The correct question to ask, however, is "would the user need this?" Once I asked myself that question, I found myself eliminating a lot of the unnecessary features to focus more on what the user would need.
"Don't rush. Every journey has its final day." I often found myself worrying about how long I was spending on this project, especially I often had the tendency to delay parts of my app. However, near the end of the capstone, I realized it was healthier to prioritize my mental health (and sanity) by purposefully taking a break from working on the capstone to prevent burnout. Ultimately, even though I finished later than I wanted to, I ended up with a product that I can say I'm proud of.
Plan for WCAG! When starting my prototypes, I underestimated how important yet restrictive the WCAG standards could be. For an app about accessibility, my first hi-fidelity iterations did not pass WCAG standards. Many of my UI components had to be adjusted in order to comply to WCAG standards. Next time, I want to initially test out more font and color combinations in order to find a UI combination I'm satisfied with and that complies the standards!
Let's Get in Touch! I won't bite :)
Send me anything! Dog pics, puns, anything!
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
.gif)
.jpg)
