Cart, Checkout and Save for Later

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.

Reorganizing

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.

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.

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.

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.

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.

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.

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.

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.