UX Designer
Real Pixel Copy 4.jpg

NYC-Color

 

NYC-Color

inspo mobile mockup .jpg

Brief

To design a platform which allow users to identify their skin shade and purchase makeup products online which are suited to their skin and shade type.  

Client

I worked within the Venture Capitalist, Prehype for this project they were backed by a leading beauty conglomerate; their client for this project was NYC-Color, a makeup brand.

My role

As part of a multidisciplinary team, I was the sole UX Designer responsible for the end to end UX process, utilising lean principles, conducting user research, designing, prototyping, testing and working with developers. In addition to leading and facilitating brainstorming sessions and workshops within a multi-disciplinary team during the early stages of product ideation. 

Analysis

The company took on a project to create a platform that allows a person to be colour matched to the best cosmetic products for their skin. Additionally, it would match people to content that is representative of this skin allowing them to create their ideal look. 


Overview

Through a signal mining exercise, the team discovered that minority groups are largely underserved in this market and there is the opportunity to validate the need to have a more diverse landscape within the beauty industry. 

creating inspo

I was briefed to create an MVP that allows people to be matched to the best cosmetic products for their skin in a brand agnostic manner and shows users content that is representative of their skin tone. 


With this in mind, I created a competitive/comparator analysis of sites that help the user to 'Get The Look'. I looked at the following sites: Maybelline, MOTIVES, Sleek, Charlotte Tilbury and Beauty Bay #BBDareTo Share. What I discovered was that although these sites showed 'Makeup Looks' for the user to re-create, it lacked the diversity of different people's skin types, skin shades.

 Competitive/Comparative Analysis of other beauty brands that re-create a look.

Competitive/Comparative Analysis of other beauty brands that re-create a look.

User Interviews

I conducted 15 user interviews, from people who use foundation, to recruit users I posted on beauty Facebook and MeetUp Groups and mailing lists. We focused on the product of foundation as this is a staple to many people’s makeup bag it is also essential to be colour matched correctly for a flawless look.

With the user interview script I wanted to explore the following items:

  • The buying behaviour of users in-store and online.

  • Viewing and purchasing from beauty content online.

  • The ideal process for foundation matching in-store or online.

The buying behaviour of users in-store and online

What we discovered was when users were looking to purchase a foundation, they would ask friends or family member who had a similar skin shade to them what foundation they used and they would go out and purchase it. Some users in-store would specifically look for a makeup artist who had the same skin shade as them. The reason for this is that those people are empathic to their experience of trying to matcha foundation to their skin tone. 

Viewing and purchasing from beauty content online

The majority of the users interviewed looked at beauty content through Instagram and YouTube frequently throughout the day. The reason for this is because they were able to see a look from beginning to end on someone with the same skin shade or skin type as them. Through user interviews, I discovered that viewing beauty content online validated a product for a user as it was social proof for whether a product was good quality and a suitable colour. 

The ideal process for foundation matching in-store or online

We discovered that the ideal process for users to be colour matched would involve assistance from a professional makeup artist and they would like to see the product on a range of people with different skin tones as this would prove that the foundation works for a range of people

 

Affinity mapping

I led an affinity map exercise with my team in which we wrote up the answers from the 15 user interviews and began to find the popular themes.

affinity mapping ux.jpeg

The themes from the Affinity Map were as follows: 

Recommendations from friends and family
Users relied on recommendations from friends (of a similar skin shade) as they felt they could empathise with their difficulty of finding the right foundation shade.

Beauty content
For recommendations on products and to recreate looks users go to YouTube and Instagram, but find it difficult to see representative content suitable for their individual attributes. There’s a lot of filtering users would like to do - but there is limited functionality that would allow users to do so. Some users know the right searches to find content for them - but most do not.

Underrepresented
POC (people of colour) felt underrepresented in the current beauty market. There is progress that is being made with some brands and products, however, good-quality products remain expensive. Common complaints included products left an “ashy” finish and  lack of colours within a foundation range.


persona

Based on the research from our user interviews I created a proto-personas, I used the persona of Esther for the Design Studio I ran with my team. 

User Persona ux.jpg

Design Studio

With the key findings from our user interviews as we began to focus on the problem which was "Users find it difficult to see beauty content on people of their skin shade and type."

I created the persona based on the users we had interviewed so that there was an understanding of the user base and prospective target market, I led and ran a design studio providing a scenario. 

Esther finds it difficult to see beauty content for her skin shade and feels that when makeup is recommended it is usually expensive. She wants to discover makeup for her skin tone and type that is affordable.

 Team sketches from the Design Studio

Team sketches from the Design Studio

Sketches

In the sketches, we provided the user with relevant and inspirational content, created by influencers/ beauty bloggers who were from diverse backgrounds. Filtering elements were created for the user to identify their skin shade and skin type (acne or non-acne), this is a feature that the competitors did not offer, YouTube and Instagram do not allow enough filtering.


We wanted to address the theme from the key findings in the research that beauty products for POC are expensive (with popular POC brands to be MAC, Fenty and Bobbi Brown), with that in mind, within the site we wanted to provide users with recommendations which were suitable for their skin shade and also economical with drugstore priced products. 

We decided to call this site inspo, a mobile site that recommends users beauty content and economical beauty recommendations based on their skin tone and type. 

 Sketches from Design Studio

Sketches from Design Studio

 

Creating the content

A database was created with a professional makeup artist and makeup influencer. The database was created to allow the site to automatically match users to the content. We had 5 skin shades, 2 skin concerns, 8 looks and 4 influencer options. The database had 123 makeup influencers with over 300 filtered videos. For each of the products used, competitive duper products were found.

320.png

Iterations

This site went through 5 iterations over a 1.5 week period at each iteration of testing we tested with a minimum of 7 people. To find people to test with we used an online community group and provided beauty products as incentives for users to participate. 

wireframe wip - Skin Shade.png

Iterations for the ‘Skin Tone’ page

The initial design contained photos of women with different skin shades, what we found through testing is that users struggled to identify their skin shade against the images, they felt that the images were very model-esque. As an alternative, we decided to limit the skin shades to 5, when we tested users flowed through this page easily. 

WIP - Product Page wireframe .png

Iterations of the Product Page

The issues that we had with this page was that users were unable to understand which that the products in the left column were used in the video and the products in the right column we're dupes (definition of a dupe). Through user testing, we settled on the final version to have one column with a gradient to so that it showed there was a clear distinction between the products. This received positive feedback through social media.


 DELIVERY

For this project, we worked with an external agency to build the site, with the handover of work I provided a sketch file and Invision prototype. Prior to the site launching, I fed back on amendments to the Dev Team.

 Feedback on inspo via Twitter.

Feedback on inspo via Twitter.

LAUNCH

For this site, there were a majority of click-throughs to cheaper products. Through this site, the prediction is that if we can show women content that they can relate to then the prediction is that we could sell products that would be relevant to them too.

icons x 3.png

WHAT IS IT PROVING

With the progress of this site the team were able to test and prove the following:

Content / E-Commerce: By making it easier to find representative content, can we generate a greater conversion rate on content - for makeup product

Drugstore Products: an our content platform push users to look at dupes and as reasonable alternatives.

Customer Engagement: Can our platform help increase customer engagement - and create a community around makeup and content?


CLICK TO VIEW THE PROTOTYPE

The scenario:
Esther has been sent a link to their website from a friend and decides to try it out.



Design Challenges

The turn around of this project was 4 weeks, the main challenge was time and the iterating of the final product page as frequently users were not able to distinguish the difference. I was able to organise prototype tests and iterate quickly which allowed me to arrive at the final design within the timeframe.