The ultimate goal of a clinical support tool (checklist, cognitive aid, etc.) is to improve care by making useful information available at critical moments requiring communication, action, and/or decision making.
Many factors determine whether a clinical tool will deliver the intended result (culture, content, process, support, etc.), but to work well, the content must be organized and presented so that it is clear, readable, and easy to follow and use.
A basic understanding of the following principles can help you achieve that goal.
Context
The ideal design solution is crafted intentionally to perform well in a specific set of circumstances
The more a tool fits a situation, the better it works. An effective design balances the unique characteristics of each situation with the variability between situations. Design solutions that are too specific can’t be widely used, but overly generic solutions tend not to work well for anyone.
To apply this principle…
Ask questions and observe people where they work:
Who will use the checklist? What problems do they face?
Will this checklist be used alongside other checklists or procedural instructions?
Will the checklist be used in different rooms (e.g., in a staging area and then the operating room)?
How many people need to see the checklist at a time?
Does information need to be collected (written or entered) on the tool? How and when will that information be used?
Will the checklist become part of a patient’s record? Why?
Use what you learn to guide the solutions you explore. Ask your intended users help you create a solution. Don’t be afraid to create, test, discard, refine, and revisit different approaches until you have a tool that works for specific people when and where they need it.
Hierarchy
The visual weight of each element should match its relative importance
The attention we give to something in our visual field is partly determined by how it looks. How much of our attention any one visual element captures is determined by its size, shape, color, location, value, contrast, etc. Basically, items that are larger or have more contrast tend to capture more attention. Items that are small or have lower contrast tend to capture less attention.
The phrase “visual hierarchy” refers to the relative weighting between items on a page or a screen. Controlling the visual hierarchy is one of the primary ways in which designers create intuitive experiences: we intentionally choose visual characteristics that direct the flow of a person’s attention through information, from most important to least important. You already know how to do this if you’ve ever used a larger font for a title and a smaller font for footnotes.
To apply this principle…
Start by taking a close look at the checklist content:
How many kinds of information are there (time, role, action, etc.)?
What information is most and least important?
How should information be grouped or labeled?
How do you want the user’s attention to move through sections or steps?
Make the flow and importance of your content clear to the reader. The size and weight of text should reflect the relative importance of the information. Group or separate content to help people quickly and intuitively move from one piece of information to the next in the desired sequence.
Don’t interrupt the flow. Your team may worry that someone will skip one particular step and ask that you make those words bigger and bolder. Don’t do it. All content on a checklist should be equally important and essential to the process. By making some words more visually prominent, you make people work harder to see and follow the overall flow.
Color
Use color to convey information
Color can be used to draw or direct attention, to create a mood or set an emotional tone, or to convey specific meaning (e.g., red means stop). Because a checklist is a framework for information, color should primarily be used to carry information.
To apply this principle:
Design your checklist in black in white.
Only add color to serve a specific purpose; e.g., to differentiate between checklists for different surgical procedures, or to identify tasks for specific audiences.
Each color should mean just one thing (e.g., if green is used to help identify tasks for anesthesiologists, green should not be used for anything else).
Think about contrast when using color for content. If there is too little contrast, printed text will be difficult to read. On electronic displays, too little contrast is difficult to read and too much contrast (e.g., bright white text on a black background) can cause fatigue.
Remember:
Using a colored area behind text reduces contrast between the text and the background
Colored text has less contrast than black text.
Typography
Make words easy to see and read
Two things matter: the font you choose, and how you use it.
Most checklist resources recommend a sans serif font for clarity (though a serif font can work well too if chosen thoughtfully and used skillfully). In many cases, it is wise to use a standard, widely available font (e.g., Arial).
How you use the font you choose will determine whether your checklist is navigable, readable, and usable. Differences in font size or style influence the visual hierarchy of the checklist, telling a reader what is most important or applicable, and helping them to distinguish one idea from another.
To apply this principle:
Keep it simple. Use one font if you can; add a second font only if it is needed to distinguish certain types of information.
Make it large enough to be easily read by everyone who needs to read the tool. If people can’t easily read your tool, they won’t use it.
Use font attributes to help readers identify specific types of information and don’t use those attributes to mean anything else; e.g., if italic is used in one portion of a checklist to indicate an optional consideration, italic should not be used anywhere for emphasis.
Don’t vary the typeface arbitrarily.
Tips:
Avoid decorative fonts of any kind (script, handwriting, quirky)
When thinking about text size, consider: What’s the age range of likely users? What is the lowest common light level in the intended location?
Consistency
Be intentionally predictable
Rigorous consistency will help your users quickly make sense of your tool and use it more efficiently. This applies to the language, the structure and placement of content, the color and visual design — every single aspect of the design. Nothing about your design should be a surprise to the reader.
To apply this principle…
Choose and arrange your words thoughtfully
Use parallel constructions (e.g., match “pre-operative” with “post-operative”, “before” with “after”).
Use consistent parts of speech (e.g., begin each action step in a checklist with a verb, as in “put”, “review”, “clean”, “count”).
Use sentence fragments when space is limited, use full sentences when necessary, but don’t mix the two.
Create a master list of the style choices you make (e.g., how will quantities and units be formatted, how will abbreviations be used, etc.)
Create a predictable rhythm with visual elements
On a single page or screen, the arrangement of visual elements should make sense and be feel as though they are part of a pattern:
Use consistent spacing to help readers see chunks of content.
Use consistent labels (style and placement) to help people navigate quickly and find content they seek.
Use graphic elements (box, line, icon, drawing, etc.) sparingly, only when they serve a specific need and context, and use them the same way every time that context occurs.
For sets of checklists, or when a single checklist spans multiple pages or screens:
Use consistent labeling to help people identify individual pages/screens.
Use a consistent visual structure so that people see that different pages/screens are related or belong together (e.g., in a set of crisis checklists, drug doses may always be shown on the upper right side of the screen or page).
We plan to dive into each of these principles in more detail and provide examples. If there’s something you’d like to see, or you have questions, please leave a comment below.