Enersee ⚡️

Energy Visualisation App: UX/UI Design, Mobile App Design

Role

UX/UI Designer

Team

1 Designer + 2 Researchers

Duration

8 weeks

Problem

Even though energy visibility with feedback technology is available, consumers are still not engaged with their energy usage due to financial and cognitive capabilities. Energy awareness should be based on clarifying how much energy we use, what we actually use it for, and where the energy comes from. These are considerable insights for changing our behavior.

Solution

Existing technology fails to simplify information and does not seem to deliver enough insights to be included in day-to-day usage. We try to deliver this design to help households effectively tackle their own consumption.

Although energy consumption massively increased it has also become more invisible to users. (Frey & Schädler, 2021)

Our desk research led us to the conclusion that people are in need of better data visualisation for their domestic energy consumption.

Needs of Our Target User

Easy-to-understand and informative interface
No overly complex information
Tips for specific use cases
Time spans when to turn on/off
Needs to be updated and called for action in a simple way
Energy consumption must be feasible through comparison

Problem

Solution

Although energy consumption massively increased it has also become more invisible to users. (Frey & Schädler, 2021)

Our desk research led us to the conclusion that people are in need of better data visualisation for their domestic energy consumption.

Needs of Our Target User

Easy-to-understand and informative interface
No overly complex information
Tips for specific use cases
Time spans when to turn on/off
Needs to be updated and called for action in a simple way
Energy consumption must be feasible through comparison

The initial prototypes failed on communicating the intended functions. Since our aim is to create an intuitive and universal interface for energy visualization we had to test and re-iterate our ways of thinking.

Usability Testing

We created a high-fidelity prototype of the initial flows using Figma. At the same time, we started to ask colleagues to test our design. We did 4 usability tests in the first round and 3 after iterating on the issues that we’ve identified.

UI Design

Once the usability flaws iterated, we moved on to design the final screens in Figma. Our goal was to create a visual identity that’s aligned with the target users' style preferences and message, which is: “transparent data visualization”. Also, we have looked into the market for various designs to come up with an optimal final design.

We choose corporate-style dark mode visuals to fit into the "Finance Expert" persona,
We also followed Material Design guidelines to create a contemporary interface
We always based our decisions on creating more effective and understandable visualization solutions.

Reflections

There is definitely room for improvement in this project. Extensive user testings can be done with participants fitting to the target user persona to further test and iterate the current final version.

Further user interviews can be held to pin out additional features to be added.
User testings can continue to iterate the design by means of style and functionality.
UI Design might be re-visited after the developers' feedback on the design flow.

Reflections

Further user interviews can be held to pin out additional features to be added.
User testings can continue to iterate the design by means of style and functionality.
UI Design might be re-visited after the developers' feedback on the design flow.