04  ·  Dashboard  ·  Data Visualisation

Energy Cost Calculator

Year 2023
Role UX Designer
Client Quintessential
Platform Web + Mobile

Energy data that nobody understood — redesigned to be actually readable.

The RAE Energy Cost Calculator helps households and businesses estimate and manage their energy expenses across multiple sources. The original tool was functionally sound but visually and experientially broken — users couldn't interpret their results, generating a flood of support tickets.

My role was a ground-up UX redesign focusing on data clarity, intuitive input flows, and meaningful visualisations that translated complex energy data into actionable insights.

RAE calculator input redesigned
RAE results dashboard
RAE mobile — energy plan detail

Mobile view

Users got their results and immediately called support — because the data made no sense to them.


  • 01

    Incomprehensible data visualisations

    Charts displayed raw kWh figures without context. Users couldn't map numbers to real-world costs or understand trends over time.

  • 02

    Confusing input flows

    The input form requested technical terms (tariff codes, meter IDs) without explanation — deterring non-expert users immediately.

  • 03

    No actionable output

    Results were displayed as static tables. There were no recommendations, comparisons, or next steps — leaving users unsure what to do with the information.

01

Research

Support ticket analysis, user interviews, and benchmarking against similar energy tools in the EU market.

02

Data Strategy

Worked with engineers to understand what data was available and how it could be presented meaningfully.

03

Design

High-fidelity Figma designs for input flows and dashboard views. Focus on progressive disclosure and plain language.

04

Validate

Task-based usability tests measuring comprehension — can users correctly interpret their results unaided?

  • 01

    Plain-language input with contextual help

    Technical fields replaced with plain descriptions and inline explainers. "Tariff code" became "Your electricity plan" with a lookup tool.

  • 02

    Real-time cost feedback

    As users fill inputs, estimated monthly cost updates instantly — giving immediate reward and encouraging completion.

  • 03

    Contextualised data visualisation

    Charts show costs vs national average, vs last period, and vs renewable alternatives — transforming raw data into decisions.

  • 04

    Actionable recommendations

    Based on consumption patterns, the tool surfaces 3 personalised tips — reducing support dependency and increasing perceived value.

85% Increase in user comprehension measured in usability tests
−45% Reduction in support tickets in the 3 months post-launch
Steady growth in downloads, registrations, and engagement

The redesign transformed a support burden into a self-service tool users praised. Comprehension jumped 85% in task-based testing, and the 45% drop in support tickets provided a direct, measurable ROI from design investment.

Next project AI Hackathon