People change their mind in the cart

The spark

Toronto Cupcakes is a well-liked local bakery, and the website did not read like it. Browsing was a wall of thumbnails. Product pages were thin on the detail people needed in order to choose. Checkout ran long enough to lose people partway through.

The brief was narrow on purpose: redesign around how people actually buy a cupcake. Find something good, adjust it, gift it if that is the point, pay without friction.

Before: a wall of thumbnails, per-item manual quantity selection, no filters, no nutrition information, and generic add-to-cart buttons.

The dig

Three usability sessions on the prototype, run to find what we had missed rather than to confirm what we already believed. That distinction decided the script. We asked people to complete a purchase, not to react to a design.

The most useful output was not a metric. It was how people described the friction in their own words, and the quotes did more to shape the redesign than the heuristic pass did.

I would like to add some cream on it. But wait, no option for that?

Oh! How do I gift someone?

I need to see where my cupcake is right now. There is no way I can track my orders!

The shift

We had been treating this as a browsing problem: crowded grid, thin pages, fix the discovery layer. Testing moved the centre of the project to the cart.

What all three sessions had in common was people wanting to change their mind late, adding cream, making it a gift, checking where the order is, against a flow that made them navigate backwards to do any of it. Every one of those moments happened at or after the cart, and every one of them required leaving it.

So customisation moved next to the cart instead of living only on the product page. That is a small architectural change and it was the whole redesign. Once adjustments were possible where the decision was being made, people stopped backtracking.

Three sessions, three late decisions, one flow that pointed the wrong way.

The build

Five features, each traceable to something a person said in testing rather than to a feature list.

• Filters by cake base, frosting, rating, and calories, so finding something specific does not mean scrolling.
• Nutrition on every product page, for customers making a conscious choice.
• Ratings on every product. Confidence on the page reduces hesitation in the cart.
• Customisation of toppings, frosting, and quantity, on the product page and from the cart.
• Scan card at the top of the payment screen, for the tap-to-pay flow people already expect.

Four changes came straight out of the three sessions: Order Now in the header, customisation in the cart, the scan-card option lifted to the top of the payment screen where it was being missed, and the separate email-for-tracking page removed, with email captured inline instead.

The brand system organised the bakery’s existing palette rather than replacing it. Mulberry as primary, baby pink for the soft touches, black and white for structure, on a six-step heading scale from 56px down to 20px. Enough hierarchy without inventing dozens of variants. Mobile and web prototypes were delivered with consistent flows across both.

The palette was already right. It needed a system, not a rebrand.

Constraints

Three sessions. That finds gaps and it does not measure anything, so nothing in this case study is a rate, and a fourth session would probably have produced a fifth change.

It was a prototype engagement. No code shipped, so there are no live conversion figures, and the claim that removing the email-tracking page helps is supported by watching three people and by nothing else.

Order tracking itself was out of scope. A participant asked for it directly, we recorded it, and delivering it needs fulfilment data the brief did not include. The redesign captures the email inline instead of building the page around it, which is a smaller answer to the question that was asked.

And the palette was inherited. Mulberry on baby pink is the bakery’s, it was not contrast-audited as part of this engagement, and that check belongs in the handover rather than in the case study.

The proof

A prototype engagement, so the signal is what changed in testing and what came out of the flow.

Four changes out of three sessions is a high yield for that sample size, and it says something about running sessions to find gaps rather than to validate. Breadcrumbs through checkout meant people always knew where they were. The single biggest change was a removal: cutting the separate email-tracking page. Once adjustments lived in the cart, the backtracking in sessions stopped.

A bakery’s website should feel like the bakery: warm, generous, easy to walk into. That was the principle every screen got checked against.

The lesson

Cut more than you add. The most useful thing I did on this project was delete a page, and it took three sessions of watching people before I was willing to. I now go into testing with a list of things I suspect could be removed, not just a list of things I might build. Subtraction is design too, and it is much harder to argue for without evidence.