All-in-One Platform for Bio-Rad Systems
GROWTH STAGE
STRATEGY
RESEARCH
UI/UX
DESIGN SYSTEM
3D
Overview
At the start of the pandemic, I led a project with Bio-Rad, merging three ddpcr systems into one unified interface for the QX One and QX200 instruments. User feedback shaped the restructuring of workflows, new features, and 3D animations, defining the UI style for future Bio-Rad instruments.
Role
Solo Designer Leading UI/UX, Research & Project Management
Duration
6 months
Platforms
Desktop
Embedded
Touchscreen
Industries
B2B
Medtech
Biopharma
Academia
Clinical Diagnosics
Context
Outcomes
Context
Client
Bio-Rad Laboratories
Life science research & diagnostics
Bio-Rad is a global leader in life science research and diagnostics, delivering solutions that empower researchers and clinicians, advancing healthcare and scientific discovery worldwide.
Client
Bio-Rad Laboratories
Life science research & diagnostics
Bio-Rad is a global leader in life science research and diagnostics, delivering solutions that empower researchers and clinicians, advancing healthcare and scientific discovery worldwide.
Client
Bio-Rad Laboratories
Life science research & diagnostics
Bio-Rad is a global leader in life science research and diagnostics, delivering solutions that empower researchers and clinicians, advancing healthcare and scientific discovery worldwide.
Team
Team
Team
Process
Process
Process
Challenges
Challenges
Challenges
Problem
Start
QX One: The 24" touchscreen software on the instrument controls plate setup and data, though rarely used for analysis.
QX Manager: Newer desktop software for data analysis and controlling the QX200 when connected to a computer.
Quantasoft: Older desktop software, preferred by many due to its simplicity.
QX One
QX Manager
Quantasoft
Start
QX One: The 24" touchscreen software on the instrument controls plate setup and data, though rarely used for analysis.
QX Manager: Newer desktop software for data analysis and controlling the QX200 when connected to a computer.
Quantasoft: Older desktop software, preferred by many due to its simplicity.
QX One
QX Manager
Quantasoft
Start
QX One: The 24" touchscreen software on the instrument controls plate setup and data, though rarely used for analysis.
QX Manager: Newer desktop software for data analysis and controlling the QX200 when connected to a computer.
Quantasoft: Older desktop software, preferred by many due to its simplicity.
QX One
QX Manager
Quantasoft
People
Stakeholders
“You can’t see any information in the wells
. There are view issues. The analysis data is too small and hard to use.
”
"The current interface is clunky, and could use some streamlining and modernization.
"
Customers
“The QX Manager is clunky
and bare bones.”
“It takes a while to train
people on this software. When well data has errors it’s not clear why. The interface isn't easy to use.
”
Users
“Printing graphs is too difficult
on QX Manager. I am not able to customize
what data I want to show for my presentations.”
"When configuring a plate on QX Manager, the apply button doesn't always work
."
People
Stakeholders
“You can’t see any information in the wells
. There are view issues. The analysis data is too small and hard to use.
”
"The current interface is clunky, and could use some streamlining and modernization.
"
Customers
“The QX Manager is clunky
and bare bones.”
“It takes a while to train
people on this software. When well data has errors it’s not clear why. The interface isn't easy to use.
”
Users
“Printing graphs is too difficult
on QX Manager. I am not able to customize
what data I want to show for my presentations.”
"When configuring a plate on QX Manager, the apply button doesn't always work
."
People
Stakeholders
“You can’t see any information in the wells
. There are view issues. The analysis data is too small and hard to use.
”
"The current interface is clunky, and could use some streamlining and modernization.
"
Customers
“The QX Manager is clunky
and bare bones.”
“It takes a while to train
people on this software. When well data has errors it’s not clear why. The interface isn't easy to use.
”
Users
“Printing graphs is too difficult
on QX Manager. I am not able to customize
what data I want to show for my presentations.”
"When configuring a plate on QX Manager, the apply button doesn't always work
."
Setting
Interface differences: QX ONE has an embedded touchscreen, while QX200 relies on a monitor, influencing how users interact with each device.
Lab vs desk usage: While the QX ONE and QX200 operate in the lab, detailed analysis and template creation are typically done at desks for greater precision and control.
Line of Sight Considerations
Location Considerations
Setting
Interface differences: QX ONE has an embedded touchscreen, while QX200 relies on a monitor, influencing how users interact with each device.
Lab vs desk usage: While the QX ONE and QX200 operate in the lab, detailed analysis and template creation are typically done at desks for greater precision and control.
Line of Sight Considerations
Location Considerations
Setting
Interface differences: QX ONE has an embedded touchscreen, while QX200 relies on a monitor, influencing how users interact with each device.
Lab vs desk usage: While the QX ONE and QX200 operate in the lab, detailed analysis and template creation are typically done at desks for greater precision and control.
Line of Sight Considerations
Location Considerations
Technology
QX One vs QX200 functionality: The QX One supports Droplet Generation, Thermal Cycling and Droplet Reading, while the QX200 handles only Droplet Reading.
5 vs 1 plates: The QX One supports up to five plates; the QX200 only supports one.
Plate scanning Issues: Unclear RFID scan placement on the QX One causes confusion and leads to new user frustration.
Technology
QX One vs QX200 functionality: The QX One supports Droplet Generation, Thermal Cycling and Droplet Reading, while the QX200 handles only Droplet Reading.
5 vs 1 plates: The QX One supports up to five plates; the QX200 only supports one.
Plate scanning Issues: Unclear RFID scan placement on the QX One causes confusion and leads to new user frustration.
Technology
QX One vs QX200 functionality: The QX One supports Droplet Generation, Thermal Cycling and Droplet Reading, while the QX200 handles only Droplet Reading.
5 vs 1 plates: The QX One supports up to five plates; the QX200 only supports one.
Plate scanning Issues: Unclear RFID scan placement on the QX One causes confusion and leads to new user frustration.
Define
Merging software systems
How might we combine the three legacy systems
into a unified platform
that works seamlessly across both QX One and QX200?
Plate setup flow
How might we improve plate set up flows
so that they support the unique features
of both the QX One and QX200 instruments?
Analysis flow
How might we provide analysis features
that cater to diverse industry needs
, like clinical diagnostics, biopharma and academia?
Define
Merging software systems
How might we combine the three legacy systems
into a unified platform
that works seamlessly across both QX One and QX200?
Plate setup flow
How might we improve plate set up flows
so that they support the unique features
of both the QX One and QX200 instruments?
Analysis flow
How might we provide analysis features
that cater to diverse industry needs
, like clinical diagnostics, biopharma and academia?
Define
Merging software systems
How might we combine the three legacy systems
into a unified platform
that works seamlessly across both QX One and QX200?
Plate setup flow
How might we improve plate set up flows
so that they support the unique features
of both the QX One and QX200 instruments?
Analysis flow
How might we provide analysis features
that cater to diverse industry needs
, like clinical diagnostics, biopharma and academia?
Discovery
Research
I led three sessions per week with the product owner, engineers and SMEs exploring workflows, pain points and improvements.
Pain points:
• Unclear icons led to failed runs.
• Wells showed limited or irrelevant data.
• Complex graphs were difficult to read.
Opportunities:
• Provide clear consumable level visuals.
• Add well data visibility and color controls.
• Include font size and full-screen controls.
Unclear Consumable Icons
Limited Well Data Visible
Unreadable Complex Graphs
Research
I led three sessions per week with the product owner, engineers and SMEs exploring workflows, pain points and improvements.
Pain points:
• Unclear icons led to failed runs.
• Wells showed limited or irrelevant data.
• Complex graphs were difficult to read.
Opportunities:
• Provide clear consumable level visuals.
• Add well data visibility and color controls.
• Include font size and full-screen controls.
Unclear Consumable Icons
Limited Well Data Visible
Unreadable Complex Graphs
Research
I led three sessions per week with the product owner, engineers and SMEs exploring workflows, pain points and improvements.
Pain points:
• Unclear icons led to failed runs.
• Wells showed limited or irrelevant data.
• Complex graphs were difficult to read.
Opportunities:
• Provide clear consumable level visuals.
• Add well data visibility and color controls.
• Include font size and full-screen controls.
Unclear Consumable Icons
Limited Well Data Visible
Unreadable Complex Graphs
Personas
Developing personas revealed varying user needs. Some required uniform well details, while others needed full plate customizability, highlighting the need for flexible Ul workflows.
Personas
Developing personas revealed varying user needs. Some required uniform well details, while others needed full plate customizability, highlighting the need for flexible Ul workflows.
Personas
Developing personas revealed varying user needs. Some required uniform well details, while others needed full plate customizability, highlighting the need for flexible Ul workflows.
Journeys
Journey mapping revealed issues like unsaved inputs and challenging horizontal scrolling on touchscreens, forcing users to complete complex tasks at their desks.
Journeys
Journey mapping revealed issues like unsaved inputs and challenging horizontal scrolling on touchscreens, forcing users to complete complex tasks at their desks.
Journeys
Journey mapping revealed issues like unsaved inputs and challenging horizontal scrolling on touchscreens, forcing users to complete complex tasks at their desks.
Avenues
How can we simplify plate setup?
Clear scanning prompts
and plate loading verification
would reduce set up errors and avoid incomplete or aborted runs.
How can we improve well selection?
Selectable well data
and visually different data types
would provide users relevant, useful data and improve analysis accuracy.
How can we maximize data visibility?
Allowing expandable plate and graph views
and enabling toggling on/off well selection
would improve usability of analysis flows.
Avenues
How can we simplify plate setup?
Clear scanning prompts
and plate loading verification
would reduce set up errors and avoid incomplete or aborted runs.
How can we improve well selection?
Selectable well data
and visually different data types
would provide users relevant, useful data and improve analysis accuracy.
How can we maximize data visibility?
Allowing expandable plate and graph views
and enabling toggling on/off well selection
would improve usability of analysis flows.
Avenues
How can we simplify plate setup?
Clear scanning prompts
and plate loading verification
would reduce set up errors and avoid incomplete or aborted runs.
How can we improve well selection?
Selectable well data
and visually different data types
would provide users relevant, useful data and improve analysis accuracy.
How can we maximize data visibility?
Allowing expandable plate and graph views
and enabling toggling on/off well selection
would improve usability of analysis flows.
Solution
Information Architecture
Using user research and feedback, I designed an IA that prioritized frequent tasks and integrated key features, with automatic detection of QX200 or QX One instruments.
Information Architecture
Using user research and feedback, I designed an IA that prioritized frequent tasks and integrated key features, with automatic detection of QX200 or QX One instruments.
Information Architecture
Using user research and feedback, I designed an IA that prioritized frequent tasks and integrated key features, with automatic detection of QX200 or QX One instruments.
Wireframes
Starting with wireframes, I explored 3D visuals to guide users, aligning the clean, minimalist design with QuantaSoft's simplicity and the team's vision for a clear, intuitive interface.
Wireframes
Starting with wireframes, I explored 3D visuals to guide users, aligning the clean, minimalist design with QuantaSoft's simplicity and the team's vision for a clear, intuitive interface.
Wireframes
Starting with wireframes, I explored 3D visuals to guide users, aligning the clean, minimalist design with QuantaSoft's simplicity and the team's vision for a clear, intuitive interface.
Design System
I created a design system for both desktop and touchscreen, defining colors, typography, and components. It was refined through prototyping, user testing, and feedback.
Design System
I created a design system for both desktop and touchscreen, defining colors, typography, and components. It was refined through prototyping, user testing, and feedback.
Design System
I created a design system for both desktop and touchscreen, defining colors, typography, and components. It was refined through prototyping, user testing, and feedback.
Prototypes
Prototyping potential user flows to test and refine concepts before finalizing designs.
QX One: Plate set up flow, used on the 24" touchscreen.
QX One: Plate data analysis, used on a monitor nearby.
QX 200: Sign in and add plate flow, on a connected monitor.
Prototypes
Prototyping potential user flows to test and refine concepts before finalizing designs.
QX One: Plate set up flow, used on the 24" touchscreen.
QX One: Plate data analysis, used on a monitor nearby.
QX 200: Sign in and add plate flow, on a connected monitor.
Prototypes
Prototyping potential user flows to test and refine concepts before finalizing designs.
QX One: Plate set up flow, used on the 24" touchscreen.
QX One: Plate data analysis, used on a monitor nearby.
QX 200: Sign in and add plate flow, on a connected monitor.
Final Designs
We prioritized key workflows like plate setup and analysis. Collaborating closely with the product owner, dev team, and SMEs, I refined designs based on their feedback.
Final Designs
We prioritized key workflows like plate setup and analysis. Collaborating closely with the product owner, dev team, and SMEs, I refined designs based on their feedback.
Final Designs
We prioritized key workflows like plate setup and analysis. Collaborating closely with the product owner, dev team, and SMEs, I refined designs based on their feedback.
Testing
Methods
Methods
Methods
Task 1: Plate Set Up
Task 1: Plate Set Up
Task 1: Plate Set Up
Task 2: Data Analysis
Task 2: Data Analysis
Task 2: Data Analysis
Outcomes
Results
Results
Results
Impact
Impact
Impact
Self-Reflection
Self-Reflection
Self-Reflection
More case studies
Truvian Blood Test Analyzer Interface
STRATEGY
UI/UX
ILLUSTRATION
Truvian Blood Test Analyzer Interface
UI/UX
More case studies
Truvian Blood Test Analyzer Interface
STRATEGY
UI/UX
ILLUSTRATION
Truvian Blood Test Analyzer Interface
UI/UX
More case studies
Truvian Blood Test Analyzer Interface
STRATEGY
RESEARCH
UI/UX
DESIGN SYSTEM
3D
Truvian Blood Test Analyzer Interface
STRATEGY
UI/UX
ILLUSTRATION
Truvian Blood Test Analyzer Interface
UI/UX
Truvian Blood Test Analyzer Interface
STRATEGY
UI/UX
ILLUSTRATION
Truvian Blood Test Analyzer Interface
UI/UX
For Hiring Managers
© 2024 Allison Ehrke. All rights reserved.
Handmade with ♡ in Aotearoa
For Hiring Managers
© 2024 Allison Ehrke. All rights reserved.
Handmade with ♡ in Aotearoa