YOGI Interactive Facial Massage App

Project Type
Final Year Project
Mobile App Prototyping
Duration
12 Weeks (March-May 2024)
My Role
Project Lead UI/UX Designer
Software Tools
Figma, Adobe Illustrator & Photoshop
Overview
In collaboration with P&G and NYP - we developed a interactive face massage app that encourages consistent & correct usage of products & techniques, helping Junior Office Ladies achieve physical & mental benefits.
Problem
Many junior office ladies struggle to maintain a consistent skincare routine, often unsure about the correct dosage of skincare products to use and lack knowledge of proper facial massage techniques.
User Personas
We developed two user personas and empathy maps for our target audience, who were Junior Office Ladies and existing customers & mature adults in the Chinese market.

.png)

.png)
User Journey & Ecosystem Map
We created a user journey map to visualize the path users take to access the YOGI App. After getting to know our users better, we crafted out an EcoSystem Map that brought together who and how our users would interact with when they are getting to know more about skincare and facial massages.

%201.png)
User Flow
We created a user flow to visualise the flow of the YOGI app flow when users start using the app, according to our client's requirements.

Wireframes
We developed initial wireframes for our YOGI facial massage app. There were many parts of our app that we broke it up into several parts.

Branding & Stylescape
I extensively explored various colour themes and vibes to align with the keywords provided by our clients: elegant, calm, refreshing and light. We developed a style guide.


Floral Concept
Given the resemblance of our UI toolkit colours to those in nature, specifically flowers, we have chosen to shift our theme to a floral-inspired design, focusing on tulips, roses, gardenias and lotus. These flowers carry themes of beauty, purity and transformation, making them powerful symbols for aspects of life such as personal growth and love.

User Testing
In total, we conducted user testing with five office ladies to identify areas for improvement in our app and enhance user experience. Overall, their feedback was positive when they tried our app.




Final Prototype
We were finally able to complete the final prototype on Figma. It is split into different sections and features of the app.








