Obi - Finalist UX

Energy mobile app (B2C). Company project, London.
Finalist UX category. The European Talent Awards – Aquent (London).
Business context: Utilities industry / Client: ONZO / My role: UX Designer / Target audience: Families and 18-40 stakeholders

    • obi - smart energy
    • obi - home mockup

This energy-saving mobile app helps users take control of their energy consumption through real-time communication, turning complex data into clear, actionable insights. The main goal is to attract new users, improve the overall experience, and deliver the right information quickly and efficiently.

1 Research

Firstly, two questionnaires provided us with useful feedback from both colleagues and potential users. As a result, we got a total of 131 responses from 8 different nationalities with an age range 18-40, highlighting an immediate access to live energy feed as well as budget control.

    • obi - questionnaire 4
    • obi - questionnaire 1
    • obi - questionnaire 3
    • obi - questionnaire 2

More than 30 energy saving apps from 8 different countries served as competitor analysis, each one with its own data sheet (brief description, rating scale and website).

    • obi - competitor analysis 1
    • obi - competitor analysis 2
    • obi - competitor analysis 3
    • obi - competitor analysis 4

Market research helped us to identify the audience and run some quick research on. Customized content, behavioral targeting and engaging challenges create a smart energy experience anywhere, anytime.

    • obi - user scenario 1
    • obi - user scenario 2
    • obi - user scenario 3

After conducting a series of interviews, we were able to identify a set of metrics that we used to define two user personas: 1. Primary: Families and couples who use a smart meter for electricity and gas; 2. Secondary: Stakeholders ranging from 18 to 40 (young adults).

    • obi user persona 1
    • obi - audience persona 2

2 Strategy

We started with brainstorming sessions to reward ideas and maximize productivity. They were crucial to find the best and most complete decision for a plan of action, receiving more than 82 comments from all the team.

    • obi brainstorming 1
    • obi brainstorming 2

The design process continued by setting clear goals:

• Attract new users through personalised content and behavioural targeting.
• Reduce inbound calls while building stronger, more personal relationships with customers.
• Present complex data in a clear and efficient way.

On the other hand, the information architecture was defined based on three key aspects: Terminology (how users name things), relationships (how items are connected or related), and categories (how content is grouped and labelled).

    • obi - sketches
    • obi - information architecture
    • obi - keywords

The design guidelines acted as a manual of visual strategies, focusing mainly on the visual language of the interface:

• Layout: the main structure and key UI elements.
• Color palette: corporate colours and shared interface elements, including a RAG system based on energy consumption (Red = high, Amber = medium, Green = low).

    • obi design guidelines 1
    • obi design guidelines 2
    • obi design guidelines 3

Below, the appliances icon set, where each color is selected according to a meaningful message in the context of the appliance’s category; the Challenges section, with those colors based on linear gradients by using different percentages to create a good tonal balance.

    • obi design guidelines 4
    • obi - design guidelines - colour palette - challenges

3 Design

The first step was creating a new identity. “Obi” (On Board Intelligence) was selected as the strongest name out of six options tested with users across four market categories (association, object, character, and thing).

The branding also has meaning in its typography: The letters “b” and “i” come from the company’s corporate font (Gotham Rounded Bold), while the capital “O” is taken from the company’s logo. The dot on the “i” is designed to resemble a thermostat indicator when combined with the “O”.

    • obi logo
    • obi - user

Below, an exploratory idea linked to energy disaggregation, providing accurate information that might help users to save money and time, as it improves load disaggregation by detecting every 10sec component appliances separately from a whole-home energy signal.

    • obi - disaggregation
    • obi - sketches

The icon set focuses on readability while maintaining a consistent, cohesive style across the whole system.

The Challenges section adds a gamified experience where users place “stickers” (images) in specific locations based on game outcomes. A new sticker is earned when energy use is lower than the previous average (comparing the same day of the previous month), rewarding positive behavior with coupons or promo codes.

    • obi icon set
    • obi graphics challenges

Below, user behavior with detailed specifications for every screen.

    • obi versions
    • obi news
    • obi live
    • obi calendar
    • obi comparison
    • obi breakdown
    • obi challenges
    • obi settings

Development & Testing

Finally, we created a test version to gather useful feedback and evaluate test coverage. This made it possible to publish, test, and update Obi without needing to release it through a live app store.

    • obi - testing
    • obi development & test

Evaluation

A high-fidelity prototype was shared at European Utility Week. As a result, we gained equity funding from new investors as well as new customers, improving company profits. In addition, this project was also awarded at The European Talent Awards – Aquent (finalist UX category).