meshcandy_part_screen.png

Dashboard Design

 

Dashboard Design

How might we help hospital admins quickly take corrective action?

 
meshcandy_for_site_4x.png
 
 

 
 
 

Our client, MeshCandy, is an Internet-of-Things startup that installs wireless radio sensors or "tags" on medical assets to enable automated environmental monitoring, location-tracking, and inventory counts to help hospitals pass audits.

MeshCandy asked us to build a dashboard for healthcare customers. They already had a mobile app, and requested a desktop dashboard design. 

Our biggest initial question was: what is the purpose of the dashboard, and what should we display on it?

Background

 

 

Before Images

meshcandy_menu_phone_cropped.png
meshcandy_phone_before.png
 
 

 
 

Tools and methods we used were: 

  • user interviews
  • competitive analysis
  • storyboarding
  • paper prototypes
  • wireframes 

We delivered a lo-fi prototype, a user research report, and recommendations. Post-project, I used our work to produce a high fidelity color prototype.

Tools & Methods

 
 

 
 

Because we wanted to talk to end users for needs-finding, but didn't have direct access to them, we conducted interviews with healthcare professionals who fit the archetype of MeshCandy's customers: a medical student, a reproductive health care clinic specialist, and MeshCandy's sales director, who often integrates with customers.

Discovering the Problem

 
 

 
 

Research Findings

 
 Environmental measurements that hospitals must take twice a day for certain rooms and fridges

Environmental measurements that hospitals must take twice a day for certain rooms and fridges

  • Hospitals are required to track environmental measurements for assets such as fridges for blood samples and operating rooms. When a measurement goes out of scope, a nurse or admin must assess the severity of the infraction, take corrective action as necessary, and log the issue for auditing purposes.
  • Hospital also need to generate environmental monitoring reports and asset reports for audits. Asset and inventory-type work tend to fall on nurses, not doctors.
  • Many healthcare facilities document environmental measurements on paper ledgers.
  • When preparing for an audit, clinics often have a week to scramble to provide the documentation needed. 
 
 
 Install tags 

Install tags 

 Provide data

Provide data

 

vs.

 
 Generate alerts

Generate alerts

 Help pass audits

Help pass audits

 

MeshCandy's mental model of their value is that they:

  1. Install tags/sensors on customer's equipment
  2. Provide real-time, aggregated, or filtered data about the equipment


Hospitals' mental model of MeshCandy's value is:

  1. Providing alerts about environmental monitoring issues 
  2. Logging corrective action taken in response to issues
  3. Generating environmental monitoring reports
 
 

 
 

Create a dashboard that:

  • Helps admins quickly see what environmental issues need attention
  • Incentivizes admins to resolve them
  • Give admins an overview of how the hundreds of assets are performing

Design Challenge

     
     

     
     

    Storyboard

     
    meshcandy_storyboard_gray.jpg
     
     
     

     
     

    User Flow

    meshcandy_flow.png
     
     

     
     

    Site Map

     
    meshcandy_sitemap_bw.png
     
     
     

     
     

    Sketching

     
    meshcandy_sketches.png
     
     
     

     
     

    Initial Wireframes

    Dashboard Version 1

    meshcandy_dashboard.png

    This was an initial version of the dashboard. The key goals of this dashboard were to:

    1. Give her a quick overview of her equipment
    2. Highlight currently unresolved issues
    3. Show trends to help her notice recurring issues so she can take preventative measures 


    We conducted usability testing with 3 users and learned that all of the data we were displaying was a bit overwhelming, and that the dashboard didn't feel actionable.

     

    Dashboard Version 2

    meshcandy_dashboard_lf.png

    In the second iteration, we drilled down on the key task of the hospital admin: to quickly take corrective action and log issues. We decided to display issues in a card form so that users can:

    1. Take each issue seriously and individually, as it is easy to gloss over issues when they are sitting in a database
    2. Give users a way to track progress, as users have to leave their desk to resolve an issue, and not all issues can be immediately resolved

    We also decided to display some analytics in a location-oriented format so that users can:

    1. Resolve multiple issues in one trip
    2. Prevent future issues from occurring by identifying locations that tend to cause trouble
     
     

     
     

    Usability Testing

    meshcandy_usability.png

    We brainstormed two layouts for filtering search results and wanted to identify the better-performing one, so we conducted guerrilla A/B tests with 5 users. We asked each user to filter for "temperature", "rooms", and "4th floor" and timed the users on how long it took to complete the task.

    Filter Option 1

    Screen Shot 2018-03-22 at 1.07.27 PM.png

    Filter Option 2

     
    Screen Shot 2018-03-22 at 1.07.40 PM.png
     

    Users vocalized a preference for option 1 because they enjoyed the icons. However, their average task completion time was 19 seconds.

    Users found option 2 to be straightforward. It took less time to parse, required less mouse movement and users took 8 seconds.

     
     

     
     

    Proposed Visual Design

    meshcandy_colors.png
     
     

     
     

    Dashboard Home Page

     
     
    meshcandy_home1.5x.png

    Not all issues can be immediately resolved, so we have the "Open Issue", "In Progress" and "Resolved" columns to track progress.

    An interviewee said "nobody loves databases", so we gamified the issue resolution experience by presenting issues in cards instead of a database.

    To isolate important issues, we color-coded the cards by priority.

    We visualized issues by location so the user can resolve multiple issues on one trip.

    To incentivize the user to resolve issues, we display performance metrics.

     
     

     
     

    Issues Log

     
    meshcandy_issues.png

    For a complete view of both resolved and unresolved issues, users can refer to the issues log.

    Unresolved issues are highlighted and have a bright "Resolve Now" call to action.

    Resolved issues are grayed out, but users can still see what corrective action was taken through "View Log."

    To find a specific issue, users have multiple filtering and search options.

     
     

     
     

    Environmental Monitoring Report Page

    We integrated the usability testing learnings and kept the icons but streamlined the checkbox filtering options vertically to minimize eyeball and mouse movement.

     
     

     
     

    Prototype Demo

     
     
     
     
     

     
     

    The client of this project, MeshCandy, recently graduated from an incubator and plans on implementing the web dashboard after they finish trials with their current set of hospital clients.

    Next Steps