Saber Steel, LLC
A Website Redesign Case Study
UX Design · UI Design · Prototyping · Responsive Web Design
Project Specs
Role: UX Designer
Date: Nov-Dec 2023
Project Duration: 6 Weeks
Tools Used: Figma, VS Code, Google Analytics
Site: Sabersteel, LLC
Project Overview
Saber Steel, LLC is a privately owned rebar fabrication facility strategically located near Memphis, TN. Their website had not been updated for some time and needed an overhaul.
The Problem
Saber Steel, LLC has expanded its business since its founding in 2017 and the website did not accurately represent the business as it is today. The information about the business itself was minimal and there was not enough detail on the products and services offered. The industry at large has also had a major shift toward a younger demographic and a website is often their first impression of a business.
The Solution
An update to the website that accurately represents the business as it is today, with more in-depth information on the products and services offered. The website should also tell the more about the company, their values, and their qualifications.
The Design Process
01- Website Analysis & Research
02- Information Architecture
03- Prototyping & Testing
01- Website Analysis & Research
Website Analysis
Saber Steel's website had not been updated since the summer of 2020. The font size across the website appeared too small. In some places, the color contrast did not meet accessibility guidelines. Images across the site were too big, too small, and many were missing crucial alt tags.
There was also a bare minimum of information available about the company, the products it offered, and the services it had available.
Google Analytics
For my research, I decided to look over a 3 month period of Google Analytics insights for Saber Steel. From January 1 to March 31, 2023, there were only 627 visitors to Saber Steel. The event count was at 4.4k.
Of the 627 users, 78.5% accessed the site via desktop, 21.2% through mobile devices, and 0.3% used a tablet. Most users-71%-were using Windows. And 73.4% of users accessed the site with Google Chrome as their preferred browser.
For all of 2023, there were only 2.6k visitors to the site.
One of my goals for the redesign was to significantly increase site traffic over a three month period.
User Needs
Team members at Saber Steel needed the cities and states listed for their certifications —Disadvantaged Business Enterprise, Minority Business Enterprise, and Service Disabled Veteran Owned Business—to be updated. An additional certificate for the Indian Incentive Program needed to be added to the site.
They also wanted organizations that they were members of—The Tennessee Road Builders Association and the Mississippi Road Builders Association—to be mentioned on the website.
Lastly, Saber Steel wanted to emphasize that they are US-owned and operated business. They asked that "Made In USA" be included on the site.
Competitor Analysis
For the Competitor Analysis, I looked at four other steel fabrication companies. All four of these facilities had a few common elements among them:
- A "Company" page listed first in the site navigation.
- Individual pages for each of the products on offer.
- In-depth explanations of the products and how they're used in construction.
Recommended Site Changes
After analyzing several competitor websites, the Saber Steel website, and speaking with team members at Saber Steel, several recommendations were made for updating the website:
- Add an "Our Company" page and make it the first page of the navigation bar.
- Change the "Products & Markets" page to just be the "Products" page.
- Create individual pages for the products offered.
- Create a "Services" page.
- Create individual pages for the Services on offer.
- Update the list of places where the company has certifications.
- Include additional certification.
- Include a membership section.
- Have "Made in USA" somewhere on the site, preferably in the footer.
02- Information Architecture
2020-2023 Sitemap
From 2020-2023, the website only had three pages: Home, Products & Markets, and Contact. Outside of the company's cerifications, contact information, and a brief overview of the products and services on offer, there wasn't much else. The website needed more information and it would need many more pages to convey all of that information.
2024 Sitemap
For the site redesign, I strongly recommended creating an "Our Company" page and having that listed first in the navigation. I also suggested changing the "Products & Markets" page to just "Products" and creating a "Services" page. With the Contact page, this meant there would now be 5 main pages for the website.
In addition to these 5 main pages, 7 subpages would be created. 3 for Products—Rebar, GFRP, and Piling—and 4 under Services—Fabrication, Furnish & Install, Pre-Tied Rebar, and Shipping.
03- Prototyping & Testing
Mid-Fi Prototypes
After speaking with Saber Steel team members about the wants and needs for the website and gathering information about their products and services, I was able to rework existng pages and create all new pages for the mid-fi prototype.
The font used for the website changed at this point from Helvetica to Montserrat. The latter felt more industrial and it came with many variations in styles and weights.
Mid-Fi User Feedback
Users liked the layout of the site in the prototypes over what was then the site's current iteration. Some feedback included removing some phrasing that made the company sound more amateurish and removing a suggested table on the "Products" page.
Hi-Fi Prototypes
For the Hi-Fi Prototypes, I added color and images to the home page so the team could see what the final product might look like. I experimented with having a darker color for the navigation bar, but the team was fond of the original blue and asked for it to be changed back.
The team at Saber Steel asked for the "bent rebar" logo to be overlayed over the hero image again in exchange for the plain text.
Hi-Fi User Feedback
The Saber Steel team loved the images and seeing the site in full color. The main feedback asked for the navigation bar to go back to the original blue used on the old website and to add back the logo as an overlay on the hero image.
Final Iteration
For the final iteration of the website, I changed the color of the navigation bar back to the orignal blue as requested by the Saber Steel, LLC team and I overlayed their logo on the hero image.
As the site was coming together, it was evident that the new site design looked too similar to the old site design, so I took out the image in the "Our Company" blurb on the home page, centered the text in that section, and gave the space a dark blue background to make for a more visually interesting feature section.
Results
The updated website went live on January 4, 2024. Within a week of the new site being up, Saber Steel, LLC had landed one major job and were in talks with two other potential jobs. All three specifically cited the website as their reason for getting in contact.
New Google Analytics
The number of visitors to the site increased substantially. From January 1-March 31, 2024, there were 2.1k users to Saber Steel, LLC's website with 9.9k in Event Counts. Meaning in a three month period, the site redesign has almost surpassed its visitor numbers for the previous year.
Updates & Future Developments
Since the new site design launched, I've added a new certification— the Tennessee Governor's Office of Diversity Business Enterprise—and a new membership—the Associated General Contractors of Missouri—to the Company page.
I've also implemented a favicon across the site, which had not been present at the site's launch.
In the future, I would like to add a projects page to the site with photos of the finished projects and relevant projet specs. I would also like a testimonial section added to the home page.