Healthfoilio
Product Description
Healthfolio is a medical app that allows its users to securely share, download, and print their medical records. Other features include messaging medical providers, charts to keep track of their health, prescription refills,...etc.
Timeline
5-Weeks


Client
A healthcare organization.
Team
This is an independent project.
Tools
Figma
Google Form
Canva
FigJam

Healthfolio Medical App





Roles & Responsibilities
I conducted user research including recruiting for interviews, ideation, and designing the UI for the medical app.


Observations
42%
42% have trouble accessing records from their physician’s office.
45%
45% of patients have trouble accessing medical records from their patient portal.
66%
66% of patients prefer to review their health information and make appointments using mobile devices.
92%
92% of U.S. residents say quick and easy access to their medical records is important.

Competitor Analysis




Top 10 Findings from User Interviews: Patient Portals
Preference for Digital Access – Most participants preferred accessing medical records via digital platforms, with a mix of laptop and mobile use. Laptops were favored for detailed views, while mobile access was chosen for convenience.
Frequent Use Cases – Common reasons for accessing medical records included vaccinations (COVID-19, TB tests), prescription refills, school/work requirements, and government healthcare needs.
Mobile Design Challenges – Poor mobile design was a major frustration, including small checkboxes, excessive scrolling, and screens not optimized for mobile use.
Data Loss & Navigation Issues – Some users experienced data clearing when navigating back, clunky menus, and too many screens, leading to frustration.
Medical Terminology & Clarity – Participants valued simple, easy-to-understand medical terminology, while complex jargon was a barrier to usability.
Security & Convenience – Secure payment options and self-service features (like scheduling, prescription refills, and 24/7 chat support) were highly appreciated.
Visual & Data Representation – Charts, infographics, and downloadable records were preferred for understanding medical insights and payment breakdowns.
Need for Consolidation – Users disliked having multiple portals for different types of records and suggested a more integrated system for accessing test results.
User Account & Access Issues – Password resets and data-saving functionalities were identified as pain points, with users requesting easier account recovery and record-sharing options.
Suggested Enhancements – Key improvements included AI chat support, direct prescription refills, better mobile optimization, and the ability to share records with family members.



Research Synthesis
Affinity Mapping




Empathy Mapping


User Personas
Student User Persona

Olivia Lee
High-School Student
Safety
About
19
HS Student
Pain points
Obtain higher education
Play on a sports team
Get good grades
Hope to get a good job
Full-time
student
California
Goals
Esteem
The educational institution needs these medical records by a certain date in order for the student to continue taking and registering for classes.
Safety
Esteem
Maslow Pyramid
Self Actualisation
Love Belonging
Physiological


David Marshall
Community Manager
About
28
New York
MBA
Employee
User Persona
Goals
Expand their skills
Work-life balance
Make good money
Be a good employee
Pain points
Human resources may need the worker’s medical records by a specific time to confirm that the worker complies with the company’s policies.
A worker may need to take time off soon and need the medical records as soon as possible.
A worker needs their medical records ready to send before they are required to travel for work purposes.
Maslow Pyramid
Self Actualisation
Love Belonging
Safety
Physiological
Esteem
Safety
“How do I send my medical records to my work? They need them by a certain time!”
Needs
Confirm and submit medical records, immunizations, and vaccinations to their work site.
Human resources require medical records for requesting time off.
Work business trips require medical records.

Jobs To Be Done (JTBD)
Student
Working Professional


Product User Challenges

Small Checkboxes/Buttons:
Confusing and Repetitive Questions
Too Many Open Screens
Loss of Data When Backing Out of Screens
User Needs
Quick and Easy Access to Medical Records
Mobile-Friendly Interface
Simple Registration Process
Seamless Appointment Scheduling
Secure Messaging and Notifications
Clear, Layman-Friendly Medical Information


How Might We Problem Statements
How might we make the patient portal user-friendly through a mobile app?
How might we ensure that the data is available through mobile phones and shareable to selected parties securely?
How might we provide technical assistance for those using the mobile patient portal?
How might we notify the users of updates within their mobile patient portal?
How might we make medical records available through a mobile app without the interference of a practitioner?

Ideate & Design
User Story Highlights
As a patient, I should be able to use an AI search engine to retrieve my medical records easily without having to find it myself.
As a patient, I should be able to view my history search activity to retrieve the most recent medical records.
As a patient, I should be able to view my most recent medical records before viewing older medical records to keep the most relevant information at the top.
As a patient, I should be able to share my medical records with educational institutions, government, work, blood donation institutions, and immigration to get their records sent to the institution asking for it.

Information Architecture

User Flow for Red Routes

Sketches













Guerilla Usability Testing for Paper Prototype



Wireframes

Designing for Edge Cases

Mood Board Style Guide




Features & Functionalities
To resolve user needs

Unique Feature Solutions

Key UIs






Key UIs
Download Medical
Records
Download
9:41
Medical Record 6/1/24
05/06/2024
10:30 AM
341 KB
Change File Type
JPG File
PNG File
PDF File
Downloading Medical Records
Medical Record
Select File Type

Home Screen Navigation
Smaller Buttons to Allow
for More Features

2km away
4.8
Dr. Stevi Jessi
Orthopedist

Dr. Maria Elena
1,5km away
4.9
Psychologist

Chardiologist
800m away
4.7
Dr. Marcus Horizon
Nearby Doctors
See all
Insurance
Search for clinics, providers, specialists...
Hi, Sam
9:41

Latest News

Breakthrough study sheds light on mechanisms behind...
Gastric Cancer

Mpox (monkeypox) is a viral disease that occurs mostly in
Monkey Pox

Chardiologist
Vaccine Variant Discovery

Medical News
Letter for Users to
be Informed

Option to Save a Notification
Your Blood Test Results...
Update Your Profile Inform...
Your Due for a Prescript...
Time to Schedule Your...
You are Due for Another...
9:41
Appointment Confirmed...
Your Vaccinations Need...
Dr. Kumar has Messaged...
Notifications
Appointment Notification


A Handful of the High-Fidelity Screens


9:41


9:41
Find all your medical records in one place
Skip
9:41



9:41

Skip
9:41

Download and send your medical records to trusted third-parties
Splash Screen
Onboarding
Onboarding





9:41
Covid-19
Cardiology
Surgery
General
Psychiatry
Dentist
Lungs
Your Insurance Provider
Find an insurance provider
Accepted Insurance Providers
Services Offered
Insurance
9:41


9:41
Messages

Dr. Marcus Horizon
I don,t have any fever, but headchace...
1
10.24

Dr. Alysa Hana
Hello, How can i help you?
09:04

Dr. Maria Elena
Do you have fever?
08:57

Dr. Marcus Horizon
I don,t have any fever, but headchace...
1
10.24

Dr. Alysa Hana
Hello, How can i help you?
09:04

Dr. Maria Elena
Do you have fever?
08:57

Dr. Marcus Horizon
I don,t have any fever, but headchace...
1
10.24

Dr. Alysa Hana
Hello, How can i help you?
09:04

Dr. Marcus Horizon
I don,t have any fever, but headchace...
1
10.24

Dr. Alysa Hana
Hello, How can i help you?
09:04

Dr. Marcus Horizon
I don,t have any fever, but headchace...
1
10.24

Dr. Alysa Hana
Hello, How can i help you?
09:04

Dr. Maria Elena
Do you have fever?
08:57

Dr. Marcus Horizon
I don,t have any fever, but headchace...
1
10.24

Dr. Alysa Hana
Hello, How can i help you?
09:04

Dr. Maria Elena
Do you have fever?
08:57
9:41


9:41

Chardiologist
800m away
4,7
Dr. Marcus Horizon
Doctor Detail
9:41
Appointment View
Mo
Tu
We
Th
Fr
Sa
Su
1
2
3
4
5
6
7
8
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
1
2
3
4
5
6
7
8
9
10
11
12

Chardiologist
800m away
4,7
Dr. Marcus Horizon
Doctor Detail
9:41
Appointment View
Mo
Tu
We
Th
Fr
Sa
Su
1
2
3
4
5
6
7
8
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
1
2
3
4
5
6
7
8
9
10
11
12



9:41

Search location, ZIP code..
Appointment Location
9:41
Confirm Location
2640 Cabin Creek Rd #102 Alexandria, Virginia(VA), 22314
Appointment Address
Appointment Location
https://www.figma.com/design/TPvpIrkkMdxUHoakbwJ1i6/
Patient-Portal-UI?node-id=0-1&t=EVFKt6Ab5xM8HbQB-1
Link to High-Fidelity Prototype:


9:41
Sam Smith

9:41
Contact Details:
(714)562-9244
samsmith@gmail.com
157 Trevelyn Avenue, CA 92761
Overview:
Gender: Male
DOB: 06/23/1996
NOK: Manny Smith (brother)
Previous Visit: 04/22/2023
Next Visit: 02/17/2024
Allergies: N/A
Profile


9:41
9:41
Logout
Settings
About Us
Payment
Statistics
Side Menu


Explore Projects and Services Beyond this Galaxy
© 2025