Win-Loss Graphs: Method for displaying lab panels concisely

How do we balance thoroughness and conciseness when displaying lab results? Some clinicians prefer viewing the selected results most likely to be actionable. Some prefer to see all results all the time. Are there approaches that meet both needs? Let’s try to display all abnormal results concisely while revealing that other results are in the normal range without necessarily showing the numbers in a tabular field. 

Win-Loss graphs show deviation from expected range

We can represent all elements of a CMP (comprehensive metabolic panel) in a bar graph called a win-loss graph. Upward bars for win-loss graphs in a sports setting typically represent a win, while downward bars represent a loss. In our clinical setting, we let upward bars represent abnormal high values while downward bars abnormal low values. Critical values can be rendered with more intense color or longer bars, or both.

 BMP (basic metabolic panel)

Here’s a win-loss graph for a normal BMP result. The individual test names are shown. The vertical dividers separate the functional elements of the graph sections: electrolytes | renal function | other.

Normal BMP win-loss graph

CMP (comprehensive metabolic panel)

Here are win-loss graphs for a CMP with and without the labels for individual test names. The functional elements can be described as: electrolytes | renal function | other | proteins | liver function.

Patterns of abnormality

Patterns often reveal clues to disease. Here, the graphical patterns reveal abnormality without displaying discrete numeric results. This is of most benefit when the results are normal, the trends of change are not significant, and the numeric details are readily available with low effort. 

Here are a few examples. 

The win-loss graph does not display time trends well, but does give a “sparkline” (word-sized graphic) snapshot of a lab panel at a single point in time. There will be some learning involved to recall the location of each individual test, but the vertical separators make that easier. Alternatively, displaying the lab test names takes up very little additional space. 

When designing dashboard displays of various clinical parameters for a single encounter (clinic visit or daily hospital visit), the win-loss graph can concisely display that abnormal values in a lab panel (such as BMP, CMP, or CBC) exist, while confirming the normality of all the other individual elements of the lab panel.

Sketching bad ideas for medication timelines

Sketching timelines

I first started thinking about graphical timelines when our team at University Missouri was working with our electronic health record vendor, Cerner, on a timeline for microbiology results (blood cultures and urine cultures). It was challenging to design timelines that were concise, intuitive, and effective.

A medication timeline will be far more helpful to me as a family physician, since I often struggle to understand a patient's medication history over the preceding years. it is difficult to find out when the medication was started or stopped, when it was was changed, and whether a medication had been tried in the past.

Fail early, fail often

I made a number of failed pencil sketches that I've shown here that were ineffective at handling the cognitive challenge.

In the sketches, I explored using the height of the graph to display the dose, but none of the ideas really worked, mostly because they did not scale when the dose range could vary 16-fold or more. The dose of lisinopril can range from 2.5 mg to 80 mg daily, for instance.

Inspired by flight search

Then one day I was inspired by the beautiful and elegant visual design used by the flight search engine, Hipmunk. I immediately imagined an intuitive way to display a medication timeline.

In the process of making this online book, Inspired EHRs: Designing for Clinicians available freely online at inspiredEHRs.org, our design team had internal arguments about whether to make the timelines different hues of color, or whether to vary the line width of the bars. I think we made the right decision ultimately. By sticking with grayscale, we can then temporarily paint certain line categories different colors to give them visual meaning. For instance, all the hypertension drugs could be colored orange temporarily, to help the user see when the hypertension drug changes occurred.

Take the medication timeline for a spin 

You'll find it here. See if it's intuitive you, or if there are some ways it could be improved. Let us know if you have feedback at inspiredEHRs.org/feedback. If you're aware of any EHR that is using a medication timeline, let us know at inspiredEHRs.org/feedback.

Medication Name Basics: Making it safer with Smart Design

Making a list of your medications should be a simple endeavor, but it isn't. 

There are so many ways it can go wrong. If it's in your own handwriting, you're off to a good start for your own private purposes, but that same simple elegance can fail when the list tries to support a conversation with someone else like your physician, your spouse, or a care-giver.

You might not want to write "hydrochlorothiazide" and are content to write "BP med", when your only other medication is ibuprofen (non-prescription) and omeprazole (non-prescription). But once you join the aging elders gang, then the task is more daunting. You might have 3 "BP meds", and the doses keep changing, and the names aren't always easier to pronounce or spell.

Danger lurks!!

Good news, though. We can make these lists safer with "Smart Design". What I mean by smart design includes the following features:

• accurate
• readable
• scannable
• safe
• contains everything you need, and nothing more
• Done with good "graphic design principles" using:
• contrast
• repetition
• alignment
• proximity
• Done with good "cognitive science principles" that account for how we:
• see
• read
• think
• focus attention
• remember
• decide
• Done with good "data visualization principles"(when interactive) that foster exploration for meaning:
• overview first
• then zoom and filter
• then drill for details on demand

Here's a simple example with explanation as we go along.

Let's start with 1 medication today. We'll show the name of the medication, how to take it, and explain why the design details matter for understanding and safety.

That seems simple. Here's how it's not, and how I'd make it better. 

The name should be bold.

... and bigger. It's the name that the eye is scanning for. 

By making it larger and darker, the eye moves there in an instant. 

[footnote 1: more about that at Ware. Visual Thinking for Design]

Make the dosage (tablet size) bigger, since it belongs to the name. Leave the Instructions the same size.

In fact, let's subdue the instructions  since that is secondary information, and not what the eye is scanning for. It's a detail for later.

By subduing the instructions with softer gray text, it allows the eye to scan for "the main thing" by reducing visual noise. We like the original Google search page because it eliminated visual noise. 

Now we need to add something that's missing.

A lot of doctors and nurses will just jot down the abbreviation, or the medication bottle label will truncate it God-knows-where.

So,

add the common alternative names

for your region of the world. Keep them subdued though. They are not the main event. Some names are easy to spell, but still hard to pronounce. 

The alternative names should be near the main name, not far to the right, and not competing visually with the main name.

How should the "main name" be chosen?

I think it should be the same as the name on the medication bottle. If we all try (prescribers, pharmacists, nurses, patients and families), we can use the same name all the time to reduce confusion. Use the nicknames when you and your conversation partners choose to. I don't mind using the brand name "Lasix" instead of "furosemide" when it makes conversation easier. We all need to have a shared understanding that "furosemide" will be the "main name" when it's written down on lists and labels.

In the next post, I'll show a short list of 4 medications  and what additional features you need with a simple printed list suitable for your wallet.

• metformin
• hydrochlorothiazide
• lisinopril 
• metoprolol

Delightful Demo of Medication Reconciliation Prototype

Our colleagues at the University of Maryland Human-Computer Interaction Lab have produced a dramatically effective prototype for medication reconciliation. It is amazingly effective, and gets better with each revision (I'm aware of three versions).

What is medication reconciliation?

That's when a healthcare provider has to compare two versions of your medication list. Say you go see your physician, who gives you a printed copy of your medication list as it was the last time you visited them. Now, you compare it to your personal list (or sack of bottles) of medicine. Do they match? If not, what's missing, what's extra, or what has changed?

If you think that sounds easy, you might think otherwise if you happen to be taking a dozen different medications. It's not that far fetched if you have the big 4 (diabetes, high blood pressure, high cholesterol, and obesity), and then toss in a couple more problems (depression, arthritis, sexual disorders). It's easy to rack up 1-3 medicines per problem.

Watch this short video to see what reconciliation involves. Dr. Catherine Plaisant narrates.

What's the big deal?

When I show this to physicians and nurses who have to do this job manually every day, they are amazed and impressed, and they want it NOW in their own electronic health record software!

Here are some features that make it so effective:

• Animation: The logic becomes transparent
• Proximity: Like items merge, unlike items move farther apart
• Alignment: Columns convey meaning, and condensing adds visual efficiency
• Color: Meaningfully employed. Green is ready to go, gray is retired to the sidelines.
• Cognitive effort reduced: Software does the matching, rearranging and condensing, then proposes "near matches" for human adjudication.
• Highlight differences: The text that doesn't match in two items is highlighted, adding efficiency, accuracy, and safety.

Dashboards - Quality Performance at the Point of Care

I used to get quality reports once a year, then once a quarter. They were long, opaque, boring, and too detailed to digest. I was usually looking at them when I was too tired (at the end of a long day) and away from the battlefield. As a result, nothing much changed.

So, our team decided to provide "just in time" quality feedback to physicians at the point of care, and only for diabetes, and only for 8 quality indicators (there are dozens competing for my attention). The hope was that by giving feedback as the physician was about to see the patient, then she could take action and address the issues of concern. Here's what we built:

Fig 1. Diabetes Dashboard

Here's a closer view of just the bottom of the dashboard showing the Quality Performance Indicators (back then, the Medicare Quality Program was called "PQRI"):

Fig. 2 The "quality panel" of the Diabetes Dashboard

I call the little red, gray, and white circles "idiot lights". A more socially acceptable term is "traffic lights". They alert the physician to the actionable items for the task at hand: "Change the medications or diet to lower the blood sugar, order the cholesterol tests and annual urine micro-albumin test, and send the patient to the eye doctor."

Does this approach work?
Yes and no.

It is much easier to see what needs to be done. The effort to navigate around to find these 8 items used to take 60 clicks and about 6 minutes to find all 8 measures in our EHR. With the dashboard, it takes 6 clicks and a minute or two. That's a huge gain in efficiency and reduction in cognitive load. It's also safer and more accurate, because, frankly, most physicians would stop looking for that last item or two (the foot exam and eye exam are hardest to find) before wasting the the whole 6 minutes.

Do physicians improve their quality scores by making this more available?
Not necessarily. It's not a required view, and it's on page 2. If my nurse prints it out, circles the items needing attention, and thrusts it in my face (we are a finely-tuned team), then things happen. Otherwise, the 15 other details may get in the way. Information helps, but system processes need to change to get results.

Can't you just include a picture of my pill?

I've been involved in numerous conversations about medication lists that our healthcare organizations give to patients, and meaningful use rules require the lists. I used to think it was a hopeless cause to get the picture of the pill your pharmacist gave you at your last refill into your personal medication list.

I am not so hopeless, but I remain sanguine. The incentives aren't aligned yet among all the stakeholders. The data doesn't flow freely. It's a rare patient that would use their smartphone to photograph their pills (good lighting and backgrounds are hard!) to include them in their Personal Health Record (PHR), if they are one of the rare people who maintain a PHR.

So, to give you a taste of the challenges, here is a short video showing the different colors and shapes of one single generically available pill: lisinopril. I captured it from ePocrates, which is a wonderful tool for providers.



If it's a brand name drug (for example, Crestor), getting a picture is far easier.



There is a code called the NDC code that tells the pharmacist which exact generic version of your lisinopril you are taking, but your doctor doesn't know (or care, generally) which NDC code is your particular lisinopril. But as we (patients, nurses, doctors, and pharmacists) start coming to expect the pill pictures as part of our conversations, then the NDC code sharing will become more important.

It's in our future, but not our present.

Why dashboards?

Dashboard views should be the rule rather than the exception in EHR design
Physicians and nurses have to deal with complex data involving a number of realms, making quick judgments based on the overview of the patient's story.

Dashboards beat nested navigation in several ways:

1. They minimize navigation.
2. They reduce cognitive load by presenting the needed information in a single view. 
1. Users don't have to think "What next? Where next? 
2. Users don't have to use visual memory to recall the last page view: "What was that potassium value I saw seconds ago? Was that drug dose once a day or twice day?"
3. Users can "scan the scene" to quickly see if there are any abnormals. If the view is "clean", then we can move on.
3. They accommodate a variety of workflow styles. Methodical  or meandering paths work equally well when only the eye (and not the finger) does the walking. ABCDE sequence is as easy as AEDCB.
4. They can be customized or personalized to meet unique user needs.

There are some caveats.

1. Provide only the information needed for the tasks at hand. No more, and no less. That may mean leaving out detail from the grand view, while making that detail available when drilling down.
2. Use visual cues. They don't have to be words. They do need to be recognizable at a glance. Think icons and traffic lights. 
3. Try the designs out on real world users.

Medications List - Visual Design Make-over

Some rights reserved by CarbonNYC

I'm reading "Designing with the Mind in Mind: Simple Guide to Understanding User Interface Design Rules" by Jeff Johnson. As a typography/layout and design geek, some things are obvious to me, but Jeff Johnson reminds me they are not obvious to everyone. He even makes explicit the cognitive psychology behind the "design rules" that have been gospel to designers.

I'll give his teaching a test drive here, starting with a design from a typical EHR.

Design Make-over - Step by Step