Case studies / Electronic Health Record System (EHR)

Upgrade of a 16-year-old desktop EHR system to a modern web application

Healthcare

Dashboard

SaaS

Data-heavy system

B2B

Duration 1+ year

Our client and we collaborated to create a modern and efficient web application that significantly improved the user experience for healthcare professionals in various fields and made the work of developers much easier

Project Roadmap

Onboarding and Research

Project Roadmap

Onboarding and Research

Collecting Requirements

Estimation

Personas

Customer Journey map

Product map

Wireframes

General layout

Navigation

Basic interaction Principles

First screens

UI Design

Design Language

First screens

Delivery

Changes

Development and testing

Stage 1

Stage 2

Design Review

Changes

Onboarding and Research

The product is 16 years old. During this time, it was created and improved by various experts. Thus, the product was extremely inconsistent and not user friendly. Our task was to make a truly complex product easy to understand, and the development process understandable and simple for the team.

We started by exploring health care. It is a complex topic. We studied the healthcare system in the market and gradually got acquainted with the structure of the existing product. We had also created Personas to understand user needs.

Mateo Fernández, Doctor

I want to feel good about the care I deliver.

My work makes it hard to have a life. It’s hard for me to be a great parent if I also want to be a great physicion and meet all the demands placed on me by my organization due to the amount of time it takes for me to meet them.

Why can’t my EHR work like my iPhone?

When I can be a doctor and not a clerk, I enjoy what I do. I am overwhelmed by administrative burdens from all sides. I have less and less time to spend with my patients.

Tasks

Continue the interview
Exam the patient
Record assessment
Diagnose
Request additional analysis
Prescribe medication

Goals

Be able to elficiently and easily share information about my patients with other providers.
Be able to spend less fime completing administrative or duplicalive tasks that get in the way of patient care, including delegating some of these tasks to practice staff.
Be able to communicate effectively with patients by providing information and directions that they con understand.
Identify and participate in an advanced care team solution so that the practice can improve its management of patients with multiple chronic conditions.
Identify more ways that technology can be used in the practice to save time or improve processes, workflows and tasks.
Become a totally paperless medical practice in the next two years.

Tasks
Goals
Painpoints

Continue the interview
Exam the patient
Record assessment
Diagnose
Request additional analysis
Prescribe medication

Be able to elficiently and easily share information about my patients with other providers.
Be able to spend less fime completing administrative or duplicalive tasks that get in the way of patient care, including delegating some of these tasks to practice staff.
Be able to communicate effectively with patients by providing information and directions that they con understand.
Identify and participate in an advanced care team solution so that the practice can improve its management of patients with multiple chronic conditions.
Identify more ways that technology can be used in the practice to save time or improve processes, workflows and tasks.
Become a totally paperless medical practice in the next two years.

Spend 2-4 hours every day offer work completing EHR tasks, which results in less time for continuing education, family and other non-work-related activities.
The practice cannot keep exam rooms full, because medical assistants must take fime after each visit to complete the post-visit quality reporting tasks required for each patient.
Daily frustrations when interacting with the EHR system, because there are so many clicks required for frequently used workflows, navigation is difficult, and the systems does not organize the data in an efficient way. Examples include:
Incoming CCDA core summaries that contain 30 pages of information and only one paragraph of clinically relevant data that the EHR cannot find.
Alerts are helpful... until they are rot. Alert fatigue is real!
Trying to document information in the EHR during the patient visit, while struggling to find the correct place in the EHR to document the information for quality reporting, distracts from interacting and communicating with patients effectively.
Prior authorization and other payer-imposed roadblocks contribute to inefficient care delivery for both clinicians and patients.

Painpoints

Spend 2-4 hours every day offer work completing EHR tasks, which results in less time for continuing education, family and other non-work-related activities.
The practice cannot keep exam rooms full, because medical assistants must take fime after each visit to complete the post-visit quality reporting tasks required for each patient.
Daily frustrations when interacting with the EHR system, because there are so many clicks required for frequently used workflows, navigation is difficult, and the systems does not organize the data in an efficient way. Examples include:
Incoming CCDA core summaries that contain 30 pages of information and only one paragraph of clinically relevant data that the EHR cannot find.
Alerts are helpful... until they are rot. Alert fatigue is real!
Trying to document information in the EHR during the patient visit, while struggling to find the correct place in the EHR to document the information for quality reporting, distracts from interacting and communicating with patients effectively.
Prior authorization and other payer-imposed roadblocks contribute to inefficient care delivery for both clinicians and patients.

Marisol Martínez, Nurse

“l am always on, thinking and working. And it’s not just that I am always on when I am there… l am on when I get home. It takes hours, sometimes days, to relax after a particularly bad day”.

“It’s like waiting tables when you have five to six patients, going from room to room all day, everyone always needing something. There’s a lot of repetition in tasks I perform”.

“My medication won’t scan… again!”

“What was I doing before I got interrupted? Did I finish all my notes? I regularly end up staying 30 minutes late to finish my charting, but is anyone even reading my documentation?”

Tasks

Modify Legend
Have an inferview with patient: reasons to come, what's wrong, what pains?
Check patients history: laboratory results, etc.
Check vital signs (temperature, etc.)
Send to doctor

Goals

Ensure that all patients receive their medications and other treatments on time.
Educate patients on a healthy lifestyle (medications, nutrition, exercise, durable medical equipment), and observe the patient putting the education into action.
Make sure each patient and family feels like they are getting the core and attention they need.
Organize the day to finish shift on time.
Complete all tasks. Don't leave a lot of extra work for the next shift.
Ensure patients are discharged in a timely manner so that waiting patients can use the beds.
Be able to easily see and communicate each patient's plan of care.

Tasks
Goals
Painpoints

Modify Legend
Have an inferview with patient: reasons to come, what's wrong, what pains?
Check patients history: laboratory results, etc.
Check vital signs (temperature, etc.)
Send to doctor

Ensure that all patients receive their medications and other treatments on time.
Educate patients on a healthy lifestyle (medications, nutrition, exercise, durable medical equipment), and observe the patient putting the education into action.
Make sure each patient and family feels like they are getting the core and attention they need.
Organize the day to finish shift on time.
Complete all tasks. Don't leave a lot of extra work for the next shift.
Ensure patients are discharged in a timely manner so that waiting patients can use the beds.
Be able to easily see and communicate each patient's plan of care.

Staffing shortages can put nurses at greater risk for patient safety issues.
Unable to locate patient records in one place
High percentage of nursing burnout, with nurses leaving the patient care workferce in favor of non-direct patient care types of nursing.
Unable to speak to some patients without interpreter due to language barrier.
Difficulty communicating with healthcere team efficiently so that all primary team members ate kept informed.
Spend a lot of time recording large amounts of information and completing documentation.
Common tasks can be laborious (too much clicking).
The doctor keeps reconciling the meds incorrectly, further lengthening the time required to discharge patients.
Rarely doing one task at a time and constantly interrupted
Nursing staff comes up with workarounds to keep everything and everyone straight.
Often feel the pressure and fatigue from the constant long shifts and don't see an end in sight.
There is no consistency. Other nurses are documenting same information in different areas of the EHR.
Complex tasks are not reflected in workflow, and it feels nurses are an afterthought when using the software/EHR. Tasks done all the time are so hard - so many steps becal
Can't easily see what is missing or what hasn't been done particularly around documentation.

Painpoints

Staffing shortages can put nurses at greater risk for patient safety issues.
Unable to locate patient records in one place
High percentage of nursing burnout, with nurses leaving the patient care workferce in favor of non-direct patient care types of nursing.
Unable to speak to some patients without interpreter due to language barrier.
Difficulty communicating with healthcere team efficiently so that all primary team members ate kept informed.
Spend a lot of time recording large amounts of information and completing documentation.
Common tasks can be laborious (too much clicking).
The doctor keeps reconciling the meds incorrectly, further lengthening the time required to discharge patients.
Rarely doing one task at a time and constantly interrupted
Nursing staff comes up with workarounds to keep everything and everyone straight.
Often feel the pressure and fatigue from the constant long shifts and don't see an end in sight.
There is no consistency. Other nurses are documenting same information in different areas of the EHR.
Complex tasks are not reflected in workflow, and it feels nurses are an afterthought when using the software/EHR. Tasks done all the time are so hard - so many steps becal
Can't easily see what is missing or what hasn't been done particularly around documentation.

Cia Rodriguez, Front Desk

“I am sorry you feel that way. Let me check with the doctor and see what we can do”.

“How can I help you?”

Tasks

Create new patients
Collect documents
Put to waiting list (nurse)
Scan documents, put to the next step (nurse)
Scheduling appointments
Patient communication (complaints)
Working with insurance companies and other industry contacts
Overseeing the supply situation and physical state of the

Goals

Not have patients get upset with or yell at me today
Return patient calls
Don't let the incoming faxes pile up
Get billing notices out
Call copier repair person (need to keep the equipment up and running)
Follow up on denied claims
Leave office on time

Needs

Earn a certificate in an additional set of skills to potentially advance career
Save enough money to retire at age 68 without too much worry
Keep the practice running smoothly through transitions of clinical staff

Tasks
Goals
Needs
Painpoints

Create new patients
Collect documents
Put to waiting list (nurse)
Scan documents, put to the next step (nurse)
Scheduling appointments
Patient communication (complaints)
Working with insurance companies and other industry contacts
Overseeing the supply situation and physical state of the

Not have patients get upset with or yell at me today
Return patient calls
Don't let the incoming faxes pile up
Get billing notices out
Call copier repair person (need to keep the equipment up and running)
Follow up on denied claims
Leave office on time

Earn a certificate in an additional set of skills to potentially advance career
Save enough money to retire at age 68 without too much worry
Keep the practice running smoothly through transitions of clinical staff

Low pay - need a raise.
Patients don't pay their bills on time and expect me to be able to reduce their bill.
The physicians do net listen to my ideas or treat me as a skilled team member.
System is slow; I have to keep telling people on the phone to pause.
I am asked to do things that other team members should bedoing. Doctors ask me to look up diagnosis codes; but I am neither a doctor nor a coder.
Insurance companies always deny claims in September and October.
The fonts on my screens are extremely hard to read,
I don't know how to get useful information and have to rely on others to get it for me.

Painpoints

Low pay - need a raise.
Patients don't pay their bills on time and expect me to be able to reduce their bill.
The physicians do net listen to my ideas or treat me as a skilled team member.
System is slow; I have to keep telling people on the phone to pause.
I am asked to do things that other team members should bedoing. Doctors ask me to look up diagnosis codes; but I am neither a doctor nor a coder.
Insurance companies always deny claims in September and October.
The fonts on my screens are extremely hard to read,
I don't know how to get useful information and have to rely on others to get it for me.

Product Map

After that, we made the first attempt to create a product map. This attempt crashed. The product was too complex and we decided to work on the product map step by step.

Wireframes

We immediately took up the most difficult part of the product — the patient card. This is a complex module. There was the first and main challenge — navigation.

Navigation was supposed to be flexible, capable of theoretically accommodating an unlimited number of items.

We created the ability to search for an item in the navigation list, and also added the ability to customize this navigation. The reason for that is due to the fact that different hospitals may use different modules in the patient card.

UI Design

When creating the UI, we relied on Fuse - Angular 8+ Material Design since this style was most suitable for the task that we faced with, namely, an understandable, unloaded style.

Full Design System Case

How we created the Design System

When developing a design system, we looked at the best examples for creating an optimal design system for this product. The best example for this project was the Atlassian design system.

Research

Created a dictionary, rules for naming entities in the system

Setup a Confluence space

Created a team

Created rules for supporting versioning of the system

Setup a library

Basics (B00.00)

Bases are the simplest entities. The whole system consists of them. These are the bricks in the construction of the system. Font styles, colors, icons are all examples of bases.

Fonts

Colors

Primary

@RedBrand

#cf152d

#00a1de

@Cyan

#00a1de

rgb(0, 161, 222)

Shades of Gray

Elements (E00.00)

Elements are simple entities, they consist of bases. Not independent and often found in different cases and modules. They do not carry the semantic load by themselves. Are more technical entities.

Components (C00.00)

Components are intermediate entities between patterns and elements. If you divide the pattern into entities, you get a component.

If you combine elements into some entity, but it is not completely independent, as a pattern, it is a component.

As a result

Consistent design

We have overcome the challenge of coherency in a huge product. We have created patterns, components, elements and bases from which everything is built.

Intuitive interface

We have created a very comprehensive product that is easy to use because of simple, but flexible navigation.

Wokrload optimization

We have increased the efficiency of user interaction with the EHR and freed up time for doctors to work with real patients.

Happy client
is our routine

We reached Angle2 for help with designing a new UI meant to replace our outdated software design. We not only got a new user interface, but a vastly re-thought and optimized user experience. Angle2 has become our "go-to" agency for our design needs and I highly recommend them.

Ricardo Pineda NeoDeck Holding

Project Team

https://angle2.agency/wp-content/uploads/1-2.jpg

Yevheniia Klysha

Lead UX Designer

https://angle2.agency/wp-content/uploads/2-6.jpg

Olesya Vdovenko

Senior UX Designer

https://angle2.agency/wp-content/uploads/3-4.jpg

Nina Prisniak

Art Director

https://angle2.agency/wp-content/uploads/4-1.jpg

Igor Alexandroff

UI designer

https://angle2.agency/wp-content/uploads/5-2.jpg

Eugeniya Zhuravlyova

UI Designer

https://angle2.agency/wp-content/uploads/6.jpg

Alex Smurov

Lead UI designer

https://angle2.agency/wp-content/uploads/7.jpg

Kristina Manzhaliy

Project Manager

We're
all ears

Fill out the form to start the conversation — we’ll get right back to you

Amazing!

Thank you so much!

See you soon

Upgrade of a 16-year-old desktop EHR system to a modern web application

Table of Contents

Project Roadmap

Onboarding and Research

Product Map

Wireframes

UI Design

How we created the Design System

Basics (B00.00)

Elements (E00.00)

Components (C00.00)

As a result

Happy client is our routine

Project Team

We're all ears

Let’s talk!

Happy client
is our routine

We're
all ears