Nick Lockey
Product Strategist & UX Researcher

Building a live prototype for a major energy supplier

Ideating, building and reporting on a content platform concept.

The brief

The client

A major ‘big six’ energy brand with 3.8 million customers, making them one of the leading providers in the UK. The client approached us to help them develop and test multiple new digital propositions that would create added value for their customers.

The challenge

For this project, the client wanted to explore more dynamic ways of presenting smart home and energy solutions to their customers, instead of relying on their traditional articles and blogs. The intention was that more engaging content would drive better conversion to their products.

The audience

Existing energy tariff customers looking for smarter ways to manage their energy, reduce their bills and improve their carbon footprint. For the prototype, we concentrated on two initial product journeys (solar panels and smart thermostats).

Live prototype development for an energy client

My role 

I was part of a small, cross-disciplinary team consisting of a designer, a project manager and a front-end developer. We also worked collaboratively with client stakeholders to shape and launch the platform concept.

I was responsible for:

  • Workshop facilitation

  • Requirements gathering

  • Research

  • Copywriting

  • Collaborating on the conceptual designs

  • Analytics and reporting

  • Creating and presenting the final report

Approach and objectives

A prototype content platform

We decided to design and build a live prototype platform featuring interactive content which we’d then test and monitor 'in the wild' with real customers. This would enable us to test the audience's reaction to different format types and journeys.

Once launched, the platform would divert a proportion of traffic from the client's homepage into our site where we could monitor customer activity. The platform would be live for two months after which we'd prepared a detailed findings report for our stakeholders. Here's what we set out to learn...

Would users engage with the content?

Would the customers be interested enough in the prototype content to click through and engage with it? Would they stay and explore the platform or head back to the main brand website?

What format would work best for the content?

We had different ideas for how the dynamic content on the site might work. Which would see the most engagement with our users? Would any of the formats cause unforeseen problems or break the user journey?

Would users convert to our CTAs?

The client wanted to drive customers to specific parts of their site, especially their product pages. We set up a variety of CTAs to these conversion funnels around our platform. Would some work better than others?

Research, design & build

Shaping the idea

We kicked-off the project with a week-long research and ideation phase to devise a number of content formats and journeys. This was followed by a further week of high-fidelity design based on our concepts. This 'sprint'-like restriction helped us to keep the concept lean, focussing on the assumptions we most needed to validate. This is what we covered in the first week:

Immersion session

I led a half-day immersion workshop with client stakeholders to gather essential information and shape the brief. We explored business goals and high-level user needs, refined the project scope, defined our success criteria and agreed our project outputs.

Research phase

Working closely with our designer, I conducted two days of intensive research. This included talking to experts and knowledge-holders, conducting desk research, performing competitor analysis and assembling design mood boards.

Concept ideation

Here I worked in partnership with the designer to ideate, sketch and refine the prototype concepts. This included developing the customer journey, creating various user flows and rapidly sketching a number of low-fidelity wireframes.

Client playback

At the end of the first week, we delivered our concepts to the client in a detailed playback session with an accompanying deck. The stakeholders loved the idea and signed off the creative direction, ready for the next stage of the design.

Design and build

In the second week, I collaborated with the designer to further shape the overall design and information architecture for the site.

Then, whilst he turned the sketches into high-fidelity designs, I wrote all of the copy for the prototype platform.

We then handed over the concept to the front-end engineer for the development phase and worked closely with him to ensure the customer and business needs were being met throughout the build.

Build, measure, learn

The concept

We decided to present the content in the form of four interactive challenges that would test the user's knowledge of energy efficiency. These focussed on two featured themes (solar panels and smart thermostats) and two levels of expertise (beginner and advanced).

The challenges incorporated embedded product information, CTAs and gamification mechanisms, and featured a mix of interactive elements and format types. All of these were set up within our analytics to reveal which were getting the most traction with users.

Testing the prototype 'in the wild'

Here we worked to turn the concept into a live prototype that could be tested at-scale with genuine customers of the brand. Once launched, this would allow us to continually monitor the site performance with a view to shaping a 'full' version of the platform in the future.

The sandbox

The prototype content platform was built as a standalone ‘sandbox’ that used the client’s design component library to closely replicate the look and feel of their existing website. This enabled us to seamlessly direct a proportion of the traffic away from the main website and into our test platform to see how customers engaged with the content.

Monitoring & analytics

The platform remained live for two months, during which I produced weekly analytics reports for the client. These were generated through a combination of Google Analytics and Fullstory, a specialist analytics platform that enabled us to build specific activity funnels and view screen recordings of how users actually navigated the site.

Reporting

Originally we'd planned to iterate and A/B test the site throughout the experiment based on user activity, but unfortunately, this turned out not to be feasible within the changing confines of the project. Instead, we pivoted to post-project reporting. Here I compiled the key observations and UX recommendations into a summary findings deck.

Outcomes

Proof of concept

By the end of the project the site had been used by thousands of customers and we’d been able to gather invaluable data about their habits, needs and preferences around purchasing energy solutions.

The client was extremely happy with the experiment for validating and invalidating some core assumptions about their audience needs, and for providing an additional channel to promote their energy solutions. They even extended the life of the prototype beyond the initial project scope with a view to evolving it into a full platform in the future.

Takeaways

Reflecting on the project

Overall this was a fantastic project to work on and it taught me loads about designing and launching live prototypes. However, the evolving scope of the brief took it to a level of complexity beyond the 'MVP' we'd initially envisioned so there would definitely be scope to create something leaner for future projects.