Iron American
E-commerce website redesign to improve
accessibility and increase sales
Tools
  • Maze
  • Otter.ai
  • Figma
Team
  • Software Dev:
    Michael Waters
  • UX Designer:
    Sabrina Saffer
Duration
2 days
Field
UX Design
Problem
Customers on the Iron American website often encountered difficulty when attempting to purchase products due to a lack of clarity in what exactly they were ordering. In order to address this issue and boost conversion rates, the client sought to reduce confusion among users.
Solution
My Design Process
1Usability Test
2Product Titles
4Copy
5Photos
6Next Steps
Usability Testing in Maze
Usability Test
In order to determine the users' pain points, I created a usability test in maze. My goal was to discover the obstacles within the information architecture. I wanted to pinpoint the steps in which the user got stuck.
Mission
I asked the user to find the "2 and 4 Barbell Wall Storage Rack," determine its color, and add it to the cart. I wanted to see if the user was able to locate products, understand the product description, and purchase the product.
“I don't know what an Iron American 2 & 4 Wall Storage Rack is so I had no idea what I was looking for, even when I found it I had to click everywhere imaginable to figure out how to find out more details, and even then I only got the details from looking at the picture.”
Research Findings
Users struggled to locate the product and only 50% of users labeled its color correctly but 100% of users added the product to the cart with ease. I decided to focus on improving information architecture as well as the product details.
“I don't know what an Iron American 2 & 4 Wall Storage Rack is so I had no idea what I was looking for, even when I found it I had to click everywhere imaginable to figure out how to find out more details, and even then I only got the details from looking at the picture.”
- Anonymous
Product Titles
Problem 1.  
Given the title, the users did not understand which product to look for.
Use Simple, Descriptive Product Titles
Create Product Variants
Variations make it easier for shoppers to discover exactly what they're looking for and discover alternate options that they may prefer instead (or in addition to) what they were originally searching for.
Item list
Copy
Problem 5.  
Fifty percent of users failed to determine that the product was black. Even when the users reached the product description page, they didn’t understand the product details description.
Write Clear and Persuasive Copy
Utilize accordions to organize and consolidate information.
Utilize accordions to organize and consolidate information.
Utilize accordions to organize and consolidate information.
Proofread
Display relevant product description. Description should not display description for other sizes/ strengths
Photos
Display Photos That Portray the Product's Purpose
Remove duplicate photos. This will confuse the user.
Remove duplicate photos. This will confuse the user.
Remove blurry images
Remove blurry images
Display 1 per image unless necessary. Description page photos should have horizontal scrolling on mobile. It’s easier to navigate than trying to click tiny images. Also don’t crop out parts of gym equipment such as gym mats
Display 1 per image unless necessary. Description page photos should have horizontal scrolling on mobile. It’s easier to navigate than trying to click tiny images. Also don’t crop out parts of gym equipment such as gym mats
Next Steps
Learnings
  • Use descriptive and simple text and images.
  • Clients that are familiar with their product don't always realize how the user views it.
  • Usability tests demonstrate flaws in information architecture.
Next Steps
  • Work on Blog.
  • Retake some product photos which are blurry or unclear.
  • Preform another usability test after improvements are made.
  • Improve product descriptions.
  • Preform a card sorting test to determine the best categories to create for products.