Vitrica Hero Image

Vitrica

I think at some point in our lives, most of us have experienced the frustration of retrieving medical records or waiting on hold just to book an appointment. Vitrica is a mobile healthcare app that gives users seamless access to their own health data and their dependents' - with secure sharing built in from the start, not added on.

Project Type

Independent student project

Role

UX/UI Designer, Branding, Research

Timeline

March '24 - June '24
View Final Prototype

THE PROBLEM

Users described existing health apps as cluttered and hard to trust: one called account setup 'confusing and time-consuming,' another said the design 'feels outdated.' Several also noted that sharing records with family members or providers felt like an afterthought; bolted onto apps that were built around a single user, not a household."

THE PROCESS

01. DISCOVER

3 men and 2 women (ages 22-48) were interviewed. The clearest theme: users didn't just want easier navigation - they wanted to feel in control of who could see their data.

User Personas and Empathy Map

Vitrica was designed to support a wide range of users, from tech-savvy young adults managing their own personal health, to older generations - often parents - seeking a clear and dependable way to access and share their medical records.

Ashley

A stay at home mother that loves reading and spending time with her children. With her eldest child getting ready to start going to school, she needs a way to access and share her child’s medical records, but being a mother of two boys, can’t find time to go to the doctor’s office.

  • wants quick remote access to her children's vaccination and medical records
  • wants the ability to share school health forms without visiting the doctor
  • needs a platform she can manage easily during her busy day
Brian

Brian is a college student who loves sports and staying active. He actively participates in student sports club organizations and works a part time job as a referee for these sports games, which means he has to consistently submit his medical records. He also takes care of his father, and desires a way to quickly access secure data.

  • needs easy access to his own medical records for athletic clearance
  • needs a centralized dashboard to also manage his father’s records
  • Juggles multiple roles and responsibilities so often needs medical documentation last-minute
Todd

Todd is a hardworking, passionate, single father that does nothing but work in order to support his daughter in whatever way he can. His daughter wants to participate in school sports, so he needs a way to easily make appointments with her provider, and share her health information with the school.

  • Values simplicity and time-efficiency in daily life
  • Schedule and manage appointments quickly from his phone
  • Securely share and manage dependent health info without complexity
Vitrica Empathy Map

02.DEFINE

User Flow

Designing Vitrica's user flow and IA began with mapping the most essential user goals: accessing/sharing records, booking appointments, finding nearby doctors, paying bills, and managing proxy access. Proxy access got equal billing with core actions like booking appointments - a direct response to how many participants described managing care for a child or parent, not just themselves.

Vitrica User Flow Chart

03.IDEATE

Vitrica lo-fi Wireframe Sketches

Wireframe

For initial wireframing, I prioritized a clean, function-focused layout over visual flourish. Every screen was built around a single linear task path, so a user under stress (i.e. booking an urgent appointment) never has to guess what to do next.

Vitrica Digital Wireframes

Feedback from early usability testing helped refine the structure and highlighted opportunities to add an additional feature heavily requested by users, which was updated in the high-fidelity mockups, as well as the user flow. (Messaging/chatting providers)

I also considered folding Pay Bills into the Account settings, but researched indicated users expected billing to be a top-level action alongside record viewing and appointments, so I kept it as its own nav item.

Vitrica Final User Flow Chart

04. PROTOTYPE

Branding

The name "Vitrica" blends "Vital" and "Records." Early drafts leaned on a literal EKG line, but that read as clinical rather than reassuring; so the final mark centers a bold "V" instead, aiming for trustworthy without feeling sterile.

Vitrica Branding Brainstorms

Sticker Sheet/Design System

I created an easy to understand sticker sheet for individuals to use as a reference for Vitrica’s UI elements.

Vitrica Design System

With wireframes in place, I moved to high-fidelity mockups in Figma. The main goal being  humanizing a typically clinical experience through a calm color palette, modern typography, and custom illustrations instead of the sterile look most health apps default to.

05. TESTING AND ITERATION

Although this wasn't a live product, I treated retention as the north-star metric for testing, since the core problem I was solving was app abandonment, not just task failure.

User Testing

Some sample questions asked during user interviews:

  1. You want to access and share your vaccination history to your school so you can participate in sporting events, how would you proceed?
  2. You want to add a proxy connection for your little brother, how would you proceed?
  3. You need to make an appointment at a clinic for November 13th, 3:00 PM. How would you proceed?
  4. Walk me through what you are seeing on this screen.
GIF of making an appointment on Vitrica
GIF of sharing a record on Vitrica

All 5 participants completed the core tasks (i.e. booking an appointment, sharing a record, adding a proxy connection, etc.) without assistance.

The final change I made before handoff was adding real-time "opened" notifications, a sharing history log, and a "revoke access" feature; directly targeting the trust and control concerns that came up repeatedly in interviews, rather than just adding features for their own sake.

Vitrica Record Sharing Final MVP

Success for this MVP would be measured through user activity, retention, task completion/error rates, and feature usage. Retention mattered most, since the original problem was users abandoning cluttered, low-trust health apps, so keeping people in the product past onboarding is the real test of whether Vitrica solved anything.

Once these post-launch metrics are more clearly discovered, we can determine the features that are worth iterating upon.

Next steps and Future Iterations

1. Depending on the success rate and user feedback, tailor which features on the app need to be boosted/tweaked or potentially even removed.


2. Building and expanding partnerships with hospitals/providers in order to integrate more external systems for seamless record import.


3. Explore potential feature expansions such as: integration with wearable devices and AI-driven health insights.

Reflection

Designing Vitrica pushed me to combine functionality, empathy, and clarity in a high-stakes context, and taught me that trust and emotion turned out to matter as much as usability in a healthcare product.

The biggest shift in my thinking: designing for the user doesn't mean designing in isolation from the business. Building a full concept end-to-end meant balancing user needs against business and technical constraints, not just optimizing for the user in a vacuum.