Making Medical Device Interfaces More User-Friendly

Medical Device & Diagnostic Industry Magazine
MDDI Article Index

An MD&DI May 1998 Column

HUMAN FACTORS

Ten design tips for enhancing user interfaces and improving medical device usability.

It is not altogether uncommon for medical device companies to spend several months developing a preliminary user-interface design only to be dissatisfied with the result. Such firms can come to regard a product's user interface as its Achilles' heel, especially in cases where their competition has already brought a more user-friendly product to market. As a result, manufacturers may seek an objective third party such as a usability or human factors engineer, graphic designer, or marketing professional to enhance their product's usability and appeal without a major overhaul, given their schedule and budget limitations.

And it can be done. User-interface designs such as those associated with patient monitors, ventilators, blood chemistry analyzers, infusion pumps, and kidney dialysis machines often have superficial design problems that can negatively affect a device's usability and appeal but that are relatively easy to remedy. The following 10 solutions address such design issues.

Reduce Screen Density

A lot of medical device displays look overstuffed with information and controls so that very little empty space remains. Such space is important in a user interface, because it helps to separate information into related groups and provides a resting place for the user's eye. Overly dense-looking user interfaces can be initially intimidating to nurses, technicians, and physicians, making it difficult for them to pick out specific information at a glance. For such reasons, what the design engineer does not put on the screen can be as important as what he or she does put on it. To eliminate extraneous information, the user-interface designer can:

Provide Navigation Cues and Options

Moving from one place to another in a medical device user interface, a navigator can sometimes become lost, much like someone traveling in an unfamiliar city that lacks road signs or has signs printed in a foreign language. Sometimes the problem results from the user's not knowing where he or she is in the user-interface structure.

For example, the end-user's goal may be to set the alarm limits associated with a monitored parameter such as arterial blood pressure, but instead he or she becomes lost in a complex hierarchy of setup options ranging from respiratory monitoring to reporting. At other times, the user may not understand how to move vertically or laterally within a structure because the methods of control are not apparent. A nurse, for example, may find the way to an alarm setup screen but not recognize how to go back a step or leave the screen after making alarm-limit adjustments.

Placing meaningful titles on every screen and subcomponent (e.g., message boxes and major elements) by means of a header—a contrasting horizontal bar that includes text—is helpful. Numbering the pages of an electronic document can also benefit the reader. For example, each page of an eight-page medical document could be marked "page 1 of 8," "page 2 of 8," and so on, for clarity.

Navigation options and controls, such as "Go to main menu," "Go back," "Previous," "Next," and "Help," should be grouped together in a single, consistent location so that users can easily return to a previous screen or undo an action without fear of getting lost or causing irreparable harm.

Ascribe to a Grid

Some medical device screens look like a checkerboard after it has been bumped—pieces all over the place instead of in an ordered arrangement. In rare instances, such disorderly looking screens may actually appear stylish or refreshingly informal. However, most screens look and work better when they serve a utilitarian purpose and when their screen elements are aligned.

Aligned elements seem less complex because they merge into a single, related set. Moreover, the human eye can generally find information more quickly when scanning a straight path rather than an irregular or discontinuous one. For this reason, experienced graphic artists tend to left-justify text instead of centering it. Centered text creates a riverbank effect that makes the eye work harder to locate where the next line of text begins (Figure 1).

Figure 1. Effect of text justification on readability.

Making the effort to fit on-screen elements into a grid will pay off in terms of visual appeal and perceived simplicity. Grid-based screens also tend to be easier to implement in computer code because the position of visual elements is predictable. Fitting these elements into a grid is fairly simple if the designer is working from scratch. However, converting an existing design that has no underlying grid structure into a more orderly arrangement is a bit more work.

When developing a grid structure, it helps to begin by defining the screen's dominant components and approximate space requirements. For example, one may choose to allot space for a title bar, menu area, body of content, and a prompt by dividing the screen vertically into four bands that are 1/16, 2/16, 12/16, and 1/16 the height of the screen, respectively. Similarly, one may want to divide the variable content area into field labels and data-input fields by sectioning the screen horizontally into bands that are 1/3 and 2/3 the width of the screen, respectively, with the wider vertical band being subdivided into three additional bands to provide for different-width fields. The visual appeal of such a grid is shown by folding a piece of paper and looking at the fold lines, or by drawing the layout using rectangles on a computer screen (Figure 2).

Figure 2. An on-screen grid system made of rectangles facilitates composition.

Keeping on-screen elements at a fixed distance (e.g., 10 pixels) from the grid lines can also provide visual appeal. In doing so, the designer creates margins around the grid lines. The resulting space (i.e., empty column) is a demarcation component that implies the grid and eliminates the need for actual grid lines that would add visual complexity to the overall composition. Taking things a step further, the margin width may also be used as a guide for spacing other composition elements, such as an ultrasound image and its caption.

Create Visual Balance

Visual balance or symmetry should be created, especially about the vertical axis. Visual elements should be arranged on either side of an assumed axis, so that each side has about the same amount of content as empty space. Such a balanced composition, whether it be an entire screen or a subcomponent (e.g., a message box), looks simple and whole—elements neither appear askew, nor seem to be missing. It is worth noting, however, that perfect symmetry may appear tedious, so one can be comfortable with the slight imbalances that are virtually inevitable.

Various methods can be employed to evaluate a composition's balance. Some people can judge balance at a glance, while others may want to squint at the on-screen composition or even use a highlighter pen on a screen printout to block out areas of content or empty space. Perceived imbalances may be remedied by reorganizing information, adjusting the gaps between labels and fields, relocating elements to other screens, or popping up elements only on request.

Limit the Number of Colors

Experienced designers suggest limiting the color palette of a user interface. The background and major on-screen components should be kept to between three and five colors including shades of gray, while one-of-a-kind and small-scale elements may feature additional hues. For the same reasons that an interior decorator chooses a color scheme for a room—a few harmonious colors that repeat themselves in the wallpaper, carpet, and couch upholstery, for example—a designer should select just a few congruous hues for the user interface.

A user-interface designer should also select colors carefully to be sure they are consistent with medical conventions. For example, red is commonly used to depict alarm information or to communicate arterial blood pressure values, and various secondary colors are associated with certain drugs and gases.

Simplify Typography

An efficient user interface is based on typographical rules that steer end-users toward the most important information first and make screen content easy to read. To achieve these results, a user-interface designer generally commits to a single font and just a few character sizes such as 12-, 18-, and 24-point type (Figure 3). While characters should vary in size, the sizes must not be so disparate as to create a tense visual contrast.

Figure 3. Hierarchy of font sizes.

Another way to simplify typography is by eliminating excessive highlighting such as underlining, bolding, and italicizing. Because today's computer tools make it easy to highlight text in these ways, overuse can result. Usually, a single method such as bolding is enough to highlight information effectively when used in concert with different font sizes and extra line spaces.

Use Hierarchical Labels

Redundant labeling leads to congested screens that take a long time to scan. For instance, unnecessary indicators on a typical patient monitor—a unit that provides a summary of alarm limits associated with such patient parameters as heart rate and blood pressure—could be time-consuming and thus problematic for healthcare professionals. Excess visual congestion can make it difficult for users to pick out even the most salient details. However, hierarchical labeling can save space and speed scanning by displaying such items as heart rate, respiratory rate, pulmonary arterial pressure, and arterial blood pressure more efficiently (Figure 4).

Figure 4. Redundant labeling on a typical patient monitor (left) can be time-consuming and problematic for health-care professionals to read. Instead, hierarchical labeling (right) can be used to save space and to speed scanning.

Use Simple Language

Medical device user interfaces are often characterized by overly complex words and phrases. Despite the fact that medical workers consistently state a preference for simple language, product designers often write in a technical manner that can be less than user-friendly. Today's designers are well advised to simplify their communications not only for health-care professionals but for the increasing number of patients and caretakers using devices at home who may not have extensive education or training.

User-interface designers should ask themselves this question: "How should this text be worded so that a bright youngster between 10 and 12 years old would understand it?" This question usually provokes ideas on how to word things more simply without dumbing down the user interface. Specific corrective measures include writing shorter sentences (1/2–2 lines) and paragraphs (2–3 sentences), breaking complex procedures into ordered steps, using meaningful headings and subheadings, and using consistent syntax.

Refine and Harmonize Icons

Lately, a lot of medical devices, particularly those employing relatively large displays with high resolution (i.e., VGA or better), are presenting functional options—actions such as calibrating a device, setting alarms, or reading the user guide—in the form of icons. This shift within the medical industry to an iconographic user-interface style matches trends in the consumer and business software arenas.

Unfortunately, medical device manufacturers may find it difficult to match the major software developers in terms of their investment in icon quality. The icons that appear in most consumer and business applications are highly refined and tested by such firms as Microsoft, Apple, and Oracle, all of which employ usability engineering and graphic design professionals. Relatively speaking, a medical device company will have less time, money, and perhaps design talent to devote to icon design.

Medical device manufacturers should be aware, however, that a limited investment in icon quality may produce a disproportionately large payoff, provided that talented designers are involved and icon testing is performed. The following steps can be taken to maximize icon comprehension and give the icons a family resemblance to each other:

Eliminate Inconsistencies

Design inconsistencies are especially toxic to user-interface appeal and usability and, for some medical devices, may compromise safety. For example, end-users may be confused or, at the very least, annoyed by the use of the color red to communicate both critical and noncritical data. Similarly, the use of different words like enter, select, continue, and OK to communicate the same basic function may confuse the end-user.

To prevent such design inconsistencies, a style guide should be created and maintained. Standard graphical user-interface (GUI) guides like Microsoft's User Interface Design Guidelines for Windows 95 are useful prototypes for style guides that are specific to medical devices. The reference does not have to start out as a refined document, but rather as an organized collection of notes and rules that ensure consistent design practice at the project's early stages. As a function of analyses and testing, the user-interface design eventually becomes more refined and the style guide is updated accordingly. Ultimately, the style guide can be integrated into final design specifications.

CONCLUSION

The success of most medical devices is closely linked to user-interface quality. This is particularly true in cases where there is substantial market competition and the associated technology has more or less matured, making user-interface quality a prominent factor in product differentiation. The safety of most medical devices is also closely linked to user-interface quality, because design shortcomings may lead directly or indirectly to use errors, with severe consequences that can include patient injury and death.

Medical device user-interface designers must aspire to excellence. Yet, experienced designers recognize that there is no such thing as a perfect user interface. Imperfections arise from many sources, including technological limitations, incomplete understanding of user needs, and aesthetic decisions that may not match everyone's preferences. As a result, designers must aim for an optimal rather than a perfect user interface. Looking beyond core design attributes such as a cohesive conceptual model, total user-interface quality is found in the details—the superficial elements like navigation cues that, when used most appropriately, can help to create a more user-friendly design. To this end, the aforementioned detoxification methods should enhance almost any medical device user interface in the works.

Michael E. Wiklund is a usability engineering consultant with the American Institutes for Research (Concord, MA).

Copyright ©1998 Medical Device & Diagnostic Industry