Home Decor

UX Case Study

CTW's B2B Checkout Improvements

Tasks
  • Research
  • Usability Testing
  • Heuristic Evaluation
  • Comparative Analysis
  • Wire Framing
  • Testing
Team

CTW (Internal)

  • Senior UX Designer
    (Brian Herard)
  • Vice President

CIMcloud (External)

  • Project Manger
  • Web Designer
  • Developers
Tools
  • Photoshop
  • Illustrator
  • HTML5/CSS3
  • Chrome Dev-Tools
  • Pen & Paper


Female Shop Owner
The typical CTW customer is female, between the ages of 45-65.

Business Overview

Colonial Tin Works (CTW) is a longtime wholesaler of home decor items, serving small independent retailers, and more recently dropship e-tailers. Shop owners, who conduct business on CTW’s website, are required to be logged in to their accounts to view pricing and make purchases.

Average Audience

  • Gender: Female
  • Age: 45-65
  • Occupation: Shop Owner

CTW Checkout On Multiple Devices
Unnecessary form fields and missing shipping methods on shipping page.

Issue

CTW had grown their B2B conversion rate to a healthy 6.4%. After implementing a new e-commerce platform, conversion slipped by 1.1%. The company’s goal was to return to a 6-8% conversion rate, a figure that is consistent with established business-to-business operations.

Findings

The new site added many useful features to help customers make buying decisions, but after conducting usability tests with a select group of CTW customers, we learned that visitors were struggling in checkout and a significant portion weren’t completing their purchases. A heuristic evaluation of the checkout confirms the usability test findings. Three issues were commonly reported:

  1. Customers visiting the site reported too many unnecessary fields. Generally not part of the checkout process, billing contact and address information, not to be confused with payment method, is available for editing. This information is obtained during account registration and rarely changes.

  2. Guests were puzzled by the absence of shipping method options after the ship to address section. Shipping methods can be found in CTW’s second step of checkout, which is the payment page.

  3. Visitors of the site found it confusing to use content tabs as payment options for selecting credit card vs. net 30 invoicing.

Comparative analysis with major retail brands
Comparative analysis with major e-commerce contenders.


Wire frame sketches for web designer and developers.

Solution

In completing a comparative analysis, using giants in the retail e-commerce space like Amazon, Walmart, Home Depot, etc., it was obvious that checkout best practices generally keep it simple with 2-3 steps as follows:

  1. Gather ship to address and shipping method
  2. Collect payment
  3. Display order confirmation

The changes to CTW’s checkout process directly align with the best practices outlined in the comparative analysis above. They include the simple 3 step process of gathering shipping address and method, payment collection, and order confirmation. In addition, the payment method uses radio buttons, instead of tabs, to select payment options.

These changes effect the e-commerce platform’s core code base and required customization to the CTW website. Wire frame sketches were provide to the web designer and developers as reference. The core code base of the CIMcloud platform will be changed in future feature sets of the product.


Results

After implementing changes to CTW’s checkout process, user adoption of the improvements increased and the conversion rate for the website returned to 6-8%.