Mychart - Responsive web dashboard design

Mychart
Client

Sunnybrook Health Sciences Centre


Duration

1 year 2 months

Team

Director of Product
Project manager
4 developers

Role

Lead UI/UX design consultant, A challenging project that required not just reworking the interface of the product but a complete redesign including branding and marketing material

Overview

Mychart is a Personal Health Record Network tool that helps users stay connected to their health information like clinical records.

We've seen a big culture shift over the last decade, with the knowledge that once resided only with providers is now on websites and apps promising to change health care and the patient experience. The goal of this project initially was to refresh the tool, but soon we realized that this was a great opportunity for us to build on this and have a complete product with medication and health tracking, appointment bookings and other services. Today the product has grown beyond just Sunnybrook Health Sciences Centre and caters to 63 other hospitals all across Canada.

The Problem

Healthcare technology solutions though sometimes good and try to help users are mostly silo'd and in the long run will not help the consumer.

The silo'd nature of our health systems

The Solution

What we proposed to do with the problem at hand

one experience, one access point

We didnt just want to bridge the gap between the healthcare network but also make self care and secure information sharing for users easier.

personal care and sharing information

The Process

As with every project I started with stakeholder interviews and tried to understand what they were looking to achieve with this project. What I understood from the meeting was that they wanted to redesign the product to bring new life into it and improve the overall experience of the product, they also wanted some marketing material and stationery designed to promote. They knew they had a great base product and were ready to expand internally with new features and tools and externally by bringing together other hospitals, clinics and even physicians making this a primary place for all medical needs of a user.

The plan

the plan

Research

We weren't provided with any reseach or testing budgets, so I would tag along with the customer support team for a few hours and help out patients register with MyChart. Since all the data was private and confidential we were only able to see how users sign up with their consent. I immediately noticed that the registration process was a huge drop off point for most users as we ask them for a PIN to register which must be provided by Sunnybrook. I watched the people joining MyChart and the people who where interested in having this serivice, combined this with just the age and region data from our system I created persona's for MyChart so the team was alined on who our target audience is and how we can best serve them

persona 1 persona 2 persona 3

Next, if we were planning to grow the product and make this a central point for every Sunnybrook patient or user to keep track of their health data and clinical records then, we had to make the signup process as painless as we can.

We considered beyond just the Sunnybrook use case and thought why not let anyone register for the product and use the personal health tracking features like weight, blood pressure, blood sugar, mood, medication tracking and so on, this could help the physicians find any patterns or trends based on your tracking data. If the user wants to add any clinical records to their account all they need to do is call the hospital to obtain a PIN and once entered along with their health card details will find all their clinical records pulled into their account.

The whole process looked something like this

Registration workflow

Once we knew what we wanted to do with the resgistration and how it needs to flow we quickly went into wireframing and prototyping the new registration process.

Registration process wireframes

We tried out this prototype with willing users that were signing for a MyChart account with us. Try out the prototype here

After a bit of back and forth and fine tuning whats absolutely critical information for sign-ups we finalized the registration process and moved onto designing it

Registration process designs

The Kiosk

Having a new registration process wont do much if we do not educate the staff and physicians to communinate the benefits of using the tool and ask the patients to sign up for it. So we created information sheets for the staff and even posters to go around the hospital. We also cannot only rely on the staff to help people register so we built a registration app for the iPad and spread out a few iPad kiosks to boost the registrations

info sheets for staff and posters for hospital
iPad kiosks

The info sheets, kiosks and our regular rounds of helping users sign up in the lobby helped us drive up the sign-ups by 3 times.

The Tool

After a successful launch on the registration process we moved our focus to the rest of the tool. We wanted it to be well organized and so we planned how it will all be set up

MyChart information Architecture

We moved into wireframeing each individual section of the above information architecture and testing it as we go with the the users

main page dashboard wireframe


personal records wireframe


clinical records wireframe

Again, if you missed it the last time around I would urge you to try out the prototype its amazing :) Try out the prototype here

We tested this out with users that had a few mins to spend with us while they were registering with us, never be shy to ask, people are friendly and will help out whenever they can.

The Designs

This project was fun to design as I created a lot of custom icons, illustrations and made sure no detail was missed. Here are designs of some of the pages on the tool

main page dashboard design


personal records design


mood tracker design


clinical records sign up


clinical records design


Lab results full report


Lab result History


Appointments Week view


Recommended reminders


Medication Self documented


Shared with me grid view


Messages Inbox


Services


Resources


onboarding on the app


app screens for personal records and the dashboard


app screens for clinical records and appointments

The Swag

I got a great opportunity to dictate the brand language and I chose to go bold but minimal. following are some of the marketing material I made apart from this we made elevator wraps, roll up banners for events, stationary like buttons and pens and much more

Mychart poster


trifold


billboards

Results

Since the redesign registrations have gone up a lot and we grew from just servicing Sunnybrook to bringing 63 other hospitals and care facilities on board and still growing. We regularly survey the users within the tool and 94% of the surveyed consumers believe that MyChart helps them self-manage their or their family member’s health conditions. We even surveyed physician and 91% of them believe that MyChart improves the patient experience.