A thesis project that became a full product vision
Developed for my university thesis project, VITA showcases my expertise in UX/UI design and technological product development. It features a smart ring and companion app. This case study focuses on the mobile app’s creation, where I acquired new skills in Figma prototyping and designing brand-new design systems. The outcome includes a functional Figma prototype with all necessary user flows for the app’s initial launch, complemented by an AI chatbot companion.
Problem
VITA addresses the need for continuous and accessible monitoring for young adults with chronic conditions. Current health solutions often treat individuals as data points rather than whole beings — leading to fragmented care and a lack of personalized health insights.
Solution
VITA combines a smart ring with a mobile application to offer real-time health monitoring and personalized recommendations — fostering an integral, human-centered approach to both physical and mental well-being.
Five stages from research to final design
Listening to the people who would use it most
To ground the product in real user needs and medical reasoning, I conducted interviews with two key groups: health professionals and potential users.
Health Professionals
Common challenges included difficulty finding appropriate treatments and the need to monitor specific parameters over time. Addressing the right treatment for each patient often involves experimental approaches — a gap VITA is designed to close.
Potential Users
A common theme was the frustration of not knowing the cause of symptoms, or deciphering medical results. Users pointed out that current wearable solutions are often out of their price range and emphasize data over wellbeing.
Mapping structure before designing screens
Following thorough UX research, the next step involved creating a proposed site map to define app functionality, layout, and user flows. Utilizing post-it notes facilitated quick modifications during the process. The final site map evolved significantly from its initial version due to extensive user testing with low-fidelity wireframes. Valuable user feedback guided adjustments, resulting in the refinement of existing functionalities and the relocation of others, ultimately shaping the final design.
Version 1 — initial post-it sitemap
Version 2 — refined after wireframe testing
Final version — structure that shaped the UI
Building a design system from scratch for the first time
This project marked the first time I developed a Design System from scratch. I decided to follow the atomic design methodology, beginning by establishing the colors and typography, moving onto simple components like buttons, more complex ones like calendars, and finally creating screens. I chose blue as the primary color to evoke a sense of healthcare and tranquility.
The components were made based on Material Design principles, aiming to have a visual identity that felt friendly and modern while adhering to accessibility and aesthetic design principles.
UI Design System built from scratch using atomic design methodology
Testing revealed the complexity hiding in plain sight
After creating the design system, I developed the screens necessary to complete the main user flows, focusing on logging symptoms and medications. High-fidelity prototyping was used to provide an immersive experience for users during testing.
A round of usability testing provided valuable feedback. The primary design challenge was simplifying the flows, as the original prototype had multiple paths leading to the same outcome, causing confusion. The goal was to streamline all user flows into the app’s principal features.
Before and after: simplifying flows based on user testing feedback
A health companion that centralizes daily care
VITA aims to transform the way young people with chronic conditions approach their health. The app seeks to centralize the most relevant actions and information for their daily care, such as logging daily symptoms, medical studies, and medicines taken. The app also provides a place for the user to store their medical data history, which, in combination with the daily logs and VITAi, provides personalized insights to users.
A complete product vision in 10 weeks
- Delivered a fully functional high-fidelity Figma prototype covering all primary user flows for the app’s initial launch — from onboarding to daily health logging.
- Built a complete design system from scratch using atomic design methodology, establishing reusable components across all app screens.
- Conducted two rounds of usability testing that directly shaped the final information architecture — simplifying multi-path flows into streamlined, single-purpose journeys.
- Designed a product that bridges physical and mental health monitoring, integrating AI companion support through VITAi alongside real-time data from the VITA Ring hardware.
This project was my first time designing a system end-to-end: research, information architecture, design system, prototyping, and testing — all on my own. It taught me that a great visual design means nothing if the underlying structure is confusing. Getting the flows right before touching the pixels is always the real work.