Skip to content
(314) 849-6969 (314) 849-6969

Encouraging Passions Since 1916

Whether you take your sport seriously or just enjoy casual games, Imperial Headwear has options for you. Imperial views hats as more than just accessories and their vast collaboration with big names in sports reinforce their heritage. This website redesign case study takes a closer look.

We wanted to make sure their site was designed and built just as well as their hats are. Leveraging WooCommerce to create the optimal buying experience helped when nailing down the user experience for mobile devices. With the robust system of WordPress, we were able to create a website that is built to last.

Colors & Typography

We spent time researching the market of sports hats to come up with a strategy to elevate their site. Imperial’s color palette, which is iconic to their brand, was great as is but we specifically wanted to use their dark colors more liberally to make their site feel bold and elevated. MADE Evolve Sans, the main font used, was chosen to complement the boldness of Imperial, whilst being easily readable on mobile devices.

Brand Colors

Hex: #b40000
Hex: #000000
Hex: #707070

Typography

Website Revamp case study typography. Website redesign case study.

Focusing On Lifestyle

When building an eCommerce website, product shots are important but utilizing lifestyle photography is a great way to show off your products being used and is an easy way to connect your users to the product. With all the dark and saturated colors being used throughout the website, the lifestyle photos stand out and direct the user’s attention to what’s important the products.

Lifestyle Imagery

The homepage features single products and product categories which utilize the vast library of lifestyle photos that drive the user deeper into the site. The lifestyle image sliders provide a great alternative to searching for the perfect product.

Subtle Animations

These lightweight and quick zoom animations on rollover enhance the user experience. While designing these elements, our team drew inspiration from common eCommerce animations that aren’t too intrusive and hinder the site load speed.

Responsive Design

The key to an effective eCommerce website is to build a great mobile experience. Our team worked to build a responsive experience which allows the user to navigate through the site on any device they might be using.

Website revamp case study showing the desktop and mobile views. Website redesign case study.

Engaging Website Redesign

When establishing a brand against long established competitors, it’s important to differentiate and help your audience understand your experience and legitimacy in the industry. The colors bring boldness and competitiveness to the site whereas the rounded borders on the UI give off an inviting feel, in hopes to bring in new customers. Whether the user is on a desktop, tablet or mobile device, the experience will always be the same.

View of hat designer as part of the website revamp case study.

Hat Customizer

We worked closely with the Imperial team to create a hat customizer from the ground up. The new experience is cleaner and introduces new features. Now, inside of the builder it pulls in the WooCommerce color variations to visualize the logos on different colors of the same hat without leaving the builder. Additionally, we feature a quick link that allows you to see other styles.

Imperial website revamp desktop mockups

Shopping Experience

All the eCommerce goodies were leveraged in order to help this site perform, especially WordPress and WooCommerce. WordPress is our go-to platform for website creation due to it’s customizability and user-friendly CMS. We also leverage WooCommerce for showcasing products due to its ease of use, integration options and SEO benefits. Both of these tools combined makes for a seamless buying experience for website users.

We hope this Website redesign case study will help you choose Matchbox Design Group for your new website or website redesign today.

Contact Matchbox Design Group Today!

If your website could use a refresh or you’re looking to drive more traffic to your site, fill out the form below and we’ll contact you to learn more about your digital needs.