Cutting checkout friction for a small e-commerce brand

Problem: visitors reached checkout, but didn't buy

LazyHat was getting visitors all the way to checkout, but too many didn't complete the purchase.The founder knew she was losing sales at the final step, she just didn't know why.

Challenge: fix it without analytics or direct site access

LazyHat had no analytics tools installed, so there was no historical data on where or why customers dropped off. With no direct access to the site and a three-week window, we relied on a stakeholder interview, a user survey and moderated usability testing to identify the problems directly. Every change also had to go through the founder.

The evidence had to come from users, not dashboards.

Research: the survey told us where to look, the sessions showed us what was happening

We started with internal alignment, a stakeholder interview and a competitive analysis. These set the business context and showed us how comparable stores handle checkout.

We surveyed 22 online shoppers about their checkout habits and what makes them abandon apurchase in general. The responses were consistent:

• 91% would abandon if shipping costs appeared only at the final step

  
  

• 59% would abandon if the process felt too long or complicated

  
  

• 54% named unclear instructions or labels as a top frustration

  
  

• 45% pointed to too many fields

The survey pointed to three recurring themes: price transparency, form complexity and trust at the point of payment. Of these, form complexity was the one fully within our control for this project, and it became the focus of the redesign.

These patterns focused our interview questions on form structure, labels and required fields. In 4 moderated sessions on LazyHat’s live checkout, participants confirmed what the survey had pointed to, and ran into issues specific to this checkout, the most serious being a mandatory tax code field.

The tax code field was the clearest example: placed right before payment, it stopped every participant at the exact moment they were ready to pay. It was the single biggest blocker, but not the only one.

The sessions also showed that some required fields felt unnecessary, that the order of the formwas hard to follow, and that key elements were difficult to read. Checking the interface againstWCAG contrast requirements then confirmed an accessibility issue with the primary call-to-action.

Solution: a shorter, clearer form that asks only for what the order needs

We focused on the data entry step, where friction was most concentrated. We moved from mid-fi wireframes to a hi-fi prototype, which the founder then implemented on the live site.

Removing the blocker

The tax code field wasn’t arbitrary: the founder’s accountant had advised including it for invoicing. In practice, it’s only needed when a customer asks for an invoice, yet the form required it from everyone, right before payment. We removed it from the checkout, so customers no longer hit an unexpected request at the moment they’re ready to pay. Customers who need an invoice can contact the founder directly.

Asking for less

Every required field was reviewed against one question: does fulfilling a hat order actually depend on this? Email stayed required, since the order is confirmed there. The phone number became optional, and fields that weren't needed were removed. Required fields went from 11 to 8, the form now asks for what it needs and makes the rest optional.

Making the main action visible to everyone

With at least 2.2 billion people living with a vision impairment (WHO), the button that completes the purchase has to be readable by everyone. Ours fell short of the WCAG AA standard, so we delivered an accessibility report recommending a compliant colour.