Case study

Mercury Rebrand

A wonderful brief. A slightly scary schedule. And a whole lot of collaboration. Here’s the story of one of our most energising website projects...

Mercury rebrand





Type of work

  • Websites

What we did

  • Strategy
  • Information architecture
  • Design
  • Technology and development

The challenge

It was early 2016, and we were sitting on the floor of a corner office at Mercury’s Greenlane offices... “We’ve got four months to design and build a brand new website that combines the content from Mighty River Power and Mercury Energy, allows customers to join and self-serve, and showcases our new brand - which doesn’t exist yet!” That was the first time we met Mercury’s Head of Marketing, Ben Harvey-Lovell.

What followed was one of the most energising, satisfying and collaborative projects we’ve ever worked on at Catch.

We were part of a massive team of passionate people and partners who delivered one of New Zealand’s most successful large Corporate rebrands in recent years. Energy was made Wonderful over those four frenetic months, but it wasn’t without its challenges...

Mercury rebrand - designs

The solution

Mercury had worked with Dick&Jane on the design of their new visual identity. When we first got the website brief, the logo, colour palette and brand strategy were still in the research stage, but we had a pretty good idea of what we’d be working with. Dick&Jane had also designed a homepage concept that Mercury loved, so we had a great starting point for the design.

Our first challenge was to research, test and design a new IA that would combine consumer and business retail content with the generation and shareholder content traditionally sat on the Mighty River Power site. The brief here was to make the site structure cohesive, to combine two stories into one coherent narrative that would allow customers, investors, analysts and employees to find the content they needed.

The second challenge was the detailed design. Our design and development teams worked on a new Digital Design System—building a modular, reusable, responsive pattern library that would be re-used across multiple digital environments.

We rapidly integrated the new design system into Mercury’s incumbent Kentico CMS, giving Mercury’s Digital Team complete control of the site structure and page layouts.

Multiple API integrations were required to enable customers to join and self-serve and to access third-party data for modules like share prices and lake levels. Given the timeframe, this required an intelligent, pragmatic approach. Where appropriate, a new React layer was developed to lay the foundation for the future.

We designed and built Mercury’s full marketing, billing and system-related emails as part of the project. Leveraging the new Design System, we approached this work similarly—modular, reusable, mobile responsive components integrated into Marketo and their core internal systems.

The whole project was like building a plane in the air. While designing and building the website alongside Mercury ICT and Digital Marketing, TRA validated the visual identity by engaging thousands of customers and shareholders. Dick&Jane were iterating the visual identity from this feedback while FCB was developing the campaign launch content. Meanwhile, the Mercury marketing team re-wrote and rebranded hundreds of automated customer letters and emails while designing new office fit-outs, station signage, and vehicle liveries. We were all bouncing off each other, and it was wonderfully collaborative.

Mercury rebrand - desktop

The results

Despite the time pressures, the long days and the late nights, the website launched on time, on budget and was... well, wonderful! It was a finalist in the 2017 Best Design Awards and a vital part of the story that helped Mercury win the 2017 Grand Effie and the Supreme Award at the TVNZ Marketing Awards.

The project's success forged a long and productive partnership with Mercury, and we’ve since worked on multiple digital transformation initiatives together—from designing and building new Join journeys and updating the self-service portal (My Account) to designing and building Mercury's first mobile app.

From a wonderful brief, a scary timeline, and some genuine collaboration, we built a website to be proud of and established trusted relationships that continue to this day.

Mercury rebrand