Cart, Checkout and Save for Later

Launched October 2020
Updated March 2021

The new Kohl's Checkout on a laptopThe Kohl's Cart and Checkout on a phone

About the project

The competitive landscape

This project started in 2016 but didn't really gain traction until late 2018. By that point our competitors had spent a year or more improving their checkout experiences and Amazon had established their 1-Click Checkout.

The business

Kohl's is very traditional compared to modern e-commerce sites. The vast majority of revenue comes from in-store transactions.

Up to this point the checkout experience had been redesigned around 2008 but the full vision was never achieved and updates had been bolted on, haphazardly, for a decade.

The customer

Coupon shopping is a core part of the shopping experience and the business model. It's rare for a customer to pay full price for anything but the process to get there was full of friction.

My contribution

I took over the design lead duties partway through this project. I helped define the vision and my job was to bring it to life. I collaborated with our research team, business stakeholders, leadership, Customer Service and designers on other experiences to bring this experience to life.

The early team

Design as a silo

Our UX team wasn't embedded in a product team like most tech companies, instead we were in between the business teams and the Product Manager. Some of our engineering teams were on-site but most of them were in other countries.

Communication between the designer and the engineers was sparse if at all. Generally design and engineering communication were passed through the Product Manager, leaving room for miscommunication and outdated assumptions.


Design as a partner in a squad structure

After a "digital transformation" we reorganized into squads. Being a legacy designer I still had connections to the business and marketing teams, that created more cooks in the kitchen but allowed for less product churn while the new product teams (and many new employees) started to understand how the Kohl's organization functioned.

Overview of the process

A years long project

The project lasted about 4 years from inception to launch and it required dozens of compromises, a great deal of stakeholder buy-in and an insane amount of back and forth during development.

My Kohl's Design process

Some content is under an NDA.

Show me

Before the project

Years of insights from previous projects

Across many projects, features and updates I was able to understand more about the business, the customer and systems that connect the two.

Where we started

A multi-step process in a Buy-it-now world

The last time Kohl's redesigned the Checkout experience was 2008. We had a full decade of bolt-on experiences, added requirements and institutional knowledge spread across teams.

How we started

Mapping decision points

We can talk about screens, time on task, number of inputs and other measures but I felt the best way to evaluate our experience was to create an objective graph of the options we require and allow at each step of the checkout process.

I sat with our stakeholders to map out pain points and customer frustration. This helped us build more buy-in and start to uncover assumptions.

Some content is under NDA

Show me

Talking to stakeholders

Understanding what we knew

Once we uncovered the larger view, I started talking to individual stakeholders. It's amazing to see the knowledge and expertise across various disciplines. It helped to see the things we don't often talk about because we're focused on what we think is the most important thing.

"I need to buy my kid new shoes and school supplies but I can only buy some of it this week. I get paid next week. I just don't have the money now."

Talking to customers

Challenging our assumptions

Customers build a cart over weeks or months. We had to get creative to get really useful insights. While testing prototypes, I developed an animation to reset customer expectations and mimic the passage of time.

This intentional distraction helped us understand more about customer mental models when items fall out of stock.

Critiquing competitors

Building business alignment by highlighting where others fall short

Our stakeholders often compared our designed experiences with competitors. Whether it was a way to ask questions, engage with the designers or just cut corners, it was something we often had to address.

I decided to embrace this. I ran a workshop with our stakeholders and we critiqued a competitor. From that point forward, rather than copying the experience, we used it as a jumping off point.

Some content is under NDA

Show me

Some content is under NDA

Show me

Overview of the process

How we got from a legacy insurance app to a new system

I met so many stakeholders from Loyalty, Credit, Discounts, Marketing, Business Operations and more. We moved from rough wireframes to refined ideas and with each conversation we were able to define the intentional change we wanted to see.

I was more informed about viewpoints and concerns so we could proactively address problems before they derailed the project.

The first North Star

Defining principles

We needed to make quick decisions but it's easy to lose track of the bigger picture when you're moving fast.

We developed a system and some principles that would help us make decisions. We also did this with buy-in from stakeholders so all of us were speaking the same language and making a cohesive product.

Defining our direction

After interviews and concept tests, research studies and gathering metrics, wireframing and refining the branding, we finally pitched our North Star vision.

There was a lot of work to do but this was a foundation that we could build on and it was a experience we could test toward.

Experiments to prove the concept

We didn't launch right away. First we had to prove this design was the best design for our customers. During the summer of 2020 we distilled our North Star into 14 rapid A/B tests.

With the scale at Kohl's we could quickly gather real customer data, refine our ideas and make a big impact.

After interviews and concept tests, research studies and gathering metrics, wireframing and refining the branding, we finally pitched our North Star vision.

The Kohl's Cart on a mobile screenThe Kohl's Checkout on a mobile screen

Adding save for later

A long awaited feature

There was one more thing. The design team understood the importance of a Save for Later feature years before we launched but we could never convince our business partners to build it.

With our rapid tests we were able to build our Out of Stock Tray, setting aside out of stock items and allowing customers to continue to check out.

This proved to be a huge conversion driver. Before this, a customer would need to manually remove each out of stock item. That success gave the business teams confidence in our design team and our idea.

Some content is under NDA

Show me
The new Kohl's Cart and Checkout experience on iPad

Why Save for Later?

Lessons from 10-years of de-scoping

This was the first fast-follow, it tested our cart and checkout system and forced us to refine our North Star.

Our customers requested this feature for a decade before we built it but the company didn't see a return on investment.

We were so wrong. So many of our customers want to simply set an item aside without losing the contents of their cart. A lot of these customers live paycheck to paycheck but still need to buy things like school supplies.

Kohl's Save for Later on a MacBook Pro

The results

Huge benefits for our customers

The updated experience was far more than just a new visual style. Every part of the cart and the Checkout were updated and built with the future of Kohl's in mind.


Weekly A/B tests in 14 weeks


Year-over-year sales increase


Increase in conversion (our goal was 5%)