Sustainable website reskin for environmental charity

Carrying CSE’s new rebrand through their website

Centre for Sustainable Energy (CSE) is a charity supporting people and organisations across the UK to tackle the climate emergency. They want to end the suffering caused by cold homes. 

We’ve been working with CSE since 2021, providing website design, development, and ongoing website maintenance services over the years since. Most recently, through a website reskin project to carry their new rebrand through to their digital platforms.

What the client wanted 

• Rolling out a rebrand across their website
• Updating colours, fonts, backgrounds, banners, and spacing 
• Keeping digital sustainability a continued priority
• Updating their website’s low power mode

The Centre for Sustainable Energy recently went through a rebrand. We supported them to carry this refreshed identity through to their website, working to a set budget, while keeping digital sustainability as a key priority.

Standardising colours for the rebrand roll-out

When the charity went through a rebrand, we supported them to carry this refreshed identity through to their digital platforms, working to a set budget.

We were tasked with carrying through CSE’s rebrand across their website. This reskin involved changing colours, fonts, and backgrounds, but keeping the structure of the site exactly as it was. We also rolled out some complimentary tweaks to spacing and added a new banner.

Our main challenge was standardising all of the colours, carefully removing any old ones and testing new ones across the site to ensure changes weren’t causing any problems to the site.

Continued priority of digital sustainability

CSE is an environmental charity, and naturally digital sustainability has been a key priority for them since we started working together.

Our design and development work on the CSE site is done in a way that is sustainable, not energy heavy. This includes maintaining their low energy mode – a darker theme and monochrome images, which consume less power through display when people are visiting the website.

When working with color palettes, especially for dark and light variations, it’s important to consider their impact on performance and stylesheet loading. At Atomic Smash, we leverage modern CSS frameworks like Tailwind, which allow developers to configure color palettes while ensuring that only the necessary colors for a given page are rendered. This approach significantly reduces memory usage, as the website isn’t burdened with rendering an excessive number of brand colors.

Creating an accessible and seamless dark mode presented an enjoyable challenge. We meticulously examined each part of the site to ensure that all necessary elements were properly covered, resulting in a cohesive and user-friendly design.

Rigorous testing and digital brand guidelines

We dissected the brand guidelines and set up a new colour palette for CSE’s digital platforms to ensure colours would be updated in a non-destructive way. Following this, we created a design to reflect and further communicate the brand guidelines.

Carefully and rigorously, we tested every page on the site to confirm the new branding was applied appropriately. Testing was completed by a pod with both a designer and a developer working together, and the deployment was incredibly smooth and completed under budget.

Future proofing

Following the reskin, the work isn’t over. We’re planning a phase of user testing to make sure people are finding the information that they need, and to identify any ways to improve user journeys.