CommonHealth mobile app bookmark feature case study

Overview

CommonHealth is a new Android app developed by the Commons Project, a nonprofit that builds digital platforms and services for the public good. Taking a cue from Apple’s Health Records feature, the CommonHealth app allows people to collect, store, and share their medical data—like their COVID vaccination status—from connected labs and healthcare systems safely and securely.

The app extends the health data portability model pioneered by Apple Health to the 73% of smartphone users around the world who use Android devices. Still, easily accessing the healthcare and medical information that's important to you—having it where you need it, when you need it—is not the reality for many people, even those using apps like CommonHealth and Apple Health.

For a speculative project to add a feature to an existing product, I designed a Bookmarks and Folders solution for CommonHealth to help people more easily and efficiently find, access, and organize the medical information that matters to them the most.
My Role
UX designer
Interaction designer
Prototyping
Testing

Platform
Android mobile app
Timeline
August - September 2021

The Problem

Discover (find the problems)
I interviewed six individuals who are regularly referencing or actively engaging with their medical information and asked about how their health records are currently organized.

The short answer?
😂 "They're not."
🤔 "They're fragmented across different channels."
😫 "They're all over the place. It's a mess."
I initially assumed that a major pain point is having a disorganized mix of digitized and non-digitized (paper) records, but I was surprised to learn that the typical problems are actually more fundamental than the healthcare system's unstandardized format.

I identified 4 common problems people have when it comes to their health information:
1. Not knowing or forgetting information.
People stress about accurately remembering details about their medical history on their own.
2. Not knowing where to look for their information.
People feel annoyed with not knowing where to find the information they need.
3. The work it takes to access their information.
People feel burdened when having to look up or verify aspects of their medical history because it takes a lot of work to access.
4. The work it takes to share their information.
People feel frustrated that they cannot easily share their health records with providers—including having to pay to do so.
Quotes from user interviews for health records app
Define (prioritize the problem)
Understanding both User And usage
Based on my research insights, I decided to forgo personas for a Jobs To Be Done (JTBD) framework so that my design is centered around specific situations, motivations, and outcomes vs. a static generalization of user groups that share common traits. It’s critical that I understand what "jobs" my participants need to do, and why they might "hire" the CommonHealth app, and applying a JTBD framework would help me focus more clearly on these specific contexts.

But in order to design the best possible experiences for people, I still need to understand and empathize with them. To help me do this, I created empathy maps along with job stories for each of my participants to capture and represent their real-life attitudes, feelings, and behaviors.

Select a participant below to view their empathy map:
Two examples of my users' job stories:
Rosa's job stories
→ When my dad had a stroke, I wanted to be the point of contact for his doctors and keeping track of his medical details so that he and my mom don’t have to worry about it.

→ When I have to show proof of my covid vaccination, I want to pull up an official digital copy so that I don’t have to search for a photo on my phone that doesn’t feel valid.

→ When I find out I have a new health issue, I want to have a centralized memory bank for all of this information so that I don’t have to keep track of everything in my head.

→ When I visit a new doctor, I want to share certain records in my medical history so that they have access to the information they need to know.

→ When something in my healthcare changes, like taking a new medication for my foot surgery, I want to know if it affects other aspects of my health, like my autoimmune disease, so that I can flag it with my other doctors who need to know.

Jia's job stories
→ When I have to recall something from my medical history, I want to view information together in a chronological way so that I can see holistically what happened when.

→ When I have a doctor’s appointment, I want to get an after-visit summary from my doctor with what we talked about and next steps so that I don’t miss any important information my health.

→ When I’m managing my heart condition, which is a new diagnosis, I want to have a way to understand insights from my health data so that my medical history is not just medical records without context.

→ When I need info from my medical history, like an immunization record, I want to be able to search for it so that I can find the info I need quickly.

→ When I have to share medical records with providers, I want to have ownership and control of my electronic records so that I can digitally share my information whenever and with whomever I want.


Insight
One clear, universal pattern emerged from the job stories: The need to access and share one's health information quickly and easily. 
Problem statement
Going into ideation, I wanted to be sure I was designing for the complexities of someone who actually isn't the "typical" user. If I could solve medical record accessibility issues for the trickiest group of patients, I could improve the experience for all patients. (This also helps put the feature in a position where the design is scalable for more and more users over time, right from the beginning vs. running the risk of re-creating and re-designing over and over again.) 

With the more complex users in mind, I landed on my problem statement:
illustration of three female user personas for medical records app
Problem Statement People with health conditions feel inconvenienced by keeping track of their health information because over time, the amount of information increases and can become more complicated and distributed.

So, how might we make accessing health records less overwhelming over time?

The Design

Ideate (explore the solutions)
Persona Spectrum
To ensure that I'm designing for as many "jobs" as possible, I created a persona spectrum, a method that helps explore solutions that aren’t just useful for people who are dealing with consistent, ongoing challenges (likely a small percentage of users), but also those who face the same challenges on a temporary or situational basis—which could include all of our users at some point in time.
Permanent
Timeframe: Ongoing
inclusive design persona spectrum illustration with permanent constraints
→ Person with an ongoing health condition and regular doctor visits
→ Person managing their family’s healthcare
→ Person who is a caregiver
Temporary
Timeframe: Defined span of time
inclusive design persona spectrum illustration with temporary constraints
→ Person trying out a new prescription
→ Person going to physical therapy for an injury
→ Person visiting a specialist for a specific goal
→ Person moving and changing providers
Situational
Timeframe: Present moment
inclusive design persona spectrum illustration with situational constraints
→ Person recalling medical history to a doctor
→ Person filling out forms about their history
→ Person required to show proof of Covid-19 vaccination or other medical record
The Journey to Bookmarks
Insight
"I have a lot of medical stuff I keep track of, but it’s all over the place—with all different labs and doctors and portals. So I use physical folders to organize the big things or the important things in my history that I'm trying to keep track of or access easily."
– Callie
To help users find and access their medical information quickly with CommonHealth, I wanted to avoid making users learn a whole different or new process. So I looked to the systems that people are either already utilizing or at least familiar with: Folders. I started freestyle sketching my ideas and initially called the feature "Health Journey."
sketches for a bookmark feature in a medical records app
so... many... versions!
Not every idea will be a winner, of course! I tried out several concepts and iterations before ending up on a bookmarking feature that includes folders to allow users to group—and share—their records however they want.
Curated timeline
WHY NOT? The original Health Journey idea centered around a timeline for users to pin their most important records and even automate going forward, but the scope was far too large. It would involve designing and testing several new features to the app.
Pinned records
WHY NOT? This idea branched off from the first because it's a more familiar concept. While it was a favorable idea in concept testing, the feature had a confusing disconnect: "Pinning" implies that the item is pinned to the top of its channel—not saved in a different channel entirely. And having pinned records across different categories would not solve for the "quick access" problem.
Customizable categories
WHY NOT? This idea diverged from the original Health Journeys concept, but with a focus on enabling users to create their own categories for their medical records for quick access. Yet it wouldn't be very useful for people who have multiple "one-off" records that they want to mark as important.
Bookmarks (including folders!) 🎉
All of this versioning led me to a simple but smart and scalable solution: A hybrid of pinned records and customizable categories, a.k.a. Bookmarks. People are already familiar with bookmarking or favoriting items, and then sorting those items into folders for easy access, so they could start immediately without learning anything new. We had a winner!
(Click to enlarge the wireframes for these concepts—three of which didn't end up making it.)
lo-fi wireframes of concepts for medical records app feature
Develop and test
To design the Bookmark experience on CommonHealth, I looked at digital products that have a save, collect, or bookmarking feature used by millions of people—from Instagram to Airbnb to Google Chrome—for a sense of what flows and functionality work well.

I then defined how a user would use this feature within CommonHealth's ecosystem—first by sketching, then by creating user flows.
sketches of a user flow for a bookmarking feature in a medical records app
user flow for bookmarking feature in medical records app
user flow for bookmarking feature in medical records app
user flow for bookmarking feature in medical records app
user flow for bookmarking feature in medical records app
UI and Interaction design
Once the flows were nailed down, I constructed the interface and visual design for the feature. In short, I kept it simple. Keeping in line with the app's clean and cheerful visual identity, I used common bookmarking design patterns as well as Material Design's interaction model so that the new feature would feel like it's always been there.
I designed a mid to hi-fi prototype in FIgma for live usability testing, which I conducted via Zoom with four participants recruited for either being an Android user, someone who is tracking their medical history, or both.

(BTW, you can see the prototype in action at the bottom of this page!)
Usability Test Tasks:
Task 1 → How would you bookmark both of your Covid vaccinations and save them to the same folder?

Task 2 → How would you create a new folder for existing bookmarked records? Then how would you add a new, non-bookmarked record to that folder?

Task 3 → How would you export your Covid vaccinations folder? How would you export two folders at once?

I also asked each tester if these tasks are realistic for them, and how they would personally use the feature.

The Results

Outcome
75%
3/4 participants successfully completed Task 1 without any issues. Interestingly, all 4 testers bypassed the first bookmark's snackbar option to "ADD TO FOLDER" and bookmarked both vaccination records first before creating a folder.

The one tester who did not complete the task wanted to click on "ADD TO FOLDER" on the second bookmark's snackbar to create the folder. This is a pathway I did not build out in my prototype.
50%
2/4 participants successfully completed Task 2 without any issues. The biggest confusions were around the idea of records needing to be bookmarked first in order to be added to a folder. See the revisions I made below!
100%
4/4 participants successfully completed Task 3 without any issues. While all testers clicked on the overflow menu to select the folder, they each conveyed that they could think of more than one way to go about the task, including a "press and hold" action to select the folder.
Revisions
Problem 1:
Adding a non-bookmarked record to a folder → "Hmm, this says 'New Bookmark,' but what I'm adding isn't a bookmark yet. So I think I need to find another way to add a record here that isn't a bookmark."
Solution:
For this tester, "New Bookmark" implied adding a bookmarked record only. I want users to be able to add any record to a folder, regardless of whether it's bookmarked or not. (Then, adding a non-bookmarked record to a Bookmarks Folder will automatically save the record as a bookmark.)

Additionally, two testers asked if they could add a subfolder within a folder as indicated by the floating action button (FAB) in the second screen below, which is not a current functionality. So I changed the FAB in the folder view to an extended FAB for a single action: ADD RECORD (third screen below). The change of language here also suggests that any record can be added here, not just bookmarked records.
mobile screen floating action button revisions for a medical records app
Problem 2:
Searching for an non-bookmarked record to add to a folder → "Tapping the bookmark icon to save the record to my folder confused me. I was second guessing whether I was saving it into the folder or just bookmarking it."
Solution:
Instead of tapping the bookmark icon to add it to the folder (first screen below), I applied the same design I used for card selection in the flow for Task 1 (second screen below).

Now, it not only feels like the record is getting selected for the folder, but the snackbar also calls out, "hey just an FYI! You're adding this record to a folder, but it's also getting saved as a bookmark, too."

user experience revisions for a medical records app
Other minor revisions I made to the feature:

Creating a new folder now ends on the Bookmarks home screen, visually indicating the newly created folder. It no longer ends inside the new folder itself.

The "Clear All Bookmarks" option on the overflow command menu is now removed. (Instead, the "clear" option can simply appear on the command menu triggered by the "Select" action.)
How would people use this feature?

"I would absolutely use this feature to save things in folders that I want to talk to my doctor about."

"Even if I had just one lab result that I needed to talk about at an upcoming appointment, I would put that in a folder so that I could get to it quickly in the appointment, as opposed to going through all my lab records."

"One of the ways I would use this feature is saving stuff for quick access, so if I need the info, I could just quickly pull it out."

"I would definitely categorize things: I have Celiac disease, so I would have a folder for all of my Celiac things, which has spanned from testing to procedures to lab results. That's my main reason I do any sort of medical history organization."
Takeaways
Through this whole project, my mind ran through an endless stream of ideas and possibilities, and it was imperative to continually ground this feature's design process in the real-life constraints of not only the current state of electronic health records, but even the constraints based in CommonHealth's vision (their users' health data is only stored on their device, never in the cloud—would xyz feature be viable for an app that is completely device-based, always and forever?).

On the topic of health data and health information, it was also important to think about the behavioral economics principle of
information aversion. Health and medical matters can be a sensitive subject, one that many people may not want to deal with unless they absolutely have to.

In asking, "How might we make tracking health journeys more sustainable?" I acknowledge that such features ideally shouldn't be asking our users to do much work at all—especially on a regular basis—that's very difficult and very ineffective. I wanted to see if a feature could just have users do a hard thing one time and be set. In other words: Can we get people to make a one-time decision now that will lock them into a future outcome?

Some next-step ideas include automated bookmarks for incoming health records and push notifications that let people bookmark a record without even opening the app. Ask me about the rest!

Interact with the final prototype
Illustrations credit → stubborn.fun
Back to top