Inbound Marketing & Sales Blog - Digifianz

Brand Manual and Web Development in HubSpot for Freightzy Case Study

Written by Agostina Marziani | 11/28/22 2:27 PM

A website redesign in HubSpot with a clean and streamlined look, for Freightzy's team to update it regularly and easily without the need of technical help.

About Freightzy:

Freightzy is a single-source logistics provider based in Guelph, Ontario, Canada. The main solutions they offer are: less than truckload, truckload, expedite, intermodal, managed services and e-commerce throughout North America.

 

 

Their shipping process is very straightforward, consisting of 3 steps:

 

             

 

Furthermore, they offer their customers a web portal and mobile application, where they can rate, book and track shipments without installing software or upgrading costs.

 

 

Project and Goal:

The project had 2 main challenges:

  1. A redesign of the company's website with a fun and inviting retro vibe, but following a clean and streamlined look.
  2. To develop the website entirely in HubSpot, for the team to update it whenever without any technical help required.

Freightzy's main goal was to transmit their purpose throughout the website: being different, easy and funny while showcasing their firm belief that businesses should serve a higher purpose through community support, inclusion and equal opportunities.

 

In practical terms, this meant for us to start from the basis and work from the brand manual up to the website deployment.

 

Before this project, they had a simple website design containing non-adaptable to mobile elements with a complex information architecture.

 

We had different sessions with the client to understand their brand in depth.

 

The first step was a Brand Identity Bootcamp which covered everything related to the brand overview, personality, values and primary purpose. The goal of this bootcamp was to gather all necessary information to  to create a design proposal which included:

  • A moodboard and an analysis of their old website; what should be improved and what could be kept.
  • A website comparative with industry related companies
  • A proposal of color palettes, fonts and visuals.



After working on the design proposal together, it was approved by Freightzy and we started working on the brand manual. Here are some examples of the definitions we can find in the brand manual:

 

 

This brand manual set the basis for what was next: UX/UI Research Workshop. The main goals were to review problems to be solved in terms of information architecture and define the new site map and approach. With all this information we were able to create the UX/UI kit:



 

 

 

This set of assets helped us create faster and easier prototypes in a consistent and structured way. Right after this, we had the green light to start designing the actual screens, both in mobile and desktop.

 

In the meantime, we carried out the last workshop which was the CMS Bootcamp. Its main goal was to review  the key HubSpot CMS features, how we work internally with the CMS, and mainly to discuss and align the specific client needs and expectations.

 

Moving forward, we met with Freightzy's team weekly to review the designs of each page so we could discuss any feedback and iterate on the prototypes:

 

 

After the final approval of each design, the development team started work on the development in HubSpot through its module system, flex columns and drag-and-drop areas:

 

 

We also created a new blog theme and migrated all their blog posts to HubSpot, adding different tags so the user could easily filter according to its interest:

As a last part of the CMS project, we also built the HubSpot knowledge base section and integrated it with the website, adapting it to the new brand manual guidelines:

 

 

After the development work was ready, we did a QA phase and a client feedback round. And finally, once everything was in place for deployment, we set up the domains and subdomains in HubSpot by creating the DNS records.

 

Main Challenges:

The main challenge was to align client expectations and ideas in the new designs. The creative process is always challenging as it consists of many steps; investigation, incubation, composition, clarification, changes, and so on. We needed to use the time properly between internal teams and client feedback reviews.

 

Results and Outcome:

The results exceeded client expectations not only because of the significant improvement in the interface but also because the website is now well structured, the information is consistent and easy to understand, which was something specially challenging for the freight industry:

 

"From the first meeting with Digifianz, I knew our interaction would be positive. I gave them a long list of ideas, and they DELIVERED. Their team was very friendly and highly organized. It was a pleasure working with them." - Sean Freedman, President. 

 

Also, a key win is that the website is now fully adaptable to tablets and mobiles, increasing engagement opportunities and website traffic.

 

Guidance and Continuity

Even though this first project has ended, we are already planning a second phase to connect marketing and sales strategies with HubSpot's CRM features so they can make the most out of this powerful platform.

 

Freightzy's website was an exciting project to work on, not only because we could provide a lot of insights and help the client achieve their primary goals, but because we met a great company with an amazing group of people.