Shoptaki Universal Patient Portal

Provide patients with a user-friendly, secure, and efficient way to manage their medical data.
Client: Shoptaki
Duration: 4 weeks
Role: UX/UI Designer, UXR

Background

Shoptaki is launching a new feature for the medical industry. This secure platform will automate the transactional communication of patient data across systems, streamlining the patient experience and setting a new standard for patient data management.

Tools

Figma, Google Doc, Trello, Zoom, Slack (Remote)

My role

As a design lead, I worked with a team of three other UX/UI designers to run an end-to-end design cycle from research through high-fidelity prototypes.

Problem

Imaging When we need to see a doctor, we often have to fill out multiple forms and input the same information repeatedly, which can be frustrating and time-consuming. Additionally, our medical records and documents may be scattered across different doctors and hospitals, making it challenging for healthcare providers to access our complete medical history. The impact of duplicative records includes patient identification errors, repeated care, redundant medical tests, and denied claims - all of which result in increased costs.

Solution

How might we create a secure and user-friendly digital platform that allows patients to easily access and manage their medical information, thereby reducing their dissatisfaction and mistrust with the healthcare system?

Feature 1

Quick Access

The Quick Access channel on dashboard enable users to easily find and access the specific section they need, allowing for a faster and more efficient use of the portal.

Feature 2

Appointments Reminder

Appointments reminder helps users by providing timely notifications and reminders of upcoming appointments. This can help them stay organized and ensure that they don't miss important appointments or deadlines.

Feature 3

Data Privacy Control

Users can control over their personal health information and protect their privacy by taps. This increase user trust and confidence in using our product to manage their healthcare, and ultimately improve the overall effectiveness of the healthcare system.

Feature 4

Prescription Easy Refill

Users can request prescription refills at any time from the comfort of their own home, without the need to schedule an appointment or make a phone call.

Discover and understand users

This section is all about discovering and understanding the user's needs, goals, and pain points. I set myself a few research goals before getting started.

  1. Learn as much as possible about my potential users
  2. Understand current users healthcare experience and the competitive landscape
  3. Determine if and how I can leverage new technology and innovation (with smart-chain technology)

User Surveys

We sent out a user survey using Google Forms and noticed some common themes and patterns among the responses.

80%

80% of users want sole control over who can access their medical records .

80%

80% of patients want to be able to opt-out of sharing some or all their health data with providers.

2 - 4 hours

It takes users between 2 - 4 hours to find access to all immunization records.

100%

100% of users have barriers to accessing all of their medical records history.

User Personas

The research & interview insights we got from interview and survey revealed two distinct personas:

The Security Seeker
The Disorganized Time-crunchers

Market Research

We commenced with conducting exploratory research to gain a deeper understanding of the problem context and to analyze how competitor companies have approached the same problem. To gain a more detailed understanding of how patient portals function and what features they offer, we conducted an in-depth analysis of UCLA's Ashe Center portal. By leveraging personal access of our teammate, we were able to conduct comprehensive research on the portal, including its features, user flow, and information architecture.

The matrix indicates that User Information, Medical Records access and Reminders are the standard features in the industry and is expected by users. However, the lack of data privacy control present an opportunity in the market.

Prioritizing Features

We prioritized project features based on their impact and effort, with high impact features increasing data security and accessibility while aligning with persona goals. Our team voted on must-have features that effectively solved project goals, given time constraints and informed by competitive analysis and personas.

Selected features & flows

1.Health Dashboard
2.Display Medical Records
3.Access Control: users grant/deny providers with access to their data
4.Quick Access to Important Medical Information
5.Refill Prescriptions

Initial Sketches

I created initial sketches to explore various design ideas for displaying the different categories and services offered by the shoptaki universal patient portal in a user-friendly and intuitive manner.

MVP flow 1

Quick Review Medical Records (Immunization)

MVP flow 2

Data Privacy Setting

MVP flow 3

Refill prescriptions

MVP flow 4

Check Health Cards

Testing the MVP

In the process of usability testing, a cohort of 5 users was selected to evaluate the mid-fidelity wireframe created on Figma. Based on the results, it was apparent that the new concept app may be confusing for new users. Their reactions were closely observed during testing and feedback was obtained through interviews conducted post-testing.

Usability Testing Result

1. Health Dashboard (Medical Home Page)

  • It was discovered that 4 out of 5 users were unaware that the "My Medical" feature actually served as a "Quick Access" tool. Consequently, they did not see the need to edit it.

2. Grant or deny providers access

  • Repeated “Update Access” button is visually overwhelming and redundant to users.
  • Users do not have a way to tell if the listed medical providers already has access to their records.

3. Reminders

  • 3 out of 5 participants found the current reminder layout to be too cluttered and overwhelming when there are multiple reminders/events scheduled.

4. Confirming Change in Data Privacy

  • 3 out of 5 Users clicked on “Remove access to medical records” instead of “Update Access'“ button. (Lack of font hierarchy)

Dashboard

Control Medical Data Privacy

Refill Prescriptions

Style guide

I kept the colors simple and chose a modern, variable sans-serif font that is easy to read on all screens. I kept layouts consistent by using a 4-column, 8px grid.

Component library

After setting up color and text styles in Figma, I started to build a component library to maintain consistency across the designs. Components were setup using auto layout to make sure they are scalable across different screen sizes.

Outcomes

When I started working on this project, I knew very little about blockchain technology and there were few reference applications to draw from. This made me feel somewhat overwhelmed, but in meetings with the CEO and colleagues, we focused heavily on understanding user pain points and clarifying design goals. This helped ensure that we had clear objectives and plans in place as we moved the project forward, and allowed us to stay focused on key issues and solutions.

Throughout the project, I came to understand that putting user needs and business goals first is essential for a design solution to succeed. That's why we were constantly attentive to user pain points and solutions throughout the entire project, doing everything we could to ensure that our UX solution would effectively meet those needs. This approach not only helped us complete the project efficiently and orderly, but also ensured that the final UX solution would deliver real benefits for users and the business.