Order Experience
A memorable and easy test result experience for women in their early pregnancy
Problem
Unlike expert providers specialized in genetics, most new providers aren’t familiar with ordering genetic tests
Pain points
1 – Unclear product names
The current product category names are opinionated and don't make much sense to some providers.
2 – Cumbersome user interface
Convoluted interfaces and flows make navigating through sites difficult. In some cases, it takes +15 clicks to get the right tests.
3 – Overwhelming content
The content in the test catalog is geared toward experts customer so people with no genetic background have a hard time digesting technical information.
“It took me 17 clicks to get the right tests and add-on combination for my patients.”
— Gregory, Oncologist
How Might We
Create an easy test catalog experience so the non-expert providers can order the right test with confidence?
Design Process
Organize test offerings to facilitate easy navigation
First, we needed to restructure test categories that work for broad user types. We brainstormed on how best to group test categories and come up with new category names.
We grouped the test categories into how they are in our system today then translated these grouping names into straightforward language. We wanted to stay away from medical terminologies and use plain language.
Optimize design for a frictionless browsing
The test category page shows all the relevant panels available within that specific test category. We removed the accordion that served as subcategories. Users expressed that it was the most tiresome interaction since they had to click every accordion to see all the test offerings.
Allow providers to customize their gene selections
The goal of the test details page is to provide a clear content and information hierarchy, allowing users to easily digest detailed information. Additionally, users can customize the test on this page. This means users can exclude certain genes from the test to tailor it more precisely to their patients' needs. This can be achieved by clicking on each individual gene tile to remove them.
Allow providers to customize their gene selections
The goal of the test details page is to provide a clear content and information hierarchy, allowing users to easily digest detailed information. Additionally, users can customize the test on this page. This means users can exclude certain genes from the test to tailor it more precisely to their patients' needs. This can be achieved by clicking on each individual gene tile to remove them.
Final Design
Test catalog home
We applied polyhierarchy where the same product category appears in multiple places supporting several different mental models.
Test category page
New design allows users to quickly scan all tests and select the one that's right for their patients. Key information is highlighted in each card optimized for a quick scan. We also included the product image to give more consumer polish to increase engagement.
Add-on genes
Some ofthe tests come with add-ons at no additional charge. These add-ons appear as the test card expands. The design intent is to increase users' awareness of what's included in the test.
Add-on genes
Some ofthe tests come with add-ons at no additional charge. These add-ons appear as the test card expands. The design intent is to increase users' awareness of what's included in the test.
Test detail page
The goal of this page is to give a clear information hierarchy and customize tests with ease.
Add-on genes
Some ofthe tests come with add-ons at no additional charge. These add-ons appear as the test card expands. The design intent is to increase users' awareness of what's included in the test.
Test customization
With new design, users can easily customize their test by removing certain genes. With progressive disclosure, the full list of genes appears incrementally to avoid overwhelming users with the sea of genes.
Design System for CMS
To maintain consistency with the new ordering flow, we have also redesigned the other pages of the Inviate website. These pages will be developed using a Content Management System (CMS). During the design process, I focused on creating components that could be reused throughout the website.
Impact
Following the Phase 1 launch, the add-to-cart rate rose by 12%, while the order completion rate saw a 4% increase
New design was released incrementally focused on the key metrics: Add-to-Cart rate and Order completion rate. Now we have a baseline to continue to improve both, which supports the user and grows the business.