Hannah Rusak-Gillrie, Junior Human Factors Engineer, StarFish Medical05.30.19
A user interface (UI) is the communication platform between a system and its user. Its design is imperative as part of the overall user experience. A pretty definitive method for determining the effectiveness of a UI is user compliance, or the percentage of users that end up following the intended workflow of the system without getting lost, confused, or giving up (we’ve all been there).
By following a governing set of design heuristic principles first developed by usability guru Jakob Nielsen, designing a usable UI is not only possible, but pretty straightforward. Here is a quick guide to the 10 usability heuristics for UI Design, which can be applied to both graphical (GUI), and non-graphical UI, as they apply to medical devices.
1. Visibility of System Status
Is it off, or on? Is there something within the UI that tells what state the system is in? No matter what state the system is (or isn’t) in, there should be a clear indication of what it is doing.
2. Match Between the System and Real World
Real-world conventions should be taken into consideration when developing a UI. There are endless examples. A conventional back button points left, whereas a step forward button points right. On both hard and soft keys, it is important to ensure any symbols and colors used are in line with what users subconsciously expect. For example, I’m confident in saying that without telling you explicitly what each of these buttons does, you already have a solid idea:
3. User Control and Freedom
The UI should not feel claustrophobic and should anticipate the presence of human error. This means there should be an escape route for the user—a chance for the user to “Ctrl-Z” their decision and take a step back in the workflow. If a clinician has navigated into settings menu to change the alarm range of an Sp02 sensor, they should be able to revert this change. They should also be able to navigate back to the parent menu if they selected the incorrect parameter. Cycling the device power should not be the solution to escaping a menu, or reverting to a previous selection.
4. Consistency and Standards
Similar to following a brand identity, the UI needs to remain consistent and predictable. The meaning of a symbol indicator should not change between UI states or across a UI system from one device to another. This goes for all design elements: soft keys, descriptors, imagery, colors, etc. Soft keys whose functions are required on different screens throughout the workflow should stay consistent and should not bounce or dance around the screen. For example, if running through a procedure in a GUI, the locations of “ok” or “cancel” should not switch screen locations between steps/screens, as pictured by the illustration below. After selecting “ok” for parameter 1, the user will not completely reassess the screen, and in going to select “ok” for parameter 2, would press cancel, and accidentally push themselves back in the process.
5. Error Prevention
The goal should be to minimize use error—you should have the back button, but you don’t want to need the back button. Through observation and iterative design practice, the UI should be designed to avoid any identified bottlenecks and awkward workflow. If users are consistently getting lost in GUI menus or gripping a handle incorrectly—potentially dangerously—the workflow should be re-investigated for a solution that better aligns with user expectations and needs.
6. Recognition Rather than Recall
A user’s memory should never be solely relied on for compliance. For example, providing a user with a predetermined set of infusion volumes to choose from prompts recognition of the correct volume choice, rather than requiring them to recall directly from memory. If there are instructions or guidelines required within the UI, they should be visible to the user during the course of the task completion. The user should not have to rely on their memory alone, to complete the task successfully.
7. Flexibility and Efficiency of Use
Depending on the target user demographic, there will be a variable range of user abilities and experiences that affect use of the UI. To increase the efficiency at which the GUI can be navigated, it may be pertinent to include flexibility in the way the UI can be maneuvered, and tasks completed. Structuring the system to allow, for example, personalized keyboard shortcuts, could save the more experienced user several steps in their workflow and allow for this user to complete tasks more efficiently.
8. Aesthetic and Minimalist Design
Keep it simple. The UI should only include what it has to, and nothing more.
9. Help Users Recognize, Diagnose, and Recover from Errors
Stay away from “ERR 5892” and instead communicate an error message the user can interpret: “No Cartridge Detected, Check Tray”. An error message should communicate the appropriate level of warning and provide the user with the appropriate level of detail to diagnose and troubleshoot the error or seek the necessary assistance.
10. Help and Documentation
When required, the same logical thinking should be applied to any user help menus, accompanying documentation, training, packaging and labeling, and supplemental videos that are part of the system. The writing style, graphical symbols, and reading level should target the intended user population, providing well-structured, relevant information.
And that’s it! Follow these principles in UI design to develop a friendly, effective user interface. These 10 principles can be used in both a proactive and reactive way to analyze and assess design changes that deliver a better, user-friendly UI.
Hannah Rusak-Gillrie is a Jr. Human Factors Engineering at StarFish Medical. She provides human factors support during all stages of the design process including preliminary human factors analysis, workflow assessments, analogous device reviews, KOL research, critical task identification, and use case development.
By following a governing set of design heuristic principles first developed by usability guru Jakob Nielsen, designing a usable UI is not only possible, but pretty straightforward. Here is a quick guide to the 10 usability heuristics for UI Design, which can be applied to both graphical (GUI), and non-graphical UI, as they apply to medical devices.
1. Visibility of System Status
Is it off, or on? Is there something within the UI that tells what state the system is in? No matter what state the system is (or isn’t) in, there should be a clear indication of what it is doing.
2. Match Between the System and Real World
Real-world conventions should be taken into consideration when developing a UI. There are endless examples. A conventional back button points left, whereas a step forward button points right. On both hard and soft keys, it is important to ensure any symbols and colors used are in line with what users subconsciously expect. For example, I’m confident in saying that without telling you explicitly what each of these buttons does, you already have a solid idea:
3. User Control and Freedom
The UI should not feel claustrophobic and should anticipate the presence of human error. This means there should be an escape route for the user—a chance for the user to “Ctrl-Z” their decision and take a step back in the workflow. If a clinician has navigated into settings menu to change the alarm range of an Sp02 sensor, they should be able to revert this change. They should also be able to navigate back to the parent menu if they selected the incorrect parameter. Cycling the device power should not be the solution to escaping a menu, or reverting to a previous selection.
4. Consistency and Standards
Similar to following a brand identity, the UI needs to remain consistent and predictable. The meaning of a symbol indicator should not change between UI states or across a UI system from one device to another. This goes for all design elements: soft keys, descriptors, imagery, colors, etc. Soft keys whose functions are required on different screens throughout the workflow should stay consistent and should not bounce or dance around the screen. For example, if running through a procedure in a GUI, the locations of “ok” or “cancel” should not switch screen locations between steps/screens, as pictured by the illustration below. After selecting “ok” for parameter 1, the user will not completely reassess the screen, and in going to select “ok” for parameter 2, would press cancel, and accidentally push themselves back in the process.
5. Error Prevention
The goal should be to minimize use error—you should have the back button, but you don’t want to need the back button. Through observation and iterative design practice, the UI should be designed to avoid any identified bottlenecks and awkward workflow. If users are consistently getting lost in GUI menus or gripping a handle incorrectly—potentially dangerously—the workflow should be re-investigated for a solution that better aligns with user expectations and needs.
6. Recognition Rather than Recall
A user’s memory should never be solely relied on for compliance. For example, providing a user with a predetermined set of infusion volumes to choose from prompts recognition of the correct volume choice, rather than requiring them to recall directly from memory. If there are instructions or guidelines required within the UI, they should be visible to the user during the course of the task completion. The user should not have to rely on their memory alone, to complete the task successfully.
7. Flexibility and Efficiency of Use
Depending on the target user demographic, there will be a variable range of user abilities and experiences that affect use of the UI. To increase the efficiency at which the GUI can be navigated, it may be pertinent to include flexibility in the way the UI can be maneuvered, and tasks completed. Structuring the system to allow, for example, personalized keyboard shortcuts, could save the more experienced user several steps in their workflow and allow for this user to complete tasks more efficiently.
8. Aesthetic and Minimalist Design
Keep it simple. The UI should only include what it has to, and nothing more.
9. Help Users Recognize, Diagnose, and Recover from Errors
Stay away from “ERR 5892” and instead communicate an error message the user can interpret: “No Cartridge Detected, Check Tray”. An error message should communicate the appropriate level of warning and provide the user with the appropriate level of detail to diagnose and troubleshoot the error or seek the necessary assistance.
10. Help and Documentation
When required, the same logical thinking should be applied to any user help menus, accompanying documentation, training, packaging and labeling, and supplemental videos that are part of the system. The writing style, graphical symbols, and reading level should target the intended user population, providing well-structured, relevant information.
And that’s it! Follow these principles in UI design to develop a friendly, effective user interface. These 10 principles can be used in both a proactive and reactive way to analyze and assess design changes that deliver a better, user-friendly UI.
Hannah Rusak-Gillrie is a Jr. Human Factors Engineering at StarFish Medical. She provides human factors support during all stages of the design process including preliminary human factors analysis, workflow assessments, analogous device reviews, KOL research, critical task identification, and use case development.