Problem Brief

Complex therapy production workflows require multiple asynchronous days (sessions) of material collection and manufacturing processes to ensure production thresholds are met and the therapy can be completed. Creating these complex workflows is essential to supporting customers with complicated therapy creation workflows.

Team

2 designers, 3 product managers, multiple teams of engineers across the continental US, India, and Armenia.

Initial Constraints

The Vineti platform was initially only built to support a single session, single material, linear workflow. This assumed a user would be entering data synchronously about their single bag directly into Vineti as the data was collected.

Scenarios and Personae

User Personae

Collection

The two users we identified after interviewing on-site hospital staff for the Collection module were Arlene, an apheresis nurse; and Phil, who worked in the cell lab. Arlene’s main concern is collecting the right amount of blood from the right patient. Phil’s main concern is properly freezing, storing and shipping the blood bags to their next destination in the treatment workflow.

Manufacturing

The three personae we identified after interviewing on-site manufacturing lab staff for the Manufacturing module were Steph, a member of the manufacturing lab staff working to produce a therapy; Quela, the manufacturing quality assurance staff-member, and Maria, who managed moving materials into and out of the manufacturing site.

Scenarios

In the Collection module, this scenario is any workflow where an aphaeresis nurse must collect multiple bags of material (whole blood in the most common workflow) from a patient in a single session, or any workflow where a nurse must collect multiple bags of material from a patient over multiple days.

Collection workflow example: Arlene begins by selecting a patient from the Patient List page, which takes her into the Collection workflow. Once there, she sees the current phase she is working on highlighted in blue on the process navigation UI on the lefthand side of the screen. She navigates through the phase by using the CTA buttons on the bottom right.

Pain points

1. Users are used to paper forms or fillable PDFs, so having to click through multiple pages of data increases perceived effort
2. GMP processes often require a certain threshold of material to be collected for a therapy, so Arlene needs to easily see an aggregate total of her currently collected material to know if more bags need to be collected
3. Users have no way to know how many steps (pages) are contained within her Collection Day 1 phase
4. There is no way for users to add more collection days to their workflow
5. There is no way for users to add more collection bags to their workflow
6. Loss of context when bags are identified and data is recorded on separate steps
7. Summary data is only presented to users on the Summary page at the end of the flow

Solutioning

I broke down the solution for addressing complex workflows in the platform into 3 parts that built on each other to create an approach that could be developed modularly to eventually deliver this functionality. The parts were designed by me in the following order:

1. Process Navigation Enhancements
2. New functionality allowing users to add Sessions to workflows
3. New functionality allowing users to view and add multiple bags to workflows
4. Putting It All Together: Complex Workflow Navigation with Sessions and New Bag Table UI

New Session Creation UI

Goals

The goals of allowing users to add their own Sessions to workflows are:

1. Supporting users’ ability to collect material over multiple days or months
2. Adding clarity and visibility into workflows so users can more easily navigate their process
3. Breaking up multi-day or -month workflows into meaningful sections to avoid cognitive overload

These explorations involved adding a dedicated Inventory page to the Collection module of the platform, that would function as a heads-up-display to users containing the key information about their workflow, and the ability to add new Sessions and Bags.

Initial wireframe to get product manager buy-in:

More detailed explorations outlining possible UI direction, functionality, and rationale:

After discussing these solutions with PMs and user proxies, it was decided that it restricting the ability to add bags to Bags page supported the most workflows, and also reduced to amount of cognitive load on users on this bag. It had the additional benefit of not being net new functionality to add to our process nav.

New Add Sessions Solution

The solution of to adding Sessions to the Collection module met all of the goals outlined for it. It enables users to see a subset of important information across all their sessions, and there they can add new sessions as needed within their workflow. It empowers users to be able to extend their workflow to meet the needs of therapy production, and more importantly, patient needs.

New Multi-Bag UI

In addition to more robust and transparent navigation, to complete complex customer workflows users need the ability to add multiple bags of material to their sessions to meet therapy thresholds. Broadly, therapy workflows can require that bags be combined, split, or stored for future use, meaning that users need the ability to quickly and easily add and remove bags from their workflow.

What the legacy UI does well

1. Separation of information leads to less cognitive load
2. Clear information hierarchy
3. Works for linear workflows

Pain points of the legacy UI

1. Only 1 bag can be entered
2. Users are repeatedly asked to scan the same label on subsequent steps
3. Does not accommodate workflows needing multiple bags

Explorations

There are cases where due to patient health, a Collection Session will end without the required number of bags collected, so the patient will need to return to the apheresis lab to get more blood drawn. There are also the unlikely but not unheard of cases where a bag has broken or material spoils, which means that another Session is needed.

The scenarios that need to be supported from our persona’s perspectives:

As A collection user, I need to be able to visualize all of my bag data in one UI so that I can easily see if I have enough material to meet the required therapy thresholds.

With these scenarios in mind, I was able to outline a clear set of goals for UI improvements.

Goals

1. Allow users to add multiple bags (up to 10 according to one customer)
2. Streamline the data entry as much as possible to reduce context switching
3. Show users an aggregate total of relevant bag data in context

Multi-Bag UI Explorations

The initial explorations focused on adding a new table component into the UI. This was important to our users because they are used to PDF forms and the ability to see all of their data entry in one place. This table has the added bonus of allowing users to see their running aggregate total while they do their data entry. After aligning with the team on the addition of the new table, I had to design a new way for users to enter their data. These explorations also deal with where the data entry fields are in relation to the data table.

New Bag Table UI

The new table UI has clear CTA text telling the user how to start adding bags. Once a bag is created, the user sees the blank bag fields expanded

Putting It All Together: Complex Workflow Navigation with Sessions and New Bag Table UI

Putting all of these pieces together creates a more informative and flexible workflow for our users. They have a holistic view of their entire workflow via the new Session page, as well as the new enhanced process navigation UI. In addition, we were able to create a way to users to seamlessly add as many bags as needed to their sessions, and be able to see running totals to meet their therapy thresholds.