Creating a user focused website for a centre dedicated to developing and deploying technology for an affordable net zero energy industry.

Net Zero Technology Centre was created in 2017 with a purpose to develop and deploy technologies that reduce emissions, unlock the full potential of an integrated energy system and propel the energy industry towards a digital, automated, decarbonised future.

Team & Role

I was part of an 8 person team at Hatched London that delivered this project. My main role was to help develop the User Interface of the site and worked closely with our Creative Directors, Designers and Project Managers to do so.

The Challenge

We wanted to ensure that their website becomes an active, usable and vibrant communications channel that continues to develop as a useful and interesting resource for both new and long-standing visitors, encapsulating their ethos of supporting the development of technology as the key to transitioning to a more diverse energy industry centred on the North Sea. We wanted to build something that exemplifies them pushing the boundaries and illustrates their position at the forefront of technology.

Their homepage at the time was pretty cluttered and felt like it was trying to show all the information at the same time, which seemed overwhelming. Our strategy was to try to segment and create a hierarchy within the design to help the user experience flow much more effectively.

Tools

XD 

Octopus (Sitemap building tool)

Hotjar (User Insights Tool)

Timeline

January 2022 – November 2022

Deliverables

A responsive website using a wordpress alongside a user manual. 

Research

Although we planned out a research study and user testing plan for the project sadly, due to time sensitivities, we couldn’t fulfill this. So research was carried out between ourselves and the internal stakeholders through workshops and competitor audits.

From students, politicians, researchers, developers, etc we found through our research analysing current visit sessions to the site using Hotjar & Analytics that there was a broad range of user types that were visiting the site. and for a mixture of reasons so the website must be able to accommodate this variety of user types. We crafted some user personas, stories and flow based off of our research and used these to inform our redesign.

Getting to know our audience types through persona building and specified user journeys.

From students, politicians, researchers, developers, etc we found through our research and analysis that there was a broad range of user types that were visiting the site and for a mixture of reasons so the website  must be able to accommodate this variety of user types. We crafted some user personas, stories and flow based off our research and used these to inform our redesign. 

Key personas – basic

Technology Developer (Established)

Need: Submit idea for project.

Prospect Partner (Energy Operator)

Need: Find out if the NZTC can help us meet our net zero ambitions.

Research Organisation (University)

Need: See if the NZTC works with universities.

Government (Minister)

Need: Understand where the money we granted the NZTC is going.

Technology Developer (Start-up)

Need: Apply for funding as part of TechX.

Existing Partner (Industry service provider)

Need: Find out the progress of my project.

Sitemapping

We looked at the best way we could tie user needs and business objectives together. In doing so we would want to create an experience that delivers relevant and right content to the user along their journey through to a specified call to action.

Brand Guidelines

– Dynamic polygon creation network / connectivity. 

Use of vibrant colours and gradients.

– Array of colours.

Homepage Desgin Development

As requested, initially we pitched three different routes. After working on these three routes I stepped away from this project and onto others but monitored how it developed and gave a hand where I could.

01. Search Based Route

This route functionality is all based on a qualifying search. The functionality enables users to instantly search Net Zero’s content and catalogues with speed and relevance. Additionally, a site search function can be prompted, tailored and assisted.

02. Editorial Route

This route functionality is all based on a qualifying search. The functionality enables users to instantly search Net Zero’s content and catalogues with speed and relevance. Additionally, a site search function can be prompted, tailored and assisted.

03. Narrative Route

In this route, through natural scrolling, the user immersively traverses through Net Zero’s pages, unconsciously building a narrative and information about the business.

 

The Outcome

A richer, more emotive website with a restructured sitemap, ongoing support with their CMS and one happy client.

 

Other projects