Clarity Beauty
Clean Beauty Swift UI App
Role: UX Designer, Front-End Developer
Timeline: Spring 2025
Tools: Canva, Pintrest, XCode
Overview
Clarity Beauty is a SwiftUI mobile application designed to simplify the process of finding skincare products that align with users' skin concerns and sustainability values. With the growing number of beauty products on the market, identifying clean, environmentally friendly options can be overwhelming. The app was created to make product discovery more approachable by providing personalized recommendations based on individual skincare needs while encouraging more informed purchasing decisions.
The application guides users through a personalized onboarding experience, allowing them to select their skincare concerns before receiving tailored product recommendations. Additional features include nearby Sephora locations using MapKit and geolocation, external links to recommended products, and reminder notifications that encourage users to maintain consistent skincare routines. The project strengthened my skills in SwiftUI, user-centered design, mobile navigation, location services, and notifications while demonstrating how personalization can create a more engaging mobile experience.
Design Process
The project began with a collaborative brainstorming session where the class pitched potential SwiftUI app ideas and gathered feedback from peers. After evaluating different concepts, I decided to create a personalized skincare application that helps users discover clean beauty products based on their individual concerns. Clean beauty has been a personal interest of mine for several years, as I believe being mindful of the products we put in and on our bodies is just as important as caring for our skin. From that point forward, I independently designed and developed the app over the course of a month with the goal of creating a fully functional prototype that could eventually be published on the App Store.
Before beginning development, I researched existing skincare apps, mobile interfaces, and visual inspiration to better understand current design trends and establish the overall direction of the application. I created a Pinterest mood board before translating those ideas into hand-drawn sketches to map out the user flow, screen layouts, and navigation prior to moving into SwiftUI development. Although those original sketches were unfortunately lost, they played an important role in shaping the initial direction of the app.
Visual Identity
The visual identity of Clarity Beauty was intentionally designed to reflect the values of clean beauty. Green was chosen as the primary color throughout the application because it is commonly associated with wellness, sustainability, and nature while also conveying feelings of trust, calmness, and health. Since green is widely recognized as the universal color for "go," it reinforces the idea of making positive, informed skincare choices. To complement the green palette, soft tan accents were incorporated throughout the interface to create a warm, earthy aesthetic inspired by natural ingredients and minimalist skincare packaging. Together, these colors create a calming experience that feels clean, approachable, and trustworthy.
The imagery was intentionally selected to emphasize natural beauty and healthy, clear skin rather than heavily edited or unrealistic beauty standards. By showcasing fresh, authentic-looking skin, the visuals reinforce the app's mission of helping users make informed skincare choices through clean, trustworthy products. Together, the color palette and imagery create a welcoming aesthetic that aligns with the values of clean beauty while encouraging users to feel confident in their skincare journey.
Image Credits: Lifestyle imagery was sourced from Pinterest for design inspiration, while all product images and product information were sourced from the Sephora website to create realistic product recommendations.
Iterations
As development progressed, the design continued to evolve alongside my growing SwiftUI skills. Many screens and interactions were refined multiple times as I learned new techniques, solved technical challenges, and identified opportunities to improve the overall user experience. The iterative process allowed the final application to become both more polished and more functional than my original concept.
Iteration One
During the first iteration, I focused on building the core onboarding experience, completing the home screen, name input, and the beginning of the skin concerns section. While the interface itself was fairly straightforward, getting the functionality to work was much more challenging than I anticipated. Features such as carrying the user's name between screens, disabling the submit button until text had been entered, and creating a working multi-select experience for skin concerns required a great deal of trial and error. Overcoming these challenges not only moved the project forward but also helped me become much more comfortable working in SwiftUI.
Iteration Two
Within the second iteration, I continued refining the multi-select skin concerns feature before moving on to one of the app's core experiences: personalized product recommendations. Based on the user's selected concerns, the app displays skincare products tailored to their needs. Building this functionality proved to be one of the most time-consuming parts of the project, as I first had to research clean beauty products before manually entering each product's name, image, price, and purchase link into the application. While repetitive, this process helped ensure that the recommendations felt intentional and relevant rather than randomly generated, reinforcing the app's goal of making skincare discovery more personalized and approachable
Iteration #3/Final
Lastly, I focused on implementing two additional features: geolocating the nearest Sephora locations using MapKit and adding notifications to remind users to complete their morning and evening skincare routines. Integrating geolocation proved to be much more complex than I anticipated, requiring significantly more time to research and troubleshoot than the previous features. Because of this, I had less time to fully develop the notification system before the project deadline.
Conclusion
This was one of my favorite projects because it gave me the opportunity to combine the SwiftUI skills I was learning with a topic I was genuinely passionate about. Throughout the project, I enjoyed challenging myself with new concepts, solving technical problems, and designing an app that I would personally use. Watching the application grow from an idea into a functioning prototype made the learning process especially rewarding.
If I were to continue developing Clarity Beauty, I would expand several features to create a more complete user experience. I would build a dedicated skincare routine section where users could customize reminder times, track their daily routines, and manage notification preferences. I would also expand product recommendations beyond Sephora by incorporating products from a wider range of retailers, giving users more flexibility and choice.
Another feature I would like to implement is a skincare diary where users could upload progress photos, document changes in their skin over time, and track how consistent routines and clean beauty products have impacted their results. I would also add an educational section that explains common skincare ingredients, highlights ingredients to avoid, and recommends beneficial ingredients based on users' individual skin concerns, helping users make more informed decisions when purchasing skincare products.
Finally, I would conduct usability testing with my target audience to better understand how intuitive, useful, and engaging the current experience is. Receiving feedback from real users would help validate my design decisions, identify areas for improvement, and determine whether Clarity Beauty has the potential to grow beyond a class project into a larger, real-world application.