# Simplifying Content Management with HubSpot Site Revamp

> Source: https://layers.studio/work/one-utility-bill

Revamping a HubSpot website to empower easy content management and drive utility bill consolidation growth

**Year:** 2023

**Client:** One Utility Bill

**Industry:** Utilities

**What We Delivered:** UI, UX, Web, Motion

## Introduction

One Utility Bill (OUB), a North East-based company, simplifies utility management by consolidating energy, broadband, TV, and water bills into a single monthly payment. This solution saves time, streamlines finances, and helps customers split bills effortlessly.

However, OUB’s existing website was visually outdated and lacked the flexibility needed for efficient content management. The team struggled to update pages or create new content without external help — despite paying for an advanced HubSpot Enterprise package that wasn’t fully utilised.

## Challenge

Our mission was clear: redesign and rebuild OUB’s website to:

- Deliver a modern, engaging user experience aligned with their brand

- Enable internal teams to effortlessly manage and create content without technical barriers

- Optimise their existing HubSpot Enterprise subscription by leveraging HubL coding for maximum flexibility and control

- Support diverse departmental needs with tailored content, helping OUB better engage varied audiences

- Incorporate tools to capture valuable leads and user insights seamlessly

## UI / UX

We kicked off the design process by conducting a series of discovery workshops with the relevant departments within OUB. This ensured a comprehensive understanding of the site's requirements and an overall grasp of the structure and pages that needed to be created. Visually, we adhered to OUB's existing brand guides (with some creative freedom) and UI component library to ensure a consistent visual language, aligning seamlessly with their established 'get a quote' flow. The style we crafted reflected the laid-back and approachable nature of the team, incorporating hand-drawn elements and simple emoji-style icons, while maintaining a professional look for businesses and potential partners. The designs were presented as a high-fidelity clickable prototype, allowing stakeholders to confirm the website's intuitive and navigable structure.

## Animation

To convey key messages and enhance user engagement, we crafted custom animations for the hero sections of the main B2C and B2B pages. The animation process began with a set of static storyboards for each animation, ensuring the accurate delivery of messaging. After finalising the narrative for the animations, we utilised Adobe After Effects to create them and exported them as Lotties (animated SVGs). This allows for seamless scaling on both desktop and mobile without any loss of quality. The end results add a polished touch and immediately capture the user's attention when they land on the page.

## Development

We utilised HubSpot CMS and HubL to develop a web platform that fully embraced HubSpot's marketing tools and analytic features. By developing the customisable HTML templates and landing pages offered by HubSpot CMS in-house, we were able to craft a visually appealing and conversion-focused product.

The integration of HubSpot's marketing automation tools allowed OUB to streamline marketing tasks and deliver bespoke content to potential and existing customers, increasing overall conversion. Additionally, with HubSpot's analytics platform, OUB gained valuable insights into the web platform performance and could make data-driven decisions to optimise OUB’s marketing strategies going forward. Overall, our implementation of HubSpot CMS and HubL demonstrated their potential to maximise online marketing effectiveness.

## Result

After close collaboration with One Utility Bill and detailed stakeholder and user research, we delivered a website that:

- Features a refreshed, consistent visual identity that reflects OUB’s brand promise

- Empowers OUB staff to build pages quickly using a rich library of pre-built sections and flexible content blocks

- Fully utilises their HubSpot Enterprise package, unlocking powerful functionality with custom HubL development

- Supports clear, targeted communication for different departments, enhancing customer engagement and lead generation

- Provides a scalable foundation for future growth and ongoing content expansion

## Why It Matters

This project goes beyond a website facelift. By enabling OUB’s team to take control of their digital content, we removed operational bottlenecks and significantly reduced dependency on external agencies. Simplified content management means faster time-to-market for new campaigns and more agile responses to market changes — key advantages in the competitive utility sector. For OUB’s customers, the improved UX builds trust and clarity, helping them confidently consolidate their bills and manage payments efficiently.

> "A great partner to work with - fantastic execution and generally a really good bunch of people. We're using Layers now for a second major web development project within HubSpot. James and the team are extremely knowledgeable about the platform and have gone to huge lengths to understand our business and audience. Both the design and dev teams have been excellent - the final product is a build that far outstrips what we could have hoped for."

Oliver Rix, Head of Marketing
