Case Study: Progress Hardware

Helping a humble hardware store make the ecommerce leap


Project Synopsis:

A local hardware shop is interested in converting their website into an online retail outlet

Problem Definition:

How do you create a competitive ecommerce site while retaining the personal ‘hardware shop’ experience?

Users will be skeptical of a small shop selling online in the same space as giants such as Amazon; there is an immediate fight for legitimacy. At the same time, it is important to retain the aspects of the company which have bred a loyal customer base and kept its physical location in business for over 50 years.

Solution Overview Statement

Provide an ecommerce experience users will recognize while wowing with superior customer support and expert insight

In order to establish itself as a legitimate online retailer, Progress Hardware’s site should look and feel like the ecommerce sites users are most familiar with, such as Amazon.com and Walmart.com.

The Home page offers a static header with search and browse functionality above modules linking to additional deals/services. This is a recognizable format for users as it is similar to most top ecommerce sites

Progress’ customer support and expert staff is what has set it apart from other hardware shops since its inception. By offering live chat for immediate support and product descriptions written by in-store staff, Progress will be able to set itself apart from other sites while leveraging what it has always been best at: nurturing customer trust.

Customers can initiate live chat with a Progress associate by clicking this blue help bubble, present on every screen. The functionality of this bubble is made clear on the home page

Process

Always be testing

Usability testing throughout this project provided invaluable insights. An early example of this was when I created a card sort to plot out the taxonomy of the site. I created a tentative category>subcategory structure under 4 head departments and then brought in some users to see if my structure was intuitive. Off the bat, I observed confusion over the difference between the Garden and Tools departments- users had difficulty intuiting under which of these departments they would find items such as shovels and chainsaws. This feedback influenced my next iteration of the taxonomy which narrowed down my groupings to just 3 head departments.

Usability testing showed my taxonomy was not as intuitive as I had hoped, leading to further iteration

Bend the mold

Though I borrowed ideas from other ecommerce sites, it was important to keep in mind fundamental differences between Progress Hardware and the likes of Amazon. A key difference is catalog: Amazon offers millions of products versus the mere hundreds offered by Progress. With a smaller catalog, I was free to experiment with a different way of presenting search results. I implemented a horizontal scroll which allows users to quickly browse all returned items while staying on a single page- a quicker and more responsive approach than the pagination offered by similar sites.\

Horizontal scroll allows users to quickly browse Progress’ more concise catalog without having to navigate to subsequent pages

Get users there faster

My design deliberately cuts down on the checkout process as a means of completing the user’s transaction faster. I began with questioning the need for a cart page when cart contents are already present (and editable) on the checkout page. By removing the cart page entirely, I was able to cutdown the checkout process by 1 click. By moving the login prompt to the checkout page, I was also able to remove the login page, saving users an additional click.

Consider personal pain points

Starting with my own dislike of login processes, I began surveying users to get their thoughts. As it turns out, I am not alone. Here are the 3 most common pain points I observed:

  1. It’s unclear whether or not the user already has an account
  2. Remembering one’s password is difficult without knowing the password requirements of the given site
  3. Creating a new account is time-consuming

My approach was to create a simple 2-field form which immediately verifies if the input email is registered to an account. If the email is not recognized, a message will appear informing the user that once they enter a password, a new account will automatically be created for them. To aid both scenarios, a tooltip is present informing the user of what the password requirements are.

Creating an account is as simple as logging in, either of which is optional and not required to purchase from the site.

Design Deliverables

Preserving the Progress experience for web, focusing on helping and informing users

Customers of Progress Hardware are accustomed to expert advice from a friendly staff. By offering aid and advice, Progress associates leave customers better informed and more confident in their buying decisions. This sort of rapport is sorely missing on most online retail sites.

My design aims to address this gap in experience between in-store and online by offering curated item descriptions and on-demand help.

This information is present below the fold on item pages

1. Video demonstration performed by Progress associate

2. Description and best features of the product, written by a Progress Associate

3. Live chat button which is present on every page

A full featured ecommerce site

Backing up the unique experience detailed above, my design provides a simple structure familiar to any user who has shopped online before.

Home Page
Search Results
Item Page (above the fold)
Checkout
Order Confirmation

Results/Reflections

A solid foundation, but more research is required

Usability testing has shown that the general flow of the design works. Users have also shown excitement for some of the new ideas on display, such as the streamlined checkout and login processes. However, further research would help flesh out portions of the site that received fewer resources during the design cycle. An example of this would be the home page; I would like to spend some time reading academic studies to determine how important this page is to ecommerce sites. While the home page was not a pain point during testing, there may be research supporting either expanding upon or narrowing the current scope offered by my design.

Show your support

Clapping shows how much you appreciated W. Bryan Jacobs’s story.