Streamline Checkout Flow


The checkout flow of this website was often described as clunky, slow, outdated and difficult to navigate. In response the Business wanted to eliminate most of the steps in the process to reduce this perceived friction. Along with listening to feedback from the Call Center and reviewing surveys and Customer Support emails, I could see where most of this friction occurred by looking at abandonment data from each of the checkout steps and where users were revisiting last steps.

While everyone wanted to improve the process by providing a more fluid experience, the perception that the fact that the checkout had multiple steps was obscuring the real problems going on behind the scenes with the platform and website on several levels.

The challenge became: could we streamline the checkout process by essentially making it appear as a single step/page, while addressing the real problems without biting off more than we could chew in the time given to complete the project?

Those of us in the weeds understood the cause of the underlying issues with the checkout process, which included major defects with the underlying code that often-prevented users from logging in, resetting their passwords. Worse, calls to the database were often slow and had the propensity to time-out. There were also problems that too often prevented new account setup for first time customers.

The other roadblock for users was the handling of messages and promotions when it came time for someone to choose whether they wanted to join our loyalty and rewards program. The system responded as it was programmed to respond, but the order of how promotions were applied to the customers order started at the Shopping Cart page. Selection to enroll in the loyalty and rewards program during checkout changed the customers promotion – kicking out any earlier promotion without warning, explanation or way to reverse their selection.  This unexpected change to the customer’s cart caused much confusion and abandonments – and complaints. To fix this sizable issue would require much more than streamlining the checkout to change the interface behavior. It would require an entire change in how operations processed and what promotions fired when.

The entire team realized this would be a large project, but we took it on in earnest.

The initial solution shown in these wireframes was more of a change to how users interacted with the same number of steps – but in a fluid manner as opposed to a page by page experience – but now taking into account the flow issues with promotions and messaging, as well as changing how user account login and setup was handled.  Many iterations later, a prototype was developed that gave the development team an interactive interface to build into.

Of course that’s where the heavy lifting came in – the development team fixing the underlying problems with the code processing, and working in all the logic for the complex rules that make up the offer, loyalty and rewards programs that were being built in code behind the scenes during the checkout process.

Nearly a year later and many frustrating days behind us, we realized that we did bite off more than we could chew, and we relented. The final version of the fluid, single step checkout never made it to a production environment. The load of the business logic surrounding all the operations that a single page had to support was too much for the state of the ecommerce platform. Instead, we implemented some of the improvements to the process including:

  • Improved account creation process
  • Fixed the problem with the password reset
  • Moved the new/existing customer login to the cart page to allow us to move appropriate messaging to the cart page.
  • Re-coded the existing checkout to be responsive and mobile friendly.

We did not address the order of operations issues with promotions. Instead we worked to improve messaging on those pages.

And finally, the Business accepted that it was time to move to a new ecommerce platform.