Quest Diagnostics

Healthcare Patient (HCP) Portal


Agency: Code & Theory
Strategy Lead: Alexa Varsavsky
UX Leads: Mariya Chekmarova (1-4), Michael Newcomb (6), Janine Toro (5-6)
UX Designer: Jayne Lee
Creative Director: Jess Lee
Visual Designers: Jaewon Choi, Annie Zeng
Tech Director: Brian Schwartz


Quest Diagnostics had over 30 disparate products built to facilitate and assist in ordering clinical lab tests, resulting in lots of maintenance and management of these products.


Centralize the disparate products into one cohesive patient portal, allowing physicians, lab technicians, and nurses to easily order clinical lab tests in one system


NOTE: I joined this project during the second half of its duration. The following sections highlight the parts I was responsible for while assisted by various other UX designers at different phases of the project (see Team & Contributors).

Quest has over 30 legacy products that are used for the sole purpose of ordering lab tests. We wanted to a) consolidate these products into 1 application and b) set up a foundational platform that could be used to further build off and expand as their business continues to grow.

The immediate complexity we tackled was the idea of managing multiple user types with a descending hierarchy.

The 3 main "users" are:

Multiple nurses can work for 1 physician and multiple physicians can work for 1 organization. Defining who's perspective we were designing for was always a crucial point to start from because each user has different needs and responsibilities at various stages of their workflow.


1—Lab Report

Quest Diagnostics Lab Report wireframe

Lab Report wireframe

The Lab Report needed to be quickly scannable while still displaying all the information necessary. The client wanted to additionally display the original report from the lab as an additional way to confirm the report information. Because of technical feasibility and time, this was displayed in an iFrame.

It was important to account for instances when a report would require immediate attention with a physician or patient. We decided to display a banner to indicate the critical status.

Since many user types could potentially be viewing the report, it was important to indicate who had seen the report. Physicians and nurses have different workflows that don't always overlap, which means that they require more passive ways to communicate their actions. Additionally, without knowing who had seen a report may result in a diffusion of responsibility and ultimately no one may do anything with the report, leaving the patient unaware.

We included an option to flag the report, conceptually similar to bookmarking. This covered the often nuance occurrence where a report is not necessarily critical, but still important for a physician to be aware.

2—Lab Orders

Quest Diagnostics Lab Orders wireframe

Lab Order wireframe

The Lab Orders section displays all orders that have been created. Physicians and nurses lacked the visibility into what occurred after they successfully created an order. Lab orders can take a long time because there are various stages they must go through, so it was hard to know exactly when the results would return. We added a status tracker, similar to package shipments, to provide awareness on where their order was in the cycle.

Since nurses sometimes work for different physicians they needed a way to view the orders by their specific physician. We added a conditional filter, which allows nurses to switch view perspectives based on their physicians.

Unfortunately, there is no common way to look up orders across all organizations, physicians, and nurses. Users can either search by specific parameters, order status, and by most recently created.


Quest Diagnostics Results section wireframe

Results Section wireframe

Lab Results always require some succeeding action after viewing. We implemented the inbox model to convey the motivation to view all results and indicate when new results arrived.


Quest Diagnostics Notifications section wireframe

Notifications Section wireframe

The Notifications section of the portal is unique to each individual user rather than organization or physician; however, some notifications are on a global scale (organization-level). We needed to be able to communicate to the user which of their notifications were unique to them in contrast to the organization level notifications. The organization level notifications show a list of other people who've also received the same notification and have viewed the item (ex. Lab Report). Because users are going to be receiving many notifications in a day, we implemented a task management model, allowing users to organize and clear out their notifications they've already seen.


Quest Diagnostics Onboarding wireframe

Onboarding wireframe

The portal, in general, has a lot of information and may seem a bit complex at first glance. We decided to use Google Material's spotlight pattern to highlight and provide brief focus on the most key components of the portal.


Quest Diagnostics Dashboard wireframe

Dashboard wireframe

We decided the main function of the Dashboard should be a brief overview, from an organization perspective, but more importantly, for it to serve as a jumping off point into what is next up in priority. We displayed the most important metrics (# of reports, # of orders, etc), from a task management perspective, to provide a sense of urgency. Additionally, we displayed other metrics in the form of charts to provide a more informative perspective on how the organization is performing.

OUTCOME Quest Diagnostics Dashboard final design Quest Diagnostics Onboarding final design

Final designs created from the wireframes by the Visual designers

Quest launched this product to their internal team in 2018, renamed as Quanum.


UX Deliverables: