HealthBetter
UX/UI Case Study
UX/UI Designer
My Role
Timeline
Tools
Figma/ Adobe Illustrator / Adobe Photoshop / Lyssna
April - September 2024
What is HealthBetter?
My Role
Patients often face challenges when trying to access healthcare services efficiently, for example, long wait times and frustration when booking medical appointments. Managing health records, such as test results, is scattered and inefficient, making it hard for patients to track their medical history. The lack of a simple, unified system for scheduling appointments, storing records, and accessing virtual consultations creates barriers to receiving timely and convenient healthcare.
Problem Statement
Proposed Solution
The HealthBetter Impact
The healthcare industry is rapidly evolving, and patients are seeking more convenience and control over their medical needs. HealthBetter offering an all-in-one solution for appointment scheduling, health record management, and online consultations. This app meets the growing demand for digital healthcare solutions, providing a streamlined and user-friendly interface that improves patient experience, enhances healthcare access, and encourages proactive health management.
HealthBetter is a mobile application designed to simplify the healthcare process for both patients and providers. Its user-friendly interface allows patients to book appointments, view results, and track health data within minutes, saving valuable time and making healthcare more accessible and stress-free.
Design process
Discovery
Empathy
Ideation
Prototyping
Testing
1
2
3
4
5
Design system
Final Designs
6
7
Threats:
The health monitoring app market is competitive, and the emergence of new players or established competitors can pose a threat to FollowMyHealth's market share.
The risk of data breaches and cyber threats could undermine ser trust and result in legal consequences.
Strengths:
Wide range of features for tracking various health parameters (fitness activities, nutrition, and medical records).
Intuitive and user-friendly interface.
The app prioritizes data security and privacy
Offers features for scheduling and managing medical appointments.
Weaknesses:
Insufficient protection of personal data (many reviews about information leaks).
The app's extensive features might be overwhelming for users who are not tech-savvy.
The app heavily relies on internet connectivity, which might pose challenges for users in areas with poor network coverage.
Opportunities:
There is an opportunity to expand the app's services, such as adding telehealth consultations, virtual coaching, or personalized health plans.
Integration of artificial intelligence and predictive analytics to offer users personalized health insights and recommendations based on their historical data.
Competitive analysis
HealthBetter combines features that are commonly found in different medical services. Therefore, it was important for us to take two different services to evaluate the features we needed.
Strengths:
Healow provides users with a convenient platform to manage their health information.
The app encourages patient engagement by allowing users to actively participate in their health management through features like appointment reminders, medication tracking, and health records access.
The app has received positive reviews on the AppStore.
Weaknesses:
Insufficient protection of personal data; there were many reviews about information leaks.
The app's extensive features might be overwhelming for users who are not tech-savvy or are new to health monitoring applications.
The app heavily relies on internet connectivity, which might pose challenges for users in areas with poor network coverage.
Opportunities:
Collaborating with subscription providers or other fintech companies could enhance the app's functionality and open up possibilities for cross-promotion.
Implementing strategic promotions and marketing campaigns outside of social media can help tap into a broader user base.
Threats:
The health monitoring app market is competitive, and the emergence of new players or established competitors can pose a threat to FollowMyHealth's market share.
The risk of data breaches and cyber threats could undermine ser trust and result in legal consequences.
Surveys
A total of 18 respondents filled out a survey of 14 questions, and the participants were primarily in the age range of 18-67.
53%
91%
64%
58%
of respondents used (or are using) any health apps
48%
of respondents would like to receive reminders for preventive health check-ups
of respondents would like to have the opportunity to have an online consultation with their doctor
of respondents regularly visit a doctor and check their health
39%
of respondents keep physical copies of my medical test results in a folder at home
of respondents had ever had difficulty making an appointment with a doctor using their phone
1. Identify pain points, preferences, and expectations that potential users encounter when solving certain medical issues.
2. Explore and evaluate different storage options for medical tests used by potential users.
3. Conduct efficacy studies to assess the impact and convenience of the app on user health out.
Research Goals:
Survey and interview data show that people are interested in a health app. Users were inspired by the idea that they did not need to call to make an appointment with a doctor, but did it online. Several interviewers noted that they were happy to keep medical test or ultrasound results online because they often get lost.
Interviews
I conducted 3 interviews with potential users in range 25-56 years old. The criteria were based on the frequency of visits to health facilities and the use of mobile devices.
Maria, 33, Housewife, mother of three sons
Timur, 40,
QA Engineer
David, 54, Constructor
Affinity mapping
Behaviors & Attitudes
Goals & Needs
Frustrations
Quotes & Facts
“It's stressful for me every time I have to wait on the phone.”
“I would like to simplify the process of going to the doctors as much as possible.”
Gets angry when an app seems too complicated
Likes the idea of quickly booking a doctor's appointment
Make an appointment for your next doctor's visit in advance
Save time on making children's appointments with the doctor
Make an appointment with a doctor
Plans to organize a place to store medical tests for the whole family
“I often lose my children's test results.”
Systematize the results of analysis so that it is convenient to track the dynamics
It is difficult to track the dynamics of medical results
Wants to keep medical documents in a safe place
Test results
He doesn't like going to doctors
He would rather consult online than go to the clinic
Be able to ask a question online
Online consultation with a doctor
Tired of frequent visits to the doctor
Hoping to at least partially visit a doctor online
Interviewers find the process of making an appointment with a doctor quite difficult and exhausting.
Some of the interviewers had experience with other health apps, but they were ultimately dissatisfied.
Users noted that they would like to see an easy interface and clear functionality in the application.
All interviewers noted that they would like to be able to consult online.
Parents with children and people with illnesses were more interested in the application.
After the interview, I decided that it was worth emphasizing the simplicity of the application, without overloading it with necessary functions and pages, so that it would be useful for people of older age.
Insights Overview
User Personas
Based on the research I conducted, I have created two unique user personas: Anna and Tim. Each persona has distinct goals and pain points, which will help us better understand their needs. By addressing these differences, we can create a product that effectively meets the needs of both personas, providing a more personalized and user-focused experience.
Journey maps
To better empathize with the personas, I created user journey maps that illustrate their interactions with the app through scenario-based goals.
Wants and Needs
Anna wants to save time on making children's appointments with the doctor.
Gathering Information
What prompted Anna to begin a task?
Anna wants to find a way to make an appointment with a doctor without wasting time and effort.
What will Anna know when her task is finished?
When she understands that she has made an appointment with a doctor
What information does Anna already know about the process?
She used to use similar apps to book doctor's appointments or movie tickets.
What tools will Anna need to complete the task?
A smartphone
Task Analysis
1. Download & open HealthBetter Mobile App
2. Create a new account or log in to an existing account
3. Fill in personal information
4. Navigate to Appointments
5. Select the option “Why you need to visit the doctor”
6. Select date and time
7. Confirm choice to book an appointment with a doctor
User objective
Anna is a caring mother of two children who are often sick. She wants to organize doctor visits and resolve all health issues in a way that is as convenient as possible and does not waste a lot of time.
Anna, 34
Married, Stay at Home Mom of two kids
Task analysis and User Flows
Wants and Needs
Tim wants to systematize the results of analysis so that it is convenient to track the dynamics.
Gathering Information
What prompted Tim to begin a task?
A large number of paper test results are lost and making it impossible to track the dynamics.
What will Tim know when his task is finished?
Tim will be able to see his test results electronically and filter them by time, doctors or individual indicators.
What information does Tim already know about the process?
Tim is moderately tech-savvy but has never had any previous experience with similar applications
What tools will Anna need to complete the task?
A smartphone and a computer
Task Analysis
1. Download & open HealthBetter Mobile App
2. Create a new account or log in to an existing account
3. Fill in personal information
4. Navigate to the My Health
5. Navigate to the Results
User objective
As a person with heart disease, Tim wants to closely monitor the dynamics of test results in order to react in time if necessary.
Task analysis and User Flows
Tim, 47
Divorced
Card sorting
Card sorting helps in understanding how users naturally group and categorize information. This can inform the development of an intuitive and user-friendly information architecture for HealthBetter app.
Sorting results
I found that some things would be more intuitive if they were in a category of their own instead of hidden in another grouping of features. For example, like Test Results.
Some participants' organization of information did vary which helped me see the importance of ensuring accessibility across multiple areas within the app.
Overall, card sorting is a great method that provides valuable insights into how users think about and organize information, guiding the design of more user-centric and intuitive experiences.
Revised Sitemap
The revised structure better aligns user expectations with a smoother and more personalized user experience. These updates simplified navigation and focused on the core features most important to users.
Usability Testing
I conducted the first round of user testing with six participants via zoom, focusing on testing various functionalities and navigation through scenario-based interactions with key features.
You received the blood result for TCT3 in the HealthBetter app, and you would like to review it. How would you find and open the test result?
Task 2: Viewing Test Results for Users
Task 3: Writing a Message to the Doctor
Task 1. Making an Appointment with a Doctor
I organized my findings by using a rainbow spreadsheet and an extra layer of affinity mapping to methodically capture patterns and insights. To prioritize and resolve critical functionalities, I used Jakob Nielsen's severity ratings scale.
You have read the test result, but you still have questions for your doctor and would like to ask them. Please send a message to your Dr. Mary Lopez. What steps would you take to send it?
You or a close family member is sick and needs to sign up and make an appointment with a doctor. Please show me how you would book an appointment with a doctor using the HealthBetter app.
Implementing User Feedback
Option to skip onboarding for those who want to create an account right away.
Issue 1: "Create your account" button led to the onboarding page.
Add an option where users can add and contact their insurance company.
Issue 3: No connections with the Insurance.
Send a link to the correct page (opportunity to share with your doctor) and (view more information).
Issue 4: Had trouble clicking "Share my results" and "View details buttons”.
Make a clearer transcript of the analysis, with gradation (bad, good, excellent).
Issue 1: The result of the analysis was not clear.
By conducting usability testing, I uncover significant challenges from user feedback and apply specific improvements to optimize the overall user experience.
Designing for Accessibility
To maintain accessibility throughout my design, I applied essential measures across multiple screens to ensure compliance with accessibility standards. I reviewed and refined the designs for potential problems, using Stark to check color contrast, touch targets, and font sizes.
The font has been changed from 10 and 12 to 14 and 16 points. A font size of 14 points or larger ensures that text is easily readable for most users.
Design system
The design system for the HealthBetter application is a comprehensive set of guidelines, components, and tools created to ensure a cohesive and efficient design process across the entire application. In this project you will see some of the components I built for this design system!
Logo
I chose a heart-shaped logo made from two band-aids. The heart universally represents love, care, and health. It immediately communicates the app's focus on well-being and compassion. Plasters are directly associated with healing and care, reinforcing the app's health-oriented purpose. They symbolize protection, recovery, and support.
Color
I chose green as the primary color because it is associated with health, nature, and growth. It's a great choice for HealthBetter app as it evokes confidence and calm.
The secondary color for our application is purple. Purple can be associated with compassion, support, and care. It can be used to evoke a sense of empathy and connection, which can be valuable in health apps.
I choose the DM Sans font for HealthBetter app. This sans-serif font is great for health applications because it is clearer and easier to read on screens. Besides sans serif fonts are better for users with visual impairments or reading difficulties.
The foundation of a design system is grid system. For this project I went with an 16pt grid system that consists of a 4 column grid for mobile and 20px grid system that consists of a 12 column for Desktop.
Buttons are primary interactive elements that allow users to perform actions such as sending a message to a therapist or making an appointment. Ensuring that buttons are easy to identify and use is crucial for a smooth user experience.
Icons act as visual aids to help users complete tasks. In the Healthbetter design system I went with the icon library because it's simple, informative, and complements the overall visual language of the design system. I focused on simplicity to help users understand the concept the icon represents and recognize icons on smaller screens.
Properly designed form fields can prevent users from making errors. Features such as input validation, required field indicators, and helpful error messages guide users to enter the correct information and correct mistakes easily when they occur.
Final App Design
After multiple rounds of revisions, iterations, and user feedback, I finalized the screens and high-fidelity prototypes for HealthBetter. These designs highlight the app's comprehensive approach, demonstrating how HealthBetter aims to become the go-to wellness companion.
Summary
HealthBetter is a mobile app that streamlines the healthcare process by offering quick appointment scheduling, instant access to test results, and easy health tracking. It eliminates the hassle of phone calls and paperwork, saving users time and reducing stress. By simplifying these challenges, HealthBetter empowers patients and providers to focus on what truly matters—better health outcomes.
HealthBetter
Thanks for reading!
Liudmila Hrynko
Ux/Ui design
2024