END-TO-END MOBILE APP
END-TO-END MOBILE APP
Vitalize
Vitalize
Overview
Overview
A calming health tracking app designed for users with dysautonomia and heart/blood pressure regulation issues.
A calming health tracking app designed for users with dysautonomia
and heart/blood pressure regulation issues.
A calming health tracking app designed
for users with dysautonomia and heart/blood
pressure regulation issues.
Role
Role
UI/UX Designer
UI/UX Designer
Timeframe
Timeframe
5 weeks
5 weeks
Tools
Tools
Figma
Illustrator
Google Forms
Figma
Illustrator
Google Forms
Problem Statement
Problem Statement
People with heart and blood pressure conditions lack a simple, long-term way to track habits and symptoms that concisely surface meaningful insights.
A calming health tracking app designed for users with dysautonomia
and heart/blood pressure regulation issues.
A calming health tracking app designed for users with dysautonomia and heart/blood pressure regulation issues.
Competitor Research
Competitor Research
The market currently lacks a health and habit tracking tool that is equally data-driven and human-centered.
The market currently lacks a health and habit tracking tool that is equally data-driven and human-centered.
The market currently lacks a health and habit tracking tool that is equally data-driven and human-centered.
I began my research by searching for competitors that were vital tracking apps and daily habit/emotion tracking apps. I landed on two highly rated competitors in each category: Visible & How We Feel.
I began my research by searching for competitors that were vital tracking apps and daily habit/emotion tracking apps. I landed on two highly rated competitors in each category: Visible & How We Feel.
Visible
Visible
Visible
A tracking app that pairs with a wearable heart-rate monitor, offering people personalized pacing and health insights.
A tracking app that pairs with a wearable heart-rate monitor, offering people personalized pacing and health insights.
Target Audience
Adults with chronic illnesses & conditions
Users who want detailed tracking & insights
People motivated by data
Target Audience
Adults with chronic illnesses & conditions
Users who want detailed tracking & insights
People motivated by data
Initial Insights
Detailed symptoms
Data-driven
Long-term management
Complex UX
Initial Insights
Detailed symptoms
Data-driven
Long-term management
Complex UX
How We Feel
How We Feel
An emotional wellbeing app that lets users check in and track their feelings, sleep, exercise, and health patterns over time.
An emotional wellbeing app that lets users check in and track their feelings, sleep, exercise, and health patterns over time.
Target Audience
Adults looking to track mental wellbeing / emotions
Users who prefer simple, low-effort check-ins
People motivated by reflection
Target Audience
Adults looking to track mental wellbeing / emotions
Users who prefer simple, low-effort check-ins
People motivated by reflection
Initial Insights
Emotion-focused, daily
Simple UX, visually fun
Emphasizes reflection
Limited tracking
Initial Insights
Emotion-focused, daily
Simple UX, visually fun
Emphasizes reflection
Limited tracking
SWOT Analysis
SWOT Analysis
My insights and findings were summarized into a SWOT Analysis, where I discovered their shared strength of bringing in daily active users, but opposite pain points of having too much or not enough data to concisely highlight health trends.
My insights and findings were summarized into a SWOT Analysis, where I discovered their shared strength of bringing in daily active users, but opposite pain points of having too much or not enough data to concisely highlight health trends.
App
App
Visible
Visible
How We Feel
How We Feel
Strengths
Strengths
Simple way to track symptoms & vitals
Shows trends over time
Simple way to track symptoms & vitals
Shows trends over time
Quick daily check-ins with low effort
Strong emotional focus and accessibility
Quick daily check-ins with low effort
Strong emotional focus and accessibility
Weaknesses
Weaknesses
Data organization can feel cluttered
Requires constant inputs for certain metric
Data organization can feel cluttered
Requires constant inputs for certain metric
Limited personalization and insights
Less useful for physical health tracking
Limited personalization and insights
Less useful for physical health tracking
Opportunities
Opportunities
Opportun-ities
Expanding info / education for new users
Condition-specific trends & tools
Expanding info / education for new users
Condition-specific trends & tools
Users wanting deeper analytics may leave
Mood tracking features in larger apps
Users wanting deeper analytics may leave
Mood tracking features in larger apps
Threats
Threats
User drop-off due to complexity
Wellness apps adding similar features
User drop-off due to complexity
Wellness apps adding similar features
Users wanting deeper analytics may leave
Mood tracking features in larger apps
Users wanting deeper analytics may leave
Mood tracking features in larger apps
Key Insight
Key Insight
Despite contrasting approaches, with Visible being more complex & data focused and How We Feel being overly simplified and human-centered, both apps share the same core UX challenge of designing for long-term user retention.
Despite contrasting approaches, with Visible being more complex & data focused and How We Feel being overly simplified and human-centered, both apps share the same core UX challenge of designing for long-term user retention.
Problem Statement
Problem Statement
From this research I derived a problem statement to guide the next phase of my project:
From this research I derived a problem statement to guide the next phase of my project:
People with heart and blood pressure conditions lack a simple, long-term way to track habits and symptoms that concisely surface meaningful insights.
People with heart and blood pressure conditions lack a simple, long-term way to track habits and symptoms that concisely surface meaningful insights.
User Research
User Research
Potential users are interested in logging symptoms, witnessing trends, and building check-in routines.
Potential users are interested in logging symptoms, witnessing trends, and building check-in routines.
Potential users are interested in logging symptoms, witnessing trends, and building check-in routines.
I surveyed a total of 9 people to gather information on what motivates them to take care of their health, their personal health history, and what they’d be interested in seeing in a health tracking app.
I surveyed a total of 9 people to gather information on what motivates them to take care of their health, their personal health history, and what they’d be interested in seeing in a health tracking app.
M & F, 18-34 years old
M & F, 18-34 years old
User Interviews
User Interviews
Surveyors were given the option to participate in a 5-10 minute interview at the end of the research survey. In these interviews, they were asked about their preferences in more detail.
Surveyors were given the option to participate in a 5-10 minute interview at the end of the research survey. In these interviews, they were asked about their preferences in more detail.
“I want an app where I can quickly pick the symptoms that matter most to me and check them off each day in seconds so I can actually stick with it and not get overwhelmed.”
“I want an app where I can quickly pick the symptoms that matter most to me and check them off each day in seconds so I can actually stick with it and not get overwhelmed.”
“I want something that helps me log my symptoms easily and actually see trends since it’s hard to tell what’s causing my energy to drop so much lately.”
“I want something that helps me log my symptoms easily and actually see trends since it’s hard to tell what’s causing my energy to drop so much lately.”
“Apps like Apple Health show me a ton of data, which is nice, but I can’t really connect those numbers to how I actually feel day to day and figure out habits of mine I could change."
“Apps like Apple Health show me a ton of data, which is nice, but I can’t really connect those numbers to how I actually feel day to day and figure out habits of mine I could change."
Key Insights I gained from user testing:
Key Insights I gained from user testing:
Simplicity Drives Consistency
Simplicity Drives Consistency
Users want symptom tracking to be fast and customizable so it fits easily into their daily routine. If logging feels quick and focused on what matters to them, they are more likely to stick with the habit long term.
Users want symptom tracking to be fast and customizable so it fits easily into their daily routine. If logging feels quick and focused on what matters to them, they are more likely to stick with the habit long term.
Trends Bring Information Together
Trends Bring Information Together
Recording symptoms is not always enough. Users want the app to point out trends and connections that help explain changes in energy, well-being, or overall health.
Recording symptoms is not always enough. Users want the app to point out trends and connections that help explain changes in energy, well-being, or overall health.
Numbers Don’t Reflect Feelings
Numbers Don’t Reflect Feelings
Users like seeing their health metrics, but raw data found on usual health charts feels disconnected from their experience. The app’s visual design uses clear, human-centered cues to make numbers easier to understand.
Users like seeing their health metrics, but raw data found on usual health charts feels disconnected from their experience. The app’s visual design uses clear, human-centered cues to make numbers easier to understand.
User Personas
User Personas
The target user is a conscious patient who is motivated to log her symptoms and track daily habits.
The target user is a conscious patient who is motivated to log her symptoms and track daily habits.
Two personas were designed to target the main health app pain points that concluded from testing
Users struggle to keep an organized and routine database of their symptoms and vitals.
Users struggle to connect symptoms to habits, holding them back from understanding patterns.
Two personas were designed to target the main health app pain points that concluded from testing
Users struggle to keep an organized and routine database of their symptoms and vitals.
Users struggle to connect symptoms to habits, holding them back from understanding patterns.
Sophie Fitzpatrick: “Proactive Patient”
Sophie Fitzpatrick: “Proactive Patient”
Sophie Fitzpatrick: “Proactive Patient”
33 years old, She/Her
33 years old, She/Her
User Statement
“As someone with POTS, I want an app that helps me track my triggers like hydration, rest, and activity, so I can better manage my symptoms and predict flare-ups, especially during the summer heat.”
User Statement
“As someone with POTS, I want an app that helps me track my triggers like hydration, rest, and activity, so I can better manage my symptoms and predict flare-ups, especially during the summer heat.”
Pain Points
Struggles to commit to one app long-term
Seeks a place to see her symptoms and daily emotions/experiences organized in one spot.
Pain Points
Struggles to commit to one app long-term
Seeks a place to see her symptoms and daily emotions/experiences organized in one spot.
End Goal
Regularly complete check-ins inside the app.
End Goal
Regularly complete check-ins inside the app.
Kate Rivera: “Pattern Seeker”
Kate Rivera: “Pattern Seeker”
23 years old, She/Her
23 years old, She/Her
User Statement
“As a recent grad adjusting to a new office job, I want a simple way to log my sleep, screen time, activity level and symptoms once a day, so I can better understand my low energy levels and have clear information to share with my doctor.”
User Statement
“As a recent grad adjusting to a new office job, I want a simple way to log my sleep, screen time, activity level and symptoms once a day, so I can better understand my low energy levels and have clear information to share with my doctor.”
Pain Points
Struggles to correlate symptoms to personal habits.
Feels overwhelmed by apps with too much data.
Pain Points
Struggles to correlate symptoms to personal habits.
Feels overwhelmed by apps with too much data.
End Goal
Explore trends that highlight her health habits
End Goal
Explore trends that highlight her health habits
Ideation
Ideation
Brainstormed ideas by sketching how to integrate a clear connection between check-in, habits, and trends into user's health tracking experience.
Brainstormed ideas by sketching how to integrate a clear connection between check-in, habits, and trends into user's health tracking experience.
Brainstormed ideas by sketching how to integrate a clear connection between check-in, habits, and trends into user's health tracking experience.
Onboarding & Homepage sketches ↴
Check-in sketches ↴
*There was a challenge in designing the check-in exp to be tailored to the user's personal symptoms and habits without overloading them with unnecessary questions and ratings.
Information Architecture
Information Architecture
Prioritized a positive understanding of the trends that come out of a user checking in their symptoms and habits daily.
Prioritized a positive understanding of the trends that come out of a user checking in their symptoms and habits daily.
Prioritized a positive understanding of the trends that come out of a user checking in their symptoms and habits daily.
User Flows
Onboarding & Health Assessment
Onboarding & Health Assessment
Sophie Fitzpatrick, “Proactive Patient”
Sophie Fitzpatrick, “Proactive Patient”
This flow addresses Sophie’s pain point of committing to one app by existing as an engaging onboarding process, with a clear example of what the daily experience would look like.
This flow addresses Sophie’s pain point of committing to one app by existing as an engaging onboarding process, with a clear example of what the daily experience would look like.
Daily Check-in
Daily Check-in
Sophie Fitzpatrick, “Proactive Patient”
Sophie Fitzpatrick, “Proactive Patient”
This flow addresses Sophie’s pain point of lacking a structured way to check-in on her health by providing an organized experience to routinely log symptoms and daily habit.
This flow addresses Sophie’s pain point of lacking a structured way to check-in on her health by providing an organized experience to routinely log symptoms and daily habit.
Browsing Health Data
Browsing Health Data
Kate Rivera, “Pattern Seeker”
Kate Rivera, “Pattern Seeker”
This flow addresses Kate’s struggle of becoming overwhelmed by too much health data by designing a clear informational experience that highlights important vitals and symptoms.
This flow addresses Kate’s struggle of becoming overwhelmed by too much health data by designing a clear informational experience that highlights important vitals and symptoms.
Viewing History & Trends
Kate Rivera, “Pattern Seeker”
Kate Rivera, “Pattern Seeker”
This flow addresses Kate’s difficulty understanding how her habits affect her symptoms by showing where to find past check-ins organizing long-term health data, and revealing trends.
This flow addresses Kate’s difficulty understanding how her habits affect her symptoms by showing where to find past check-ins organizing long-term health data, and revealing trends.
Flow Charts
Flow Charts
I made sure to design an experience that didn't leave users feeling endlessly overwhelmed and quick to drop off.
I made sure to design an experience that didn't leave users feeling endlessly overwhelmed and quick to drop off.
Onboarding Flow ⤴
Onboarding Flow ⤴
Mid-Fidelity Wireframes
Mid-Fidelity Wireframes
Designed mid-fidelity wireframes, focusing on mapping out features in a way that shows how they impact the overall trend database.
Designed mid-fidelity wireframes, focusing on mapping out features in a way that shows how they impact the overall trend database.
Designed mid-fidelity wireframes, focusing on mapping out features in a way that shows how they impact the overall trend database.
Developed intentional onboarding features that targeted both user persona's pain points.
Onboarding & Health Assessment
Sophie Fitzpatrick, “Proactive Patient”
I then developed the daily-check in as how it would be found in the onboarding tutorial.
For a returning user, "Let's Try Out a Check-in would become "Checking-in" ↴
Daily Check-in
Sophie Fitzpatrick, “Proactive Patient”
Browsing Health Data
Kate Rivera, “Pattern Seeker”
Viewing History & Trends
Kate Rivera, “Pattern Seeker”
Visual Design
Visual Design
Chose pastel pinks, oranges, and blues as the primary brand colors to be gentle on eyes and differentiate from standard, clinical health platforms.
Chose pastel pinks, oranges, and blues as the primary brand colors to be gentle on eyes and differentiate from standard, clinical health platforms.
Chose pastel pinks, oranges, and blues as the primary brand colors to be gentle on eyes and differentiate from standard, clinical health platforms.
Usability Testing
Usability Testing
Narrowing down on the user pain points increased positive engagement.
Narrowing down on the user pain points increased positive engagement.
Narrowing down on the user pain points increased positive engagement.
I conducted 1 round of usability testing with 5 testers. Each user went through medium-fidelity journeys designed to be based off the flow charts above. All 5/5 users were able to successfully onboard, check-in, and review trends.
I conducted 1 round of usability testing with 5 testers. Each user went through medium-fidelity journeys designed to be based off the flow charts above. All 5/5 users were able to successfully onboard, check-in, and review trends.
However, significant changes were made in each flow to give more control to the users and clarify the steps and duration of processes within the app.
However, significant changes were made in each flow to give more control to the users and clarify the steps and duration of processes within the app.
Onboarding: Improving Information Architecture
First Round
Problem: Lack of Symptom Filtering
Users wanted the ability to filter through symptom categories. Without this feature, they felt they had to keep scrolling.
Solution: Categorized Filters
Filtering options were added, allowing users to browse and select relevant symptoms. This change helped users clearly see what the app included without unnecessary scrolling.
*Adding these categories helped with addressing Sophie’s pain point of feeling overwhelmed during health app onboarding.
First Round
Problem: Lack of Symptom Filtering
Users wanted the ability to filter through symptom categories. Without this feature, they felt they had to keep scrolling.
Solution: Categorized Filters
Filtering options were added, allowing users to browse and select relevant symptoms. This change helped users clearly see what the app included without unnecessary scrolling.
*Adding these categories helped with addressing Sophie’s pain point of feeling overwhelmed during health app onboarding.
Onboarding: Adding Flexibility
First Round
Problem: Flow Friction
Some users did not want to complete a check-in immediately during onboarding, but there was no option to opt out.
Users expressed uneasiness about the length of a check-in.
Solution: Flexible Onboarding Journey
A “Skip for now” button was added, allowing users to bypass the initial check-in.
A small bar was added as well to show that there are four screens to be completed during a check-in.
*A check-in progress bar and skip button addressed the pain point of lengthy onboarding experiences.
First Round
Problem: Flow Friction
Some users did not want to complete a check-in immediately during onboarding, but there was no option to opt out.
Users expressed uneasiness about the length of a check-in.
Solution: Flexible Onboarding Journey
A “Skip for now” button was added, allowing users to bypass the initial check-in.
A small bar was added as well to show that there are four screens to be completed during a check-in.
*A check-in progress bar and skip button addressed the pain point of lengthy onboarding experiences.
Browsing: Clearer Information
First Round
Problem: Limited Data Visibility
On the data pages, such as the heart rate page, users wanted to review more than a single day’s (or week’s) metrics at a time.
Users wanted a less alarming color, they felt a red-based orange expressed urgency.
Solution: Expanded Data Options
Additional timeframes were introduced, allowing users to switch between daily, weekly, and monthly trends. This gave users a clearer picture of their overall patterns.
The chart color was shifted towards orange.
*Incorporating an organized but large vital history database helped address Sophie’s need to be able to locate all her information in one location.
First Round
Problem: Limited Data Visibility
On the data pages, such as the heart rate page, users wanted to review more than a single day’s (or week’s) metrics at a time.
Users wanted a less alarming color, they felt a red-based orange expressed urgency.
Solution: Expanded Data Options
Additional timeframes were introduced, allowing users to switch between daily, weekly, and monthly trends. This gave users a clearer picture of their overall patterns.
The chart color was shifted towards orange.
*Incorporating an organized but large vital history database helped address Sophie’s need to be able to locate all her information in one location.
Final Designs
Final Designs
Introducing Vitalize, a mobile app that makes tracking your personal health data and habits easier.
Introducing Vitalize, a mobile app that makes tracking your personal health data and habits easier.
Introducing Vitalize, a mobile app that makes tracking your personal health data and habits easier.
Welcoming Onboarding
The final onboarding screens are designed to feel both welcoming and comforting
Progress bars and skip buttons are included to reduce pressure
Subtext is utilized to speak the user through the process
Check-In Centered
An optional check-in sample is displayed to users in the onboarding so they understand the overall experience.
The homepage is centered around the check-in feature, also highlighting daily vitals with constant updating
Check-In Centered
An optional check-in sample is displayed to users in the onboarding so they understand the overall experience.
The homepage is centered around the check-in feature, also highlighting daily vitals with constant updating
Simple & Familiar
Symptom questions reflect real-world health assessments
Important, but simple, questions are asked about the user’s habits
Simple & Familiar
Symptom questions reflect real-world health assessments
Important, but simple, questions are asked about the user’s habits
Interactive Data
Vitals reflect familiar health charts and are designed to be easy to read
Charts contain interactive elements related to common blood pressure / health condition symptoms
Users can explore daily, weekly and monthly vital history from the homepage
Interactive Data
Vitals reflect familiar health charts and are designed to be easy to read
Charts contain interactive elements related to common blood pressure / health condition symptoms
Users can explore daily, weekly and monthly vital history from the homepage
Organized History
Previous check-in’s, health data past 1 year, and trend insights can be easily located through the nav bar
Hearts are used to show completion on a calendar and can be looked into
Users can source a full list of health data to go in and out of different vital history
Organized History
Previous check-in’s, health data past 1 year, and trend insights can be easily located through the nav bar
Hearts are used to show completion on a calendar and can be looked into
Users can source a full list of health data to go in and out of different vital history
Key Takeaways
Key Takeaways
Understanding Health Data
Understanding Health Data
This app posed the challenge of clearly understanding dysautonomia disorders and their symptoms, as well as interpreting health data so it could be properly charted and displayed. A lot of research went into learning how data specific callouts (or outliers) can be pinpointed for users to easily comprehend.
This app posed the challenge of clearly understanding dysautonomia disorders and their symptoms, as well as interpreting health data so it could be properly charted and displayed. A lot of research went into learning how data specific callouts (or outliers) can be pinpointed for users to easily comprehend.
Approachable Design
Approachable Design
Initially, I approached this project with the idea of a very clean design, modeled after health diagnostic boards and charts. After reviewing examples and speaking with potential users, I began experimenting with a more friendly, “bubbly” design while still staying true to the standards of a health app.
Initially, I approached this project with the idea of a very clean design, modeled after health diagnostic boards and charts. After reviewing examples and speaking with potential users, I began experimenting with a more friendly, “bubbly” design while still staying true to the standards of a health app.
Information Overload
Information Overload
My current struggles in this project fall under knowing what data to prioritize displaying. Keeping in mind that the range of knowledge a user has varies greatly, I’ve found some difficulty in knowing what users will expect or want to see.
My current struggles in this project fall under knowing what data to prioritize displaying. Keeping in mind that the range of knowledge a user has varies greatly, I’ve found some difficulty in knowing what users will expect or want to see.
Reflection
Reflection
This project has been a pleasure to work on and allowed me to step more into more health-centered data, repetitive habits, and accessibility. Designing Vitalize pushed me to think more carefully about the emotional impact of an experience and how little shifts in language, data organization, and visual design can maintain or increase users and app retention.
With more time, I’d love to add more to the way trends are gathered by user data and displayed. As of now, I followed the technical limitations / normalcy of health app trend data, but I believe with more prototypes and user testing this can be expanded on.
Moving forward, I’m excited to continue exploring how thoughtful design can make health data feel both more approachable and digestible. Yay!
This project has been a pleasure to work on and allowed me to step more into more health-centered data, repetitive habits, and accessibility. Designing Vitalize pushed me to think more carefully about the emotional impact of an experience and how little shifts in language, data organization, and visual design can maintain or increase users and app retention.
With more time, I’d love to add more to the way trends are gathered by user data and displayed. As of now, I followed the technical limitations / normalcy of health app trend data, but I believe with more prototypes and user testing this can be expanded on.
Moving forward, I’m excited to continue exploring how thoughtful design can make health data feel both more approachable and digestible. Yay!