Medihub

An end-to-end mobile app designed to allow healthcare workers to search for and access quick, reliable clinical information. A simple design pattern saves time researching and allows more time to care for patients.

Giving Healthcare Workers the Information They Need

Helping Patients Receive the Care They Deserve

DELIVERABLES PROVIDED

Created wireframes and prototypes that align with both user and business goals and express design principles.

Crafted user and task flows, site map, affinity maps, personas, and user research. This allowed me to gather insights for which to base design decisions on.

Designed interactive components and prototypes to perform usability testing and iteration of the design based on feedback.

The healthcare industry is highly regulated and requires constantly updated, evidence-based, peer-reviewed data. Healthcare professionals often do not have enough time to search the internet for resources that are reputable. There are no resources that combine condition, drug, treatment and procedure information in one place.

Problem Background

Users are in need of an app where they can reference free information in one place. Medihub should enable users to search for, save, and access pages with information on conditions, drugs, and other relevant clinical information. How might we make this product convenient, simple, and time-saving?

Problem Statement

Success Measures

Users will be able to reduce the average time spent locating a condition or drug by at least 30%


The app will be rated at over 68% by users on the system usability scale (SUS)


Task completion rate will be at least 90% for all users

Discover

Research Objectives

Learn what resources users currently utilize and how/where they access them

Understand the motivation for selecting which resource they use

Understand users wants, needs, and frustrations with their current resources

Determine what features and information will be most valuable to users

Competitive Analysis

  • Large, reputable brand

  • Robust catalog of articles

  • Largest market share

STRENGTHS

  • Outdated, complicated UI

  • Not used for basic info on conditions, only for very specific studies

  • Some articles require additional payment

WEAKNESSES

  • Free content and resources

  • Tutor feature to ask clinical questions

  • News feature for updates on conditions and drugs

STRENGTHS

  • Some citations are outdated and not updated

  • Several features require downloading an additional app

WEAKNESSES

  • Utilizes reputable resources like Davis’ Drug Guide

  • Additional features like calculators and lab value ranges

STRENGTHS

  • Outdated, complicated UI

  • Some articles have no citation or references

  • Some databases advertised require additional subscription

WEAKNESSES

I interviewed 5 participants who have careers in various healthcare settings. Research allowed me to understand the user’s feelings, needs, motivations, habits, and pain points. Below are some of these insights:

User Interviews

Most users access resources via a work computer, and therefore cannot access them to study outside of work.

All users had to utilize several different resources for conditions, drugs, assessments, etc.

Most participants were not willing to pay a subscription for the apps or websites they use.

The users get frustrated with the complexity and how long it takes to search for a specific condition with their current resource.

Affinity Mapping

Define

User Personas

Define

Ideate

User Flow Mapping

Find condition or drug > add to saved folder > locate condition or drug on saved screen

Task Flow Mapping

Find Drug

Find Condition

Add to Folder

Locate From Saved List

Site Map

Key

ideate

Design

Low-Fidelity Sketches

Mid-Fidelity Wireframes

Homepage allows users to quickly search or browse through different categories

Category pages allow user to filter through different classifications, search, and add items to saved list

Condition and drug pages include different categories of information that users can scroll through

User can also add to saved list via the specific condition or drug page

Saved list will categorize saved items based on their classification, which user can filter through

User can add their own notes on various conditions or drugs

UI Kit

Typography

Color Palette

Buttons

Cards

Icons

Drop Downs

Form Fields

Headers and Footers

Hi-fidelity Wireframes

Convenient 1st screen allows user to add login details or choose to sign up

Added a screen for each condition classification, so user can search for specifically cardiac conditions, for example

Added the ability for quick preview of a condition by clicking down arrow

Drug cards show drug class under their name for fast identification

Added the ability to put conditions or drugs into different folders, for users who want additional organization

Test

A usability test was performed once the high-fidelity prototype was completed. Participants with different roles in healthcare were then recruited to take part in a Zoom virtual usability test. Below are the insights I gained:

Usability Testing

All tasks were efficiently and quickly completed. Average time spent on finding a condition page went from 8 minutes to 2 minutes and 45 seconds, a decrease of 65.6%.

Users rated the app at 77% on the system usability scale (SUS). Industry standard for a desired score is at least 68%.

Task completion rate was 100% for all tasks assigned. Some users took indirect paths, but till completed each task.

The resulting takeaways from usability testing were utilized to make revisions to my design. The final design was created with user feedback, needs, and pain points from research in mind.

Making Revisions

There were too many categories for a carousel feature per user feedback. I changed these categories to be displayed on screen for easier differentiation.

Shortened the header so it did not obstruct as much of the screen.

Building the Medihub app reinforced the importance of user research and testing in creating an effective and user-friendly app. Below are some of the ways this project has optimized my design process:

Key Takeaways

Creating an app in the med-tech industry requires a deep understanding of the target user’s current workflow and overall regulatory standards.

Product

This project allowed me to exercise my skills in creating and end-to-end app that simplifies a complex issue, as well as enhance the experience of a task that is typically tedious and time-consuming.

Testing

Early and frequent testing is especially useful for apps that require sophisticated navigation and information architecture. This will ensure that there is a seamless flow created for the user’s needs.

Final Thoughts

  • Add features like lab values and calculators

  • Consider adding a feature that allows hospitals to create profiles with topics that are relevant for each department

  • Add notifications for important updates on topics that have had new studies released

Next Steps

Thank you!

More projects to check out

A learning management system for students and teachers to easily navigate courses, grades, messages, and other features.

Addition of an eCommerce feature to the Apple Music app that follows brand design system guidelines.