Every year 3 million babies die in the first month of life. 98% of deaths occur in developing countries like Uganda, where infant wards (NICUs) are severely understaffed.
Our clients, Teresa Cauvel and Sona Shah, created a 4-in-1 vital sign monitor that tracks infant pulse, respiration, temperature, and blood oxygen levels, with one inexpensive, lightweight device.
UI Designer, UX Designer, Interaction Designer, Project Manager
Sketch, Principle, InVision, Illustrator, Photoshop
4 Weeks
Our challenge was to create an attractive, functional tablet interface for an existing UX prototype being tested in Uganda.
Since none of us were either SMEs or Africans, we relied on domain research to get an understanding of the space and categorized project goals by user type. We immediately noticed some competing interests/needs.
To put our NICU domain knowledge into context, we conducted a competitive analysis. We researched 5 prominent devices and sorted the key characteristics of their UIs. I was struck by two commonalities among competitor UIs, that offered improvement opportunities:
No monitor looked particularly modern or sleek. We understood this wasn’t an indication that nurses didn't want modern looking interfaces so much as accuracy, customization, and readability.
Jewel Tones on Dark Backgrounds
Skumorphic Elements
Monochromatic Card Outlines
In many instances, color was the only visual indication for nurses (aside from the number itself) that a baby’s vital reading was critical.
In order for the nurse to notice the change from 81 to 85 quickly, she would need to remember state 1 because only color is being used to show the change.
With a better idea of what alternatives existed in the market, our team created a set of design principles to guide our process, and justify design decisions:
The design solution should synthesize data prior to a nurse’s first interaction. The most important information should always be prominently displayed. Unlike a pyramid we’ll show the most fundamental information up top.
Nurses need to put the specific information into a broader context to spot patterns that the platform can’t. A good nurse can and should be able to quickly access additional information to contextualize what she’s seeing in real time.
Previous testing showed ease of use is very important to nurses. Familiar patterns, readable type and intuitive buttons are a must. The design should fit into a user’s life without extensive training or undue complexity.
Research showed most users were overworked, fatigued and underpaid. Meet Abbo, a persona we came up with while thinking through nurse's biggest challenges. She's a NICU nurse in Uganda who works at the local hospital because she recognizes her community has a need for more people with her skillset. Her hospital only has the budget to hire her and one part-time junior assistant. They’re in charge of watching over 20 babies, and have to provide life saving care around the clock.
In evaluating the prototype, my team and I carefully considered both the limitations of a four- week timeframe and the feasibility of correctly identifying problems we deemed most pertinent to Ugandan nurses like Abbo.
Abbo’s hospital has an understaffing problem - so it's safe to assume Abbo and her assistant are undertaking more tasks than they’d ordinarily be able to complete in a day. We theorized the dashboard can do more to give Abbo a feeling of full control/visibility without overwhelming her.
We realized the current dashboard wasn’t doing enough to help nurses triage the alarms in high stress situations. The dashboard should be offering Abbo some indication of which alarming vital was most important, and display information in accordance with a defined hierarchy.
We had a total of 12 directions to test with a group of SMEs given to us by Teresa and Sona. Devising a system to reduce bias and get the best possible information was a bit tricky. I used a UX technique called “Triading”, in which users are asked to rank order a large set of choices by comparing just 3 items at a time instead of considering the entire set at once. The benefit of using this method are that users can more easily share insights and gut reactions with a smaller cognitive load.
In each group, we asked users to pick the favorite and least favorite and explain why - referring to how usable, readable, or logical each layout/schema was. The interviews revealed a couple of interesting takeaways:
Users revealed that the lack of color in medical apps was frustrating and noted, “Africans prefer color." Almost unanimously, among the example group pictured above, users preferred the middle tile because its vibrant colors stood out against alternatives.
Icons were not well received during desirability testing. A majority of users saw icons as ambiguous, confusing, or distracting to their experience. The icon states shown above are an example of visuals that didn’t resonate with users due to of insufficient labeling.
Despite reaching consensus on color and labeling preferences, there were a lot of users who raised concerns that didn’t follow a clear pattern. After meeting with the client to go over a full list of takeaways from testing, that included these concerns, I ranked them to simplify the decision-making process and pick a direction to move forward with.
With these priorities in mind, I selected the Whitespace and Pulsing direction because it addressed the readability, scannability, and focus concerns I determined were high priority.
-User on Neopenda's dashboard
With a direction, detailed list of goals, and refined focus on problems, we decided to focus on two key aspects of Abbo’s workflow:
The first screen Abbo sees when picking up the tablet, and also the most important. She’ll see all the babies at once, and decide what actions to take next if a baby turns critical.
The follow up screen Abbo will see when she’s checking in on a baby. Here she’ll get information to help her understand the progression of the abnormality, or track the baby’s health.
Nurses took issue with the detailed icons in the sidebar because they weren’t well labelled. Users wondered what to focus on. In response, I omitted them from future iterations.
Users said the labels on top of each vital reading were difficult to read. I spent time refining the pulse animation for future versions.
During every single user interview, nurses took time to point out how confusing they found the preview chart in the "check" dropdown. I omitted this from future iterations.
Nurses pointed out that the pie charts on the right hand side weren't focussing on the right information, and indicated they wouldn't use them. I decided to abandon these elements because multiple users mentioned they added too much noise.
Users said that while they found the peaks and valleys with the red pulses interesting, it was frustrating they weren't aligned with the X-axis data labels. For future iterations I began testing alternate ways to highlight information.
Nurses mentioned they wanted a stronger visual connection between the red dots and the table below the graph. For the final iteration I brought the red into the table and interactive slider.
Users had far fewer legibility concerns than previous test groups did, and a much easier time navigating through the options once alarms went off.
In every phase of testing, users said they wanted more visibility and control over the X values in the trend section. The interactive slider allows them to find a pulse rate at any X value within a specified range.
She can easily see each vital reading and determine how critical each patient is, using motion in addition to color without getting fatigued.
Testing showed users liked having a large bright red area that didn’t change in the center of each reading, and this design allowed me to use circular shapes consistently to indicate a patient’s status throughout the interface - tightening the alignment between visual patterns and information hierarchy.
She sees an implied hierarchy to help her prioritize babies within her workflow.
I wanted to ensure the interface stayed consistent in the order it was showing for patient alarms. The switching animation will help nurses understand sooner that a shift in priority requires a change in her workflow.
The interface shows the nurse contextual, relevant options for each patient that change with the alarm state.
I refined the concept for a “checked” action to account for the impending interruption Abbo will face during her shift. Adding this action will help abbo avoid repeated work. The final solution showed a simplified check button with clear instruction tip about what actions result from it.
When nurses looks at a baby’s graph in the interface, they won’t have to rely on memory alone to determine if a value is inside or outside normal range - they’ll get a clear visual highlight.
Users went out of their way to request better labeling and more specificity on the trend graphs. The interactive slider gives Abbo full control over the data label she’s seeing.
Originally, I designed the trends graph to emphasize peaks and valleys, but SMEs pointed out that’s not what a nurse is most interested in. Instead, he/she wants to see the general shape of the curve over time.
As nurses complete their rounds, they’ll easily be able to enter readings from the interface into paper charts required by the Ugandan hospitals.
The table was a counterintuitive addition because at first, I assumed the display would be redundant. As I listened to nurses describe their workflow in detail, and their heavy reliance on manual charts, it became evident that the interface had to show a table below the graph.
In addition to the high fidelity screens, I delivered a list of recommendations to continue development on the interface. Based on research and iteration, I recommended:
Include and test an “Offline State” to support the battery feature already present on the prototype. Abbo will need a way to know if a Baby’s vitals are offline or not transmitting properly.
The auditory alarms system will require additional, more detailed testing. Part of my solution involved a simplification of the muting action that wasn’t thoroughly tested due to prototyping constraints.
Create a triaging mechanism similar to the timer I included in my prototype. Due to prototyping limitations that didn’t allow for dynamic system triggers, testing was limited for this feature.
This project was the most challenging I’ve taken on in my career, stemming from designing for SMEs in an unfamiliar domain. I had to develop concepts, and design screens with partial knowledge of exactly what they’d be used for.
This project required me to spend more time thinking about systematic interactions, and less time tweaking visual design, than I was accustomed to. As a visual designer, this shift felt foreign and occasionally uncomfortable. I was able to push past that discomfort by honing in on usability, and letting nurse’s daily workflow guide my process.
I had to abandon preconceived notions about nurses and listen intently to user preferences that sometimes puzzled me. Patterns I was accustomed to following, and sensibilities that applied to other applications, didn’t apply to this project.
To learn more about Neopenda's progress, visit their site. Still have lingering questions or curiosities? Let's talk in person!
Say Hello!