Beauty Shines
Wellness App| Skincare App| iOS App| UX & UI Design| UXR
Project Brief
The aim of this project is to design a hi-fi mobile App that addresses people’s wellness issues.
The app should include a user profile that reflects the user’s goals and how they plan to achieve them, as well as personal data. The design should also incorporate feedback from the system
Beauty Shines is an iOS app that helps people achieve healthy skin. It lets them track their skin health, monitor the products they use, stay hydrated, and access expert consultation.
This project is part of the Ironhack UX|UI Design Bootcamp program and was designed for the iPhone in a standard format with responsiveness. The design team consisted of two students who created the app for learning purposes, and the project duration was ten days. To make sure we approached it in the most efficient way possible. We implemented a combination of two highly effective methodologies: The design Thinking Process and Agile.
Discovery
Understanding the market and the possible future users
The Digital Fitness & Well-Being Apps market is a rapidly growing industry that is expected to generate revenue of US$23.55bn in 2022. While fitness, meditation, and nutrition apps dominate the market, we recognized an opportunity to explore a different area within the health and wellness sector.
Upon researching, we found that there is a lack of comprehensive skincare apps available to consumers. Although the Skin Care segment is a significant part of the market, amounting to US$31.08bn in 2022, most products in this category only focus on basic care and protection. This led us to investigate the market for the special treatment segment and we discovered that the Europe acne treatment market was valued at $928.7 million in 2021, with an expected increase to $1,297.0 million in 2028.
We saw an opportunity to address this gap in the market by developing a skincare app that offers users a variety of options to address their specific skin problems. Our app provides access to treatments, medications, creams, ointments, and lifestyle changes to improve overall skin health. With the skincare market projected to continue its upward trend, we believe that our app has the potential to make a significant impact on users' lives.
User Researcher
We developed a UX Strategy Blueprint and Lean UX Canvas to guide the design decisions for our skincare app. This ensured a consistent and practical user experience to frame the problem and help potential future users regarding their skin concerns. We used it to survey and interview potential users.
We created a user survey based on our UX strategy, Lean UX Canvas, and secondary research.
We received 56 responses, showing that users consider skin health crucial but need more effort to solve their problems. Half of the respondents faced issues like acne, allergies, sensitive skin, or aging.
The next step in order to have a better understanding from potential users.
User Persona
Understanding who our users are and gathering their insights
To empathize with our product's end-users, we created a User Persona named Bella based on our research data. She represents the users' goals and pain points.
Goals
Get rid of skin problems.
Keep track of her daily routine practices.
Chose the right products for her skin.
Having healthy and glowing skin.
Frustrations
Lose confidence when having bad skin.
Overwhelmed with information on the internet and from others’ recommendations.
Feeling anxiety when trying to choose the right product for her skin.
The current skincare process does not work out and it is hard to follow up skin conditions systematically.
User Journey
What is causing Bella's frustration?
Analyzing her user journey provides insights into her actions and emotions, enabling us to brainstorm ideas for developing the application that will assist her.
Ideate
Our team utilized the MoSCoW method to prioritize and communicate the significance of the requirements for the solution. By combining it with the Must-Have requirements from the stakeholder, we generated solutions to solve the puzzle.
Let’s get visual
We began designing our solution with the "must-have" features as our foundation. To create the app, we mapped out the user's flow to depict the interaction between the user and the product. These features include:
Allowing Bella to set up her profile with relevant information about her skin condition.
Allowing Bella to set and track goals, including monitoring her water intake for healthy skin.
Enabling Bella to edit, share, or delete her personal data, including skin scanner pictures for expert analysis.
Ensuring that Bella is informed about the usage of her personal data.
Providing feedback to Bella through the system, including empty states and error messages.
To ensure a positive user experience, we created a user flow path depicting how Bella sets up her goals, inputs her diary, and contacts a skin expert for assistance.
MVP
Creating a product that truly meets the needs of users can be a daunting task. How can we ensure that we are providing the features that matter most? How can we avoid investing time and resources into developing unnecessary components that may not be valued by the target audience?
One powerful technique for addressing these questions is the development of a Minimum Viable Product (MVP). An MVP is a product that offers just enough functionality to address the core needs of users. This approach enables a team to validate their solution and gather feedback from users before investing heavily in the development of additional features.
Testing and refining concepts
We created low-fi wireframes of the ideas and conducted concept testing with users. Based on their feedback, we made changes to the "water setting" feature, which helps users achieve their hydration goals for healthy skin and body. We also revised some name tags to make them more easily understandable for users.
Then we built Mid-Fi wireframes and prototyped to conduct usability tests. Five users gave feedback on icons and hydration goals. Users liked the water measurement and skin scanner data with the diary function to track skin. All comments were carefully considered, based on objective views and user data we had collected since the beginning of the project.
Visual Competitors Analysis and UI
As a team, we understand the importance of analysing visual competitors in the industry. By researching and analyzing their visual design and branding elements, we can improve the product's visual design and create a unique and memorable user experience.
To identify our visual competitors, we researched similar products and took note of their visual design elements, such as color schemes, typography, layout, and imagery. We also analyzed their branding, including logos, taglines, and messaging, to understand how they position themselves in the market.
After identifying our visual competitors, we compared their designs, then we could find areas where we can innovate, or differentiate them from our design.
In our analysis, we inspected one skincare website and two mobile app products. We noted their use of bright colors and sans-serif typeface, which created a friendly and happy vibe in their UI design. By learning from our visual competitors, we aim to create our product's visual design and make it a unique and memorable user experience for our users.
The next step we named the App as Beauty Shines, an app that helps users detect and track their skin problems to improve their beauty, confidence, and happiness. Our brand attributes were caring, friendly, simple, and organized. We used mood boards to inspire the aesthetic aspect and ensure consistency in design. Based on positive feedback from testing, we generated the product style tile, which includes icons, colors, and fonts.
Prototype
Take Aways
This project is a great experience in both UX and UI for me. The design process was hard due to time constraints, we had to complete the research in a very short time. The solution testing was conducted with a small group of target users. Consequently, desirability testing is a must in the next steps of the process.