I joined Fabric.com to help with the website refresh project. It had been over 10 years since the last website refresh to the site. The first task I started on was Cart & Checkout. This task when I joined was behind schedule & needed help getting the UX and design visuals.

The goal of the Cart/Checkout Website Upgrade task is to improve the CX as customers are towards the end of their shopping pre-purchase shopping journey. We believe that creating a more frictionless experience will help drive conversion. Our first requirements are focused on solving for existing customer challenges and pain points.

Brief

Checkout Experience

They had prepared a comprehensive Business Requirements Document, outlining their thoughts on what the problems with their old site were and what the scope of the redesign should be. Many of the suggestions were far too specific and even started suggesting actual solutions. I went through the BRD line-by-line to get to the core of their issues with the current site. This, along with an independent analysis of the old site, helped define the problems I was solving and set expectations accordingly.

Define the Problems

I began by researching and studying other checkout experiences by our competitors. I noticed that the majority of them were using a multistep checkout process rather than a single page. I also looked at other, more well-known e- commence sites to analyze the type of experiences that they might be using. I then noticed that a lot of them were using the single page checkout unlike most of our competitors. After analyzing the different processes all these companies were using I began to look deeper into what went into each one.

Research & Inspiration

Understanding that this task is currently behind schedule and we need to make sure that we can still hit our proposed deadline, I moved forward with the idea of a single page checkout. Using all the data and information collected in the research & inspiration phase I believe that we will be able to provide the best CX this way while also providing a lower lift for our dev team to get us back on track. Below is each section broken out with the new features and solutions.

Wireframes & Solutions

Having finished much of the layout and content, it was time to proceed with the visual design.

Visual Design

In the BRD this page needed to be a low lift visual update with the addition of all the new payment options. Adding the 3 payment methods to this page will give the customer an upfront knowledge of ways to pay before starting the checkout process.

Cart

I had a strong push to remove our guest checkout experience flow but after looking at the data I noticed that we currently have a good number of sales using our guest flow. So my recommendation was that we should deemphasize our guest checkout while still offering it, try to improve our account creation numbers and eventually create a rewards program for customers and then remove our guest checkout option altogether.

Sign-in Options

This is the major part of the project that I wanted to improve. This is where we take shipping, payment, order review, order summary and put them into our single page flow. In order to provide the flexibility & simplification I wanted, I used the collapse method while offering the option to make changes to your information. Another challenge was drop-shipping. so I had to come up with a way to display that without confusion.

Checkout

UI/UX Design   |   Amazon   |   Feb - Aug 2020