Project Overview

June 2017

 

kp-nicu-5.jpg

Objective

Create an app to help families who have a child receiving treatment at a pediatric hospital.

My Role

UX/UI Designer

Methods

User research, personas, competitor analysis, user journey maps, information architecture, user flow, wireframing, user testing, UI design, interaction design, and prototyping

Technologies

Lucidchart, Balsamiq, Sketch, InVision, and Principle

RESOURCES

The Noun Project


Research

 

User Interviews

I began by interviewing two families with toddlers who had recently been in the hospital for extended periods, and a nurse who worked at a local hospital. From these interviews, it became evident that pediatric health care can vary a lot. In an effort to provide a more targeted and useful solution, I decided to narrow the objective focus to the NICU. I then interviewed two families with infants who had been in the NICU and a NICU nurse. I learned about their experiences, goals, and pain points.

Family Questions

  • Tell me about your experience.

  • Did you face any challenges during this experience?

  • What were the main challenges you faced?

  • Did you have any positive experiences?

  • What were the most positive parts of the experience?

  • What could have made the experience better?

Nurse Questions

  • Tell me about your daily job.

  • What is it like working with babies/children?

  • Do you face any challenges?

  • What are the main challenges you face as a nurse?

  • Do you have positive experiences?

  • What are some of the positive experiences you have?

  • What would make your job better?

  • What would make your job easier?

 

 
Quotes.png
 

 

Key Insights

  • The biggest concern was lack of communication. Parents weren't always aware of what was going on.

  • Parents felt they needed to always be with their child to ensure they knew what was going on. When they couldn't be with their child they felt constantly worried and stressed. As a result, their own health took a hit.

  • The nurses found it difficult to keep the parents updated on everything all the time.

  • The nurses were constantly answering easy questions.

 

Persona

I created a primary and secondary persona to summarize the goals and challenges of the users.

 

 
Primary Persona.png
Secondary Persona.png
 

 

Product Requirement Document

I created a partial PRD to help identify the vision, issue statement, method, goals and challenges, brainstorm potential solutions, explore context scenarios, and document design requirements. 

 
PRD 1.png
PRD 2.png
 

Ideation

User Journey Maps

I created user journey maps to better understand and design towards the user's goals.

 

 
User Story Map - Page 1.png
 

 

Site Map

Once I had identified the user goals, reviewed existing solutions, and brainstormed alternative solutions, I began working on the information architecture by creating a site map.

 

 
Information Architecture Copy.png
 

User Flow

Next, I created a user flow to understand how the user would navigate through the content. Each potential action from each page was outlined.

 
Copy of User Flow.png
 

Wireframes

I began wireframing on a whiteboard and in my notebook. Once I had the basic layout, I jumped into Balsamiq and put together some lo-fi wireframes.

 

 
Wireframes.png
 
 
Final Wireframe.jpg
 
 

User Testing

Using Balsamiq, I created a lo-fi prototype for user testing.

Usability Tasks

  • Task 1: Identify your baby's diagnosis.

  • Task 2: Identify your baby's heart rate.

  • Task 3: Identify what medicine your baby is taking. Identify what each medicine does.

  • Task 4: Change your notification settings.

  • Task 5: Identify your baby's current weight.

  • Task 6: Identify your baby's test results.

  • Task 7: Identify when your baby will get his next blood test.

  • Task 8: Contact the nurse.

Key Outcomes

  • Task 2: Users had some difficulty knowing what the various vitals meant and if the readings were within safe ranges. I added a popup to show what each vital means and what the infant's safe ranges are.

  • Task 3: Success. Medicine was initially nested under 'Information.' When the NICU nurse reviewed the wireframes she said medications are the topic they get the most questions on. A separate section for medicine was added.

  • Task 5: Some first-time users looked under 'Information' first. Those who had a little experience with the app found it easily. I decided to leave it as is since minimal user experience is needed to succeed and it kept the app simpler to have changes and results in the updates section. This is something that could be addressed during onboarding.


Prototype

A4.png

Style Guide

With such detailed wireframes, the only thing I needed to do to get from a lo-fi to hi-fi prototype was to create a style guide and create the content. I researched the psychology of various colors to understand which would instill calmness and confidence in the users. For this reason, I stayed away from reds and oranges. After trying out several different color schemes, I found a light blue and neutral yellow gave the best feel. A pink and yellow color scheme for female babies could be a possible alternative available in the settings.


Final Prototype and Animations

 

 
 
 
 
NICU Animation.gif
Updates.gif
Medicine Animation.gif
 

Feedback

 
Feedback.png
 

Recap and Reflection

 

Lessons Learned

  • Do as much as possible before you get into Sketch. Having made 99% of the content decisions before getting into Sketch made it much easier once I was there. Once I was in Sketch, I built just the first page and tested various styles. Once I began building all the rest of the pages I knew exactly what it would look like. This prevented me from having to go back and make a bunch of time-consuming changes to each page.

  • Go into a user interview curious. I began brainstorming ideas right out of the gate once I received the objective. I noticed in my first interview that I was looking for validation for my ideas rather than really listening to the insights from the user. Luckily, I identified this quickly and was able to put my ego aside.

  • Test. Test. Test. By the time I had the wireframes ready for testing I assumed the content all made sense. I had been staring at it too long. During user testing, I was given loads of insightful feedback I would have otherwise missed out on.

  • You can break away from common design patterns if you have a good reason. For this app, I wanted to create a main dashboard that allowed the users to see a summary of everything at once. Tabs and hamburger menus couldn't quite achieve this. So instead, I designed a hierarchal dashboard navigation that was intuitive and very clean.

Key Challenges and Solutions

  • How do I find people to interview?

    • I had a couple family members who had children in the hospital and a friend who studied nursing, but once I had decided to narrow the scope to the NICU, I realized I didn't know anyone who I could interview. I tried calling hospitals and sent emails to nurses on LinkedIn, but didn't have any luck. As I spoke to friends about the project I started to realize they were eager to help and connect me with people who I could interview. I ended up with several great connections.