← Back to work

uLab Systems

Making bundle pricing honest at the point of order

Marketing asked me to add new bundles to an existing desktop checkout. I led the MVP that moved the purchase decision to the start, preserved à la carte, and made the bundle balance clear before checkout.

ROLE

Product Designer

COMPANY

uLab Systems

TIME

2023 · desktop launch

SCOPE

Ordering flow · Pricing UX · Bundle system

Bundle selection and checkout flow

01 · Problem

Pricing appeared only after the doctor had configured the order.

Doctors chose stages, materials, retainers, and shipping before seeing the total at final review.

uLab makes clear aligners. Orthodontists design a patient's treatment in uLab's software, then order the physical aligners to be manufactured — often in batches over a case that runs a year or more.

The desktop flow had no bundle model. It moved through coverage, treatment stages, material, and shipping before revealing price at the end. Comparing another path meant backing up through decisions the doctor had already made.

Original checkout screen for selecting treatment coverageOriginal checkout screen for selecting treatment stagesOriginal checkout screen for selecting materials and retainersOriginal checkout screen for shipping and final review
Before · Coverage, stages, material, and shipping came before the final price

The price appeared after the decisions that created it.

02 · Reframe

The request was to add bundles. The opportunity was to reorganize the purchase.

Marketing introduced three bundles and asked me to fit them into the existing desktop flow.

The pricing still carried a catch. Mild covered up to 24 aligners, but a 30-aligner treatment needed six more at $21 each. The number marketed on the card and the number billed for this patient could be different.

$565Mild · up to 24 aligners
$855Moderate · up to 48 aligners
$995Comprehensive · unlimited aligners

THE DESIGN TENSION

How do we promote bundles without obscuring what this patient will cost?

Marketing needed adoption. Doctors needed to understand the purchasing model before configuring the order—and trust the number shown before checkout.

The advertised bundle and this patient's total were not always the same number.

03 · Decision

I first added bundles to the flow. Then I changed the order of decisions.

I led workshops with the Marketing Director and CCO to translate the new commercial strategy into an ordering experience.

01

Initial direction

Blend bundles into the existing checkout.

Workshop flow map exploring bundle, bundle plus à la carte, à la carte only, and retainer-only ordering paths
Doctors selected stages first, then chose a bundle or à la carte

The first direction preserved the old architecture: doctors selected how many aligners to order, then saw bundle options as the next step. It reduced engineering change, but placed the new purchasing model after the decision it was meant to guide.

02

Sequence decision

Move the bundle before stage selection.

Once doctors selected a quantity, they were anchored to it and mentally committed to the existing path. A bundle shown afterward felt like an interruption—and asked them to reconsider work they had just completed.

I moved bundle or à la carte selection to the start. To keep that early choice grounded, the screen showed the total aligners needed to complete the case above the options.

Before

Stages first

The purchasing model arrived after doctors had committed to a quantity.

Final MVP

Bundle first, case need visible

Doctors saw the complete-treatment aligner count before choosing bundle or à la carte.

03

Overflow detail

Separate the bundle price from the full-case cost.

A 30-aligner case exceeds Mild's 24-aligner allowance by six. I explored how to keep the bundle price comparable while making the overflow clear before selection.

Version 01

Full-case total leads

First overflow design showing the full-case cost as the primary price
Clear total, unclear composition. The full-case price is visible, but the bundle price and overflow logic disappear inside one number.
Version 02 · Chosen

Bundle price leads

Chosen overflow design in its collapsed stateChosen overflow design expanded to show the full calculation
Comparable price, detail on demand. The collapsed card keeps the bundle price consistent and flags the exception. Expanding reveals the extra aligner quantity, unit rate, and final calculation without crowding the initial scan.

Preserve the bundle price. Expose what changes the patient's total.

04 · System

I reduced the MVP to one purchase spine across the core ordering paths.

Rather than rebuild every downstream screen, I concentrated engineering effort where the buying decision changed.

The MVP changed the sequence, patient-specific pricing, and final bundle summary. Existing stage, customization, and shipping behavior stayed wherever it still worked.

I deferred automatic bundle recommendations because the dependable rules and connected data across NetSuite and Salesforce did not yet exist. Instead of delaying the launch or presenting an unreliable answer, the MVP let doctors compare the patient-specific totals directly.

Desktop checkout screen for comparing and selecting a bundle
01

Choose the purchase model

Compare bundle and à la carte using the total aligners needed for this patient.

Desktop checkout screen for selecting aligner stages
02

Select stages

Choose which aligner stages are included in today's order.

Desktop checkout screen for selecting the shipping address and delivery service
03

Confirm fulfillment

Select the shipping address, delivery speed, and packaging before review.

Desktop checkout summary showing the selected bundle and final order details
04

Review before checkout

Confirm the selected bundle, what this order uses, what remains, and the final total.

The MVP changed where the decision happened—not everything downstream.

05 · Evolution

In uCloud, ordering became a full-screen flow with the bundle balance carried across every step.

The desktop MVP made one purchase understandable. The web platform needed to make the remaining bundle legible across future orders.

The desktop flow opened ordering in a modal over the 3D case because doctors once needed the treatment model nearby. In uCloud, bundle selection and fulfillment no longer required that reference.

I moved ordering into a dedicated full-screen flow. The extra space clarified progress, kept the patient and bundle context visible, and gave each purchasing decision enough room without competing with the treatment workspace.

uDesign Cloud bundle selection showing remaining order and bundle allotment meters
1

Case need stays visibleThe doctor sees what remains to complete this patient's treatment.

2

Bundle balance is separateThe remaining aligners and retainers in the bundle persist across orders.

3

Current purchase modelThe active bundle remains explicit before another order changes its balance.

Dedicated full-screen flow

Full-screen uCloud bundle selection step
01

Select bundle

Compare bundles with à la carte while the remaining treatment need stays visible.

Full-screen uCloud stage selection step
02

Select stages

Choose the aligners and retainers included in this order.

Full-screen uCloud customization step
03

Customize the order

Set coverage and case options after the purchasing model is established.

Full-screen uCloud shipping and packaging step
04

Choose fulfillment

Confirm the address, delivery speed, and packaging in one dedicated step.

Full-screen uCloud final order review
05

Review and place order

See the bundle used, remaining allotment, included services, and final total before committing.

The first build made one order honest. The second made three years of them legible.

06 · Impact & reflection

The bundle strategy and redesigned flow launched together—and sales rose.

COMPANY-REPORTED OUTCOME

60%

increase in product sales after launch

The pricing program and redesigned flow co-launched. I no longer have the reporting window, so I treat this as directional and do not attribute the result to design alone.

01

What I'd do again

Argue transparency in business terms. “A doctor surprised at checkout calls support and doesn't come back” was more actionable than an ethical appeal alone.

02

What I'd measure

Track bundle selection, backtracking, abandonment, support contacts, and tier distribution—not only completed orders.

03

What I learned

Recommendation can be valuable, but clarity should not wait for intelligence the system cannot yet support. Ship the trustworthy comparison first; add guidance when the rules and data are ready.

Next case study

Kognitos — You can't trust what you can't see →