company background & intro
API is a global metrology company that specializes in the sale of measurement & calibration products/services. The company is well-know for their award winning Radian Laser Tracker which is used to measure very large, high-precision parts with extremly tight tolerances. Industries they serve include Aerospace, Shipping & Transportation, Military & Defense, Manufacturing, Automotive, & Robotics.
my role
I worked as a Marketing Designer for the company. I was mainly responsible for the website redesign but I also assisted with the rebranding of the company as well. The duration of the redesign & rebrand took 6 months with a team of 3 people.
the problem & project goals
API has been serving its customers for 30 years, however the growth of the company has always been a struggle. Even though they were able to maintain strategic partnership and customers, their brand awareness was very low.
Our team, noticed many issues with the company's branding that needed to be changed. These issues also translated over to its website which I was mainly responsible for. Some of the key issues our team noticed with the website include the following.
- Poor overall visual design
- Hard To Use Navigation
- Low Conversion Rates < 1%
- Long average session duration
- Poor product imagery
Our team put together the following project goals within the 6 month timeline we were given.
- Create new brand identity & visual design.
- Implement website redesign with improved UX.
- Increase website engagement & conversion rate to at least 2%.
the process
discover
- Analyze KPIs
- Interviews
- Personas
- Competitive Analysis
define
- Information Architecture
- Sketches
- Wireframing
design
- Brand Identity
- Visual Design
- Development
measure
- Review KPIs
- Share Insights
- Next Steps
reasearch & discovery
I spent the first month on the project doing research & discovery. Our team needed a baseline to show to stakeholders that a new brand identity would improve the issues found on the website and also improve the overall customer experience. During this phase I also learned more about our users & customers and some potential pain-points we needed to account for.
analyzing website performance
I implemented Google Analytics & Google Tag Manager on the current website to determine KPIs such as goal conversion rate, avg session duration, bounce rate, and device use information.
We had the following goals established on the website.
- Request Service Quote
- Request Product Demo
- Download PDFs and Digital Brochures.
- Newsletter Sign-ups
Are we successfully engaging our users who visit the website?
After a 1-2 months of data collection we found that we had a average conversion rate of 0.89%. This was pretty poor considering the industry goal is around a 2% conversion rate.
How long does it take our users to navigate our website? Are they able successfully find what they need?
For the users who didn't immediately bounce off our website, we found that average session duration to be around 4-5 minutes. Taking this KPI along with the low conversion rate, our team made the assumption that this high average session duration is probably due to users not successfully finding what they need.
How many of our users are on a Desktop/Laptop devices vs Mobile Devices?
We found that majority of our users who visit are website use Desktop/Laptop devices vs Mobile Devices. About 60% were Desktop/Laptop users while 40% were mobile.
interviews & personas
After analyzing the website KPIs, I wanted to learn more about the company, it's customers, & the metrology industry as a whole. I was able to interview 3 key stakeholders in the company from the following departments: Sales, Technical Support, & Product Management (Hardware).
- How long have you been in your current role with your company?
- What is your primary responsibility?
- What does a typical work day consist of?
- What applications do you use to carry out your responsibilities?
- Who is involved in the buying process? Who initiates the process and who makes the final decision?
- What steps do customers go through before making a buying decision?
- What are the top issues/problems you have heard from customers using API products?
- Do you routinely collaborate with others, and if so, how often.
I also did some online research and synthesized the information gathered from the interviews to come up with the personas below.
competitive analysis
API has two main competitors for its measurement products/services. Hexagon is the largest of the two while Faro is second largest. While looking at these sites, I took note of the following.
- Overall Visual Design
- Navigation
- Product Page Design
- Imagery/Media
- Copy
- Call-To-Actions
While API was behind in many of these areas, I noticed that improvements to the product page design and navigation could provide a better competitive advantage.
Another key observation is that brand identity of both Hexagon & Faro was much better. Thus concluding that improving the brand identity for API will help with the overall visual design issues.
information architecture
Our team held a workshop with the stakeholders to come up with the proposed sitemap/IA of the new website. We reviewed the content organized on competitor sites, information from the interviews, & goals of the company. These activities helped us create the sitemap/IA below.
wireframing
Next step was coming up with the wireframes for the following pages/features.
- Homepage
- Navigation
- Product Page
- Service Page
- Request Contact Form
Our team initially had a brainstorming session on what these pages could look like. We reviewed all the information collected from the previous steps and used Balsamiq to get an overall idea of layout for these pages.
final design & development
Once we had the proposed wireframes complete, our team worked on designing & developing the new site.Our team came up with proposed visual identity for the company. The new logo, tagline, colors, & imagery is more aligned to the company's vision.
homepage design
This was the final homepage design that was launched on the website. Hero section contains all the new promotions for products, new articles, and services offered. The page also contains current company offerings and all the products available on one page.
navigation design
The new and improved navigation recieved positive feedback from users and stakeholders. Having a description & imagery within the mega menu help users find what they needed faster.
product page design
This product page design was applied to all products on the new website. Each page has slight variations to it such as additional hero images, additional product sections but still closely resembled the original wireframes.
final results and lessons learned
3 Months after website launch our team noticed a positive results of the KPIs establish at the start of the project. We observed the following:
- Average Session Duration 2:30 min/secs
- Goal Conversion Rate 3-5%
- Reduced bounce rate to 55%
- Overall Positive Customer Feedback
Not only did our change help find what our users needed faster but we were converting new users and gaining more leads.
Even though this project was successful, our team noticed some areas we could of improved on. We wanted to do more users interviews and get more feedback during the design & development phase. Also stakeholders we too much involved some design decisions.