TL;DR
Complementing a full rebrand, we refreshed Huvo’s website with a new custom WordPress theme; including new logos, colours and illustrations, helping to reframe the brand direction whilst continuing to enforce their competitive edge and retain customer loyalty.
Project Overview
Originally Discount Fire Supplies, Huvo were undergoing a full rebrand carried out by a specialist agency, meaning their website needed to be updated to be in-line with the brand concept, including the new logo, colours, and brand elements like iconography and font combinations.
The new brand reflects their vision and values, providing space and flexibility to grow the company beyond their fire supplies origins.
Who are Huvo?
Huvo is one of the UK’s premier retailers of fire safety and security products and accessories. Their extensive catalogue includes fire alarm systems, emergency lighting, CCTV systems, fire extinguishers and gas detectors.
We’ve supported Huvo’s e-commerce journey since 2009, providing full service digital agency services to help them to grow and expand their business. Our strong relationship meant that we were top of their list to implement their exciting new branding on their website.
Project Brief
Huvo had undergone a full rebrand, complete with a new name, logo and colour palette. The aim of the brand refresh was to create a new, mature identity to represent all of the products that the company has grown to offer, rather than just fire systems.
As the website had only recently undergone a migration to WooCommerce, which included a redesign and custom WordPress theme, we simply needed to create a new custom theme for the Huvo website to reflect the branding changes, without the need for a full design update.
Huvo provided a full brand guidelines document, including logo assets, colours and icons, following their branding exercise. We used these elements to propose a refreshed website design, up-to-date with the new branding and business name.
Our Proposal
Together with our client, we outlined the following aims:
- Update the website with new logo and colours;
- Update the home page with a new hero image and call-to-action buttons;
- Create technical line drawing graphics to represent the top level categories;
- Create new graphics for the most recent two pages of blog posts; and
- Update universal styling rules with branding, for consistency throughout all pages and posts.
Branding
Branding Analysis
The existing website utilised the previous brand colours and logos in numerous locations, which included custom colour applications on categories, so we undertook an in-depth analysis of the website to identify where the branding would need to be updated.
Along with obvious locations such as logos, buttons and menus, we determined that the most recent blog post images would also need to be individually updated with new graphics as they contained outdated fonts, colours and logos.
Rebrand Colours
Moving away from the previous colour palette, the new Huvo branding focuses on shades of jade, black and light cyan, with accents of coral, claret, blue and yellow to be used sparingly, such as for CTAs. We took special care and attention when choosing where to use these pops of colour, also ensuring that all colour combinations were accessible and readable on screens, achieving acceptable contrast levels for visually impaired users.
Updated Logos
We replaced all outdated logos with the new logo, including in the header, favicon and footer.
Images and Illustrations
Through our website analysis at the start of this project, we identified that numerous images throughout the website use the logo, brand font and colours. Therefore, we went through and individually updated all of the relevant images, including the most recent blog posts.
The new branding also includes technical line illustrations, providing visual interest and demonstrating the many product categories that Huvo offers. We included these illustrations where relevant, to help users recognise each category and quickly identify product ranges.
Shapes
A key part of the new brand is the concept of a squircle, as seen in the counter of the letter O in the Huvo logo. Deceivingly simple, a squircle requires many lines of code to achieve in CSS – something we chose to avoid for the benefit of page speed.
Where possible an SVG squircle background has been utlised to ensure this key brand element is not lost; for example, as a background on category thumbnails.
Elsewhere, requiring only one line of code, the wider website theme incorporates generous rounded corners for cards, images and buttons, which are used extensively throughout the site.
- #HTML5
- #CSS3
- #WordPress
- #JavaScript
Website Content
Following the rebrand, we encouraged Huvo to enhance their website content, specifically their Company Profile page, to include more information on their brand story and key people. Not only does this ensure the previous company name is mentioned, in the event returning customers are searching for the old brand, but it also gives Huvo the opportunity to build customer relationships by detailing the brand’s history and values.
Further Development
Huvo continues to utilise our full service offering, including our dedicated server hosting and our content creation service, which sees us creating a number of blog articles per month to increase website traffic and bring value to their customers. Huvo also take advantage of our website development retainer package, which allows us to carry out continual improvements to their e-commerce platform, including enhancing website performance and adding new functionality to help their website to remain competitive and increase conversions.
How We Can Help
If your business is rebranding, and you need your website updated to be in line, please contact us now by calling us on 0121 295 5352, emailing us at [email protected] or using the contact form below.
Contact us
Send us a quick message and we’ll get right back to you.