• CLIENT

    Viljo/OSS

  • CATEGORY

    Energy consume tracking

  • ROLE

    UI/UX - Interaction - Branding Designer

  • DATE

    2019

Viljo / OSS is a company that targets people of all ages using electricity in Norway, allows them to keep track of their electricity expenditures and make savings in this regard. The company has a device called OSS which connects to the network and this device can report to its users, how much every electricity appliance spends if they are defined in the application. As a result, users can monitor their consumption and take the appropriate measures accordingly.

PROBLEM

It was necessary to prepare some boring graphics to allow users to keep track of their electricity expenditures. In addition, it was important for users to find a method to visualize the data and keep track of their expenses easily. As a result of the target audience analysis, we found that the target audience covers the 17-44 age range. It was necessary to prepare a new and fun brand language considering this.

User journey

Fact

Opportunity to save for those who want to save money.

Fact

Users want to keep track of their electricity consumption.

Fact

They want to compare their monthly consumption values.

Fact

They want to choose the electricity distribution company that best fits their budget.

Fact

Take reports periodicly.

Fact

Creating spending limits.

Fact

Being able to receive warnings and make new programs when they exceed spending limits.

Fact

Making short-term or long-term programs and keeping track of the savings.

User persona

Taking from 3 different categories were prepared for real users. The structure of the application was created based on the behavior and living conditions of these persona.

Wireframes

Mobile App

Live feed
Why?

Similar to today’s application - but give the user insights in how the total consumption is divided into different consuming units. I.e. Heating, lighting, stove, refrigerator. Give the user the possibility to add or rename a device from this list.

History
Why?

In addition to see consumption for day, week, month and year – give the user the possibility to compare consumption with earlier consumption, give the user possibility to add and remove notifications connected to consumption, give the user the possibility to divided consumption into units, give the user the possibility to view estimated bill for selected period.

History
Why?

In addition to see consumption for day, week, month and year – give the user the possibility to compare consumption with earlier consumption, give the user possibility to add and remove notifications connected to consumption, give the user the possibility to divided consumption into units, give the user the possibility to view estimated bill for selected period.

Reports
Why?

Give the user access to reports page where she can get status for current month, expected cost for current month, compare performance with last month, compare consumption with similar households, compare consumption with individuals in her network, view of consumption break down in units, View notifications based on performance.

Units
Why?

Give the user insight in consumption breakdown for day, week, month and year. Access unit page to understand patterns. Add alarms and notifications to units.

Performance
Why?

Give the user access to create challenges and read performance of challenges. Edit challenges and give user access to challenge friends in the network, Share performance on social media?

Notification
Why?

Show status for this day, this week, this month, this year. In the performance view the user can view electricity consumption summary and how much she has saved. Should the user also see the results of challenges?

Settings
Why?

Notification are viewed as teasers that the user can tap to view more or delete notification. Notifications are generated from: Automatic triggers from usage (i.e the user have been spending more than she defined in a challenge) Automatic triggers from the market (i.e. The prise of electricity is low between 02 am and 03 am) Automatic triggers from devices (i.e. your fridge has not been working for 2 hours) Stories from viljo.no. How should we show notifications on other screens? i.e. the live feed?

Design Steps

Branding

accepted
rejected
rejected
rejected

Design System

Mobile Application

  • Roboto
  • H1- 36 Bold
  • H2- 20 Bold
  • H3- 16 Bold
  • H4 - 14 Regular
  • Photoshop
  • Illustrator
  • After Effects
  • Adobe XD

Mobile Screens

Registration
Registration
Why?

If the user has only one meter, there’s no need to show a drop down selection.

History screens
Other screens
Different alternatives for customize
Different color alternatives for graphics

Website

  • Roboto
  • H1- 50 Bold
  • H2- 32 Bold
  • H3- 28 Bold
  • H4 - 16 Regular

All Pages

CONCLUSION

Taking from 3 different categories were prepared for real users. The structure of the application was created based on the behavior and living conditions of these persona.