Rebuilding checkout to cut abandonment — without a single new feature
A focused redesign of a payments checkout that reduced cart abandonment and lifted conversion by investing entirely in the client.
Overview
Northwind’s checkout converted well below benchmark, and every percentage point was real revenue. The brief was deceptively simple: fewer drop-offs, no new features, no backend rewrite. The win had to come from judgment, not scope.
The problem
Instrumentation told a clear story: a third of users who reached payment never finished. The flow asked for the same information twice, validated fields only on submit, and re-rendered the entire form on every keystroke on mobile. It felt slow because it was slow.
My role
I led the rebuild end to end — owning the architecture, the state model, and the final polish — while partnering with a designer and the payments team. I made the call to keep the existing API and invest entirely in the client.
Approach
- Collapse the flow. Three steps became one scrollable form.
- Validate inline. Errors surfaced as you typed, not on submit.
- Kill the re-renders. Field-level subscriptions meant typing never re-rendered the page.
- Remove the stalls. Saved cards and address autofill retired the most common reasons people abandoned.
Results
- Abandonment fell 18% and conversion rose 11% in the first quarter — worth low seven figures annualized.
- Support tickets about “the checkout being broken” effectively disappeared.
What I’d do differently
I’d have shipped the field-level state change on its own first. It drove most of the perceived speed, and bundling it with the redesign made the win harder to attribute cleanly.