UI/UX
Breakout: A Social Media App for Skincare
Project Overview:
The Problem:
People are turning online for skincare advice, but too much information makes it hard to find real, relatable insight.
With an average 43-week wait time to see a dermatologist in the UK, individuals are turning to the internet for skincare advice. However, finding the right product for a user's unique skin type can be challenging, and sifting through countless forums to gather useful information is often time-consuming and overwhelming.
Painpoints:
Spending too much time on social media researching other people’s experiences with a product and trying to determine how to use it properly.
Not having a good place to keep track of skincare routines over the years. Not knowing what products work and dont work and common trends in ingredients.
Not having quick access to a dermatologist in the UK because of long wait times with an average of 43-weeks.
There are too many posts and opinions on social media about how to use a product. Which one would be right for me based on my previous routines?
The Solution:
A social platform for skincare enthusiasts, powered by AI that personalises product recommendations based on your skin type and experiences.
Breakout connects users with others who share similar skin types and concerns, enabling them to exchange product reviews, routines, and experiences. The app simplifies the search for skincare solutions by offering curated content, community discussions, and personalized recommendations—all in one place.
User Research:
User Persona:
Anna
20
University student
Cardiff, UK
Part-time barista
Frequent social media user
Anna is a university student that is making the best of her last year through trying to grow as a person through self-improvement. She struggles with acne and skincare has been a big part of her life over the last 10 years. In her free time, she frequently scrolls social media to find new information to base her opinions on, and find everything she needs. Apart from uni, she works in a small coffee shop where she has to be in front of customers all day long so she frequently cares about her appearance and how she is perceived by other people. Anna wants to spend less time on social media as she finds it wastes her time and effects her self esteem, but she doesn’t know where else to find information about products and people’s honest reviews.
Needs and Expectations:
Outcome:
Lo-Fi Wireframes
Mid-Fi Wireframes
Since this is a social media app for skincare enthusiasts, I wanted there to be a way to see what skin type and skin concerns other people experience when viewing a post to get extra context. There should also be a learning tab with a video feature where users can learn about different skincare ingredients and tips and tricks in an easily digestible manner. The Mid-fi wireframes allowed me to visualise how the user would go through the app and improve on the experience when going to the Hi-Fi wireframes.
Hi-Fi Wireframes
The symbols used to represent skin types were inspired by diagrams of skin layers and cells, giving them a scientific yet approachable look. I placed essential and frequently used buttons within the thumb zones for easy access, and ensured their shapes were user-friendly and touch-optimised. The bottom navigation bar includes both outlined and filled icons to clearly indicate the active screen at a glance. Additionally, the original story quiz feature was redesigned into a more engaging “Question of the Day” format.