2020 - 2021: 8 months
My Role: UX Research, Design, and Development
Custom Amp Covers and Tuki Covers are owned by the same parent company. They sell covers for guitar amps and other musical equipment. Both companies offer the option to special order a custom cover if they don’t have the right model in stock.
When the sites needed to be upgraded to a new eCommerce platform, we took the opportunity to redesign them so customers can find products or request a custom order more easily. The new sites used the same templates but kept separate branding for each company.
Customers had trouble finding products because there were too many items in the main navigation and too many competing calls to action on the home page. I updated the main navigation and home page to help customers find products and the custom order form.
The number of items in the navigation was reduced from eighteen to six. I changed the button to order a custom cover from "Customize" to "Get a Free Custom Quote" and made the background a different color to stand out. I moved the product categories into a mega menu that opens with a large "Shop" button in a different color and grouped related items into submenus.
Custom Amp Covers main navigation before and after
Tuki Covers main navigation before and after, with "Shop" Mega Menu
The home pages had four and six competing calls to action. I updated each home page to have just one call to action in the same color as the mega menu button. I also updated the hero images to show the difference between the customers for each site based on their personas.
Custom Amp Covers main section before with four calls to action, and after one call to "Shop Covers". The new hero image shows vintage amps to appeal to the Custom Amp Covers persona.
The Custom Amp Covers persona is a hobbyist guitar amp builder with a large collection of amps
Tuki Covers main section before with six calls to action, and after with one call to "Shop Tuki". This hero image is a professional musician performing to appeal to the Tuki Covers persona.
The persona for Tuki Covers is a professional musician who needs durable covers to protect his gear while traveling to gigs
Customers had to choose from 21 forms with names that sounded similar. If they didn’t know what kind of equipment they had, they had to look up the name somewhere else.
I renamed the call to action and page title from "Customize" to "Get a Free Custom Quote" to help customers find the forms. Instead of long paragraphs of instructions, I changed the directions to three simple steps with infographics.
The sites had a long text list of the form names, so I added photos and diagrams to help customers match the right form to their equipment. Customers said it was easier to find the right form after the redesign.
Similar descriptions were confusing and it was hard to know which form to choose
Instructions with steps and infographics; equipment names with photos and diagrams
Customers need to fill out a form with measurements for their equipment. The numbers from different sections have to add up to the correct total. When customers filled out the numbers without checking their math, a customer service representative had to contact the customer to get the correct numbers
User testing showed that clear error messages and instant feedback before clicking submit were helpful. When there was an error, customers got a message telling them to fix their math before they could submit the form.
Error message when numbers don't add up correctly
Customer engagement increased after the site redesigns because it was easiert to find products and to place custom orders.