OBERD

Mobile App interface

brief //

OBERD needed a way to display the data it collects from patients and physicians around the world. The designs had to be mobile-friendly and easy to interpret by physicians, patients and healthcare institutions.

concept //

I created patient portals with friendly UI design and used color theory to humanize the data and make it easy for patients to understand. For doctors, I designed a customizable interface that showed an overview of patient data on first glance, but also allowed them to dive down deep into granular charts and graphs for more details.

Patient-facing portal

The patient-facing design shows patients what they really care about — improvement over time and areas of concern. Data from the most recent doctor visit is shown at the top, with an option to scroll below and see information on past visits. To make all this data relate better to a human rather than a robot, I used avatars that show what hurts (or doesn’t anymore!) and how much.

This doesn’t show every single available data point—that would be overwhelming and unhelpful. But it does highlight what’s most important to someone curious and concerned about their health. Patients recovering from surgery want to see how their pain levels have changed since surgery and patients completing physical therapy want to see how they’re improving over time. Clicking on each avatar enlarges that point in time and brings up more detail if that’s something a user is interested in.

REsponse: Physician-facing portal

The second piece of this project was to design the physician-facing portal. The challenge I faced for this part of the design was that physicians needed to be able to to log in and view data on several patients at once. A more sophisticated search function was also required. The avatars made less sense here for space and efficiency reasons—physicians could be looking at registries of thousands of patients at a time. Physicans studying this information every day also have a better understanding of what the data points mean, unlike patients who only use the app occasionally for a specific purpose. So for this design I went with a more numbers-focused approach.

The main page has a high-level overview of all patient registries. Within each registry, the design is broken up into modules that can be expanded or contracted by clicking the +/- icon in the top right hand corner of each one. Expanding a module allows a physican to take a deeper dive into the data.

For both the patient- and physician-facing designs, color is an important feature to help a user get oriented at a glance. In the context of healthcare, red is generally negative and associated with pain, while green is positive and associated with health. I incorporated color theory into how I chose palettes for the interface, icons and graphs. However, to take into account a diversity of user experiences, affordances in the designs ensure they function equally without the use of color.