Nike Checkout
UX | UI re-vamp of any checkout process of my choosing in order to uncover pain points during a checkout process.

Project:

Use existing e-commerce website logo, header, and footer UI to create a delightful checkout experience.

I chose to go with the checkout process of Nike; I know, pretty bold move, but even great companies can improve.

Challenge:

Improve or modify checkout process from cart to confirmation focusing on user-centric designs.

Solutions:

  • Gather user research and identify pain points during checkout.
  • Create wireframes and user flows for high fidelity user interface design.
  • Prioritize goals by bridging the user goals with business goals.
  • Keep checkout process light with minimal steps involved.

Using my research, I quickly developed a guide to connect Nike’s checkout goals with user checkout goals (in general).

popup image

Identifying Existing Problems:

Throughout my research and testing, I found some things even Nike might be able to improve upon to better the checkout experience.

One feature I wanted to improve was the CTA buttons. Making them bolder and brighter calls a more focused attention on where the user should go next to reach the goal in successfully purchasing an item.

popup image

Upon selecting an item for purchase, the user is able to go to cart or checkout. This is conveniently placed in the header but disappears after about 5 seconds or so. This increased frustration in single item purchasing for the user.

popup image

Simple, Honest User Flow

In order to improve upon the current checkout process, I began sketching user paths that would simplify the steps, focusing on high contrast CTA’s where necessary for the user to make a quick sensible decision.

popup image

Low Fidelity User Flows

Here’s where white-boarding skills come in handy. By sketching dozens of low-fidelity user flows on the whiteboard, it allowed me to simplify each round of sketches. The main goal throughout was to be clear in where the user must go next, with as minimal steps as possible.

Guest Checkout

popup image

Member Checkout

popup image

High Fidelity Wire Frames and UI

Designing the user experience in an attempt to improve a brand like Nike was challenging. Nike’s architecture and user flow strategy were already well done.

Through subtle, yet valuable changes in the UI gave way to better understanding of how a user might be compelled to focus on the next step through eye-catching, simple and clean calls to action.

Checkout Process for Guest

popup image

Checkout Happy Path

popup image

Desktop Member Checkout

popup image