Meridian Energy
Web design + Conversion rate optimisation
My role
User experience and user research
Team
Roxy Huntington — Design Director
Chris Barneau — Visual Designer
Juliet Brown — Front End Developer
Gisela de la Villa — Backend Developer
Vee Linton — Project Manager
Client
Meridian Energy
Overview
Meridian is New Zealand’s leading 100% renewable power producer. Their power comes from wind, water, and sun. We worked with them to design a new website that brings their brand to life in the digital space and relays the value of renewable energy to their customers. With a new IA and improved acquisition flow, we made sure the signup process is easy and costs are transparent, so more people are inspired to sign up for renewable energy.
Research-led UX
We began by building on the UX, brand, audience and marketing research the Meridian team had already done. This provided a common understanding of the challenges and opportunities of Meridian’s consumer and internal business audiences.
Our content team validated our draft information architecture through an online TreeJack test. The findings from this test added a quickly validated data point that we integrated into high-fidelity wireframes. These wireframes, especially of the customer acquisition flow, helped the wider team understand and ‘sell in’ proposed changes to their internal business and pricing teams.
A commitment to accessibility
We aligned with the Meridian team on our commitment to accessibility. By considering accessibility from the very beginning, we were able to incorporate key audience needs in the user journeys (general findability, use of plain language and light page loads for people in remote areas), the visual user interface (meeting WCAG standards without compromising Meridian’s engaging new brand), and our technical development (correctly structured and tested code).
A new design system
We worked with Meridian to explore how brand elements — logo, type, colours, patterns, grids and graphics — could be combined with interaction and animation to bring the Meridian brand to life digitally.
Our front-end developers then built a fully documented pattern and component library using Storybook. This allowed us to show documentation in an interactive way, making it easier to copy and reuse the components across the site. Using this design system, we redesigned the entire website — creating on-brand page templates using the accessible components we’d developed. The design system will be used as an ongoing interactive reference, making ongoing work easy and ensuring Meridian’s brand is always presented strongly and clearly.
