I was the lead designer for Clarity, a startup focused on simplifying skincare shopping both in person and online. Clarity was created at Lavalab, a student run incubator at USC that helps forms startups from teams of designers, engineers and product managers. In a few short weeks, my team created a working demo which we pitched to an industry audience and panel of judges.
After talking with over 50 people, my team noticed how many struggled with skincare shopping. Unlike other product categories, skincare shopping requires time dedicated to trial and error, without any transparency or guarantee beforehand. And ultimately, this means poorer skin health for the user.
A quick browse through TikTok, Instagram or any shopping site quickly shows the difficulty of finding effective skincare. It can be hard to sort through the noise and find products/routines that specifically work for individuals skin types.
Our solutions focused on solving the two biggest pain points: time and lack of knowledge. To save time, we included a search by camera roll feature, where users could upload a picture or screenshot of individual products they're interested in. We imagine users using this in-store or while scrolling through TikTok.
After uploading a picture, users will get a specific percentage match with detailed ingredient analysis, which helps increase transparency and save even more time and money. Clarity makes it easy to then add that product to a step by step routine.
The first step for users is taking a short onboarding quiz. After consulting a professional dermatologist, we landed on 10-12 questions that help us personalize the products we show to users.
After onboarding, Clarity enables users to start searching for products via their camera roll. While there is an option for a more traditional search bar, using photos to find products is more practical in-store and online. We imagine users could snap a photo off the shelves or even upload a screenshot from a social media post.
Uploading a picture leads to a product match page, where users can immediately see the percentage match based on their skin type and needs. We included further information such as the match calculation, active ingredients, shopping links and more.
To help users actually integrate the product into their routine, we included a step-by-step guide on the home page.
The first stage consisted of several rounds of user interviews, specifically inquiring about personal experiences with skincare, shopping habits and general healthcare needs. While we started out with a wide demographic of people, we narrowed it down to Gen-Z users, since they tended to have the strongest experiences with skincare both in-person and on social media.
I moved on to creating user flows for all the features and mapping out how they would interact with each other. At this stage, I brought in my developers so that they understood the skeleton of the app, uncovering challenges early on such as finding the right techstack and structuring information architecture.
For the onboarding and match page, I prioritized information hierarchy through strong font choices and scale. For the match page in particular, I paid special attention to the page organization, since it could easily become overwhelming.
While the initial idea of taking a live photo and instantly getting a match was appealing, we encountered a development challenge early on. Halfway through the building process, it became challenging to find a suitable API that worked smoothly with Apple camera access. We decided to pivot as a team to a simpler image upload process. As the designer, I had to adapt quickly and create a simple UI for photo upload.
One piece of visual feedback I received from other designers was to try to make the UI more friendly. To achieve this, I added some circular background shapes, rounded iconography and a brighter color palette.
As part of the visual identity of the product, I created a design system to document things like color, font, and other assets. Since we had to move fast, I made sure to include documentation when it was appropriate in order to help my developers understand styling in the building process.
In terms of visual identity, I wanted the branding to reflect a few core ideas: trustworthiness, friendliness, and accessibility. I conducted a visual audit and created a moodboard of current brands that captured at least one or two of these ideas.
I couldn't have built Clarity without the help of my amazing team. Best co-founders ever!