Glow is a startup that wants to help people find the right skincare products and routine that works for them. They understand that skincare can be overwhelming and confusing - with thousands of different products, reviews, and articles. However, skincare is very personal, as everyone's needs are different, so finding the right products is very important. By developing an app, they hope to provide all of the information that someone may need about different products and be everyone's personal skincare assistant throughout their journey.
Create an app that helps users better understand skincare and learn about what products and ingredients will work best for them.
UX/UI Designer, UX Researcher, Branding
Figma
April 2021 (two weeks)
Glow
There is a lot to know about skincare, and some of the topics I decided to research that would give me a better understanding were:
I looked up some skincare apps that are currently helping people manage their skincare routines. I also decided to include Sephora and YouTube because many people mentioned that this is what they use to learn about new products.
I focused the questions around people's experience with skincare, from buying and learning about products, to establishing the routines that work well for them.
You can view the questions that I asked hereThe questions were able to reveal the relationship people have with skincare, any pain points that they were having, as well as what they value the most about certain products and brands. Below are a few of the comments that people made that helped provide valuable insights:
I synthesized my findings with an empathy map to narrow down on anything that came up frequently. From the user interviews, a lot of people seemed confused about skincare ingredients and the overwhelming amount of product options.
Some insights that helped lead the direction of the project were:
The insights that were gathered helped define the goals and needs of our target user, Brianna. She is new to skincare, and finds the amount of products and ingredients to be extremely overwhelming. The most confusing part is learning about different ingredients, what they do for her skin, and how to incorporate them into her routine. Her goals that I decided to focus on the most were:
"People need a way to understand what ingredients are being used in their products in order to benefit the most from their skincare routine."
I decided to do this to consolidate all of the research information that I had and think on a big picture what I'm trying to accomplish and what the benefits are.
The app should act like everyone's "personal skincare expert", that's available to them wherever and whenever
As seen by Brianna's user goals above, a lot of it focused on being able to find the right products and ingredients that would work best for her, as well as learn about it in a way that wasn't confusing. This aligned perfectly with Glow's business goals, as they wanted to reduce the confusion that comes along with skincare.
A full list of features was drafted and prioritized based on user research and our project goals. I wanted to focus on the learning aspect of products and ingredients., which aligned perfectly with the goals of our business and user. I focused on designing the P1 & P2 features.
I focused on Brianna's journey as someone who is new to skincare, and wants to learn more about different products. Initially, I expect her excitement to be very high, but will start to dip as she realizes the overwhelming amount of products and information out there. This related back to the main pain points that my interviewees struggle with. However, as she starts to look at reviews and compare products, she'll start to feel reassured again, and hopefully her emotions will be positive as she starts to incorporate the product into her routine and begins to see results.
I decided on three navigation items that would help users perform their tasks. It helped to work on this app map alongside the user flow, so that I could see the pages that would be necessary to help users navigate through the task.
The task that I focused on was users being able to learn more about skincare products and ingredients, and whether or not they were compatible with their current routine. There were a few considerations that I had to help me map out this flow, such as:
I began by sketching out some ideas on paper. One thing I considered was if the products should be listed out on the homepage, or if someone should click into them and be brought to a different page to view the products. I decided that it would be better to click into it and be brought to another page, especially because at this point they were entering their products to check compatibility rather than tracking if they were following the routine throughout the day. If the routine was showed immediately on the homepage, it may seem like the main feature of the app, and I didn't want this to take away from the other product analysis features.
As seen in my sketches, I was initially going to have four navigation items, with a "learn" section where people could find out more about products and ingredients. However, I felt that a lot of this could be shown on the homepage to show some of the main features that my app was offering, so I decided to get rid of this since it would become repetitive. As you can see with my wireframes, the homepage has a lot more information than my initial sketches, since I decided to move this information over:
I put together this moodboard to start thinking about how I wanted my brand to be portrayed. Some keywords that were helpful in finding these images were clean, fresh, minimal, caring and inviting.
There were a lot of ideas that were inspired by my moodboard, however, I decided to go with the first option below, as I felt that it suited my brand the most with it's youthfulness and simplicity.
I started creating a reference sheet as I was putting together my brand to help with consistency.
One of the biggest challenges I faced initially was how to work with these light, pastel colours. It was hard to make them stand out from one another, especially within such a small screen size. In the end, I decided to make it work with this background gradient, where I was able to subtly mix the brand colours together. I thought that this was a good use of the colours, it matched the logo, and also added the "glow" effect.
Another challenge was figuring out how to show that a person's skincare routine was compatible. I spent some time sketching out different ideas, but I was afraid that a lot of them would be confused with showing progress, like adding another step into your skincare routine, rather than the compatibility of the current products.
Overall UI Designs:
I first asked users to open up their morning routine and see which product was showing as incompatible. I wanted to test if they knew how to replace the current product with a new one, and if they understood how the compatibility was being shown to them.
Before deciding, users were asked to compare two products. I asked them to choose the one that has the least number of concerns and add it to their routine, to see if they understood the information that was given. It also tested if they knew how to add it to their routine.
I told the users they were shopping in stores and had the physical product with them. I let them know that there was a quicker way to look up a product besides searching for it, and wanted to see if they knew what I meant.
The test was conducted remotely over Zoom with four participants. I watched them complete the given tasks on the high-fidelity designs, with the tests ranging from 10-20 minutes. All participants were able to successfully complete the tasks. I asked people to rate how easy they found each scenario, and there was no score that was rated less than 3/5, which was the minimum that I was expecting in my strategy blueprint.
Below are the average scores of how easy the four participants found each scenario:
Through my usability testing, there were a lot of suggestions that were given, but I decided to split them up into what was suggested for the current features, and what people suggested as features that could come later. I also noted a few challenges that people faced that made them hesitate in their tasks.
Deciding what to iterate on this one was a bit challenging since there weren't any major concerns that came up. I decided to address the following minor changes:
If you're interested, you can view the final prototype below:
When I was synthesizing my research, I realized that there were a few different features that I could build for this app. The main ones that I would want to focus on building next are:
I think the most challenging part of this project was figuring out the right amount of information to give people. A lot of secondary research was necessary in order to learn more about products and different ingredients, which I found that I was doing throughout the project and not just at the beginning. In the end, I think that I succeeded in finding that balance, as some of my user interviewees said:
Going back to one of the opportunities highlighted in my journey map, I think I was able to "simplify skincare", and made it easy for people to replace the products in their current routine. Everyone was able to complete the usability tests, and there were no major roadblocks along the way. I believe this was successful as there were many considerations that I made along the way, and prioritized the features and screens that were necessary for users to complete the given tasks.