BE AWARE - Game-inspired mobile application

The game-inspired mobile application called Energy Life provides awareness tips and consumption feedback via a mobile application for smart phones.

The main interface resembles a carousel, adopted as a closed-loop menu to select items. The carousel concept can for instance be found in old arcade machine video-games, where the carousels are used to enable the best players insert their initials and appear on the high score screens. Carousel models are now widely used on web pages in order to display image galleries or menus, as well as in multi-touch installations.

In recent web browsers, different tools and languages such as JavaScript, Adobe Flash, or Microsoft Silverlight can be used to implement the carousels. However, these solutions are suitable for displaying 3D carousels on a desktop browser but not for using browsers on mobile devices due to technical restrictions. On the smartphone, using JavaScript would be too slow, and Flash and Silverlight are not supported by the smart phone’s web browser. These examples are not including any touch and movement recognition either. Some applications on the smartphones have components that can be described as carousels, like the rotating menu that is used to set the alarm clock or the timer. However, these applications are among the native ones and could not be used. Therefore, a new carousel solution was designed for this application.

The application client is a Web application adapted for touch screen enabled mobile devices, communicating with a server that delivers the data into the application. The server is connected to miniaturised and wireless sensing devices in the household via a base station, sending instantaneous power data continuously with a lag of 1 to 2 minutes. The user interface and the 3D carousel component run in the client browser, where the main screen shows the main menu (Carousel Menu), including the items Profile Setting, General Advice & Quiz and Community Access. By tapping on one card, several sub-screens become available. The submenu Historic Analysis displays the consumption history of the device; Advice tips show all the advice on that specific device; one submenu is the Quiz, another is Tools, and still another submenu is Settings.

In the application, each electrical appliance in the household is represented by a card, which has a front and a back. The design gives the impression of being a two-faced card, and all the cards are distributed around the circumference of the circle with their fronts facing the user. The number of cards created for the carousel varies according to what is present in the household.  The fronts of the cards show a picture of the appliance, its current electricity consumption, and how much electricity the appliance is saving in relation to the average consumption from the beginning of the game. The input from the user to the system consists of touching the screen in ways similar to the action one would perform on the actual object: rotations, pressures and ticks. When a card is tapped, it flips around and shows a menu for that device, offering additional information and functionality for the given appliance.

If an appliance in the household is consuming too much, the ambient interface installed in the house will react. When the user turns on the light that is dedicated as an ambient interface it will slowly dim instead of instantly coming on. The mobile interface will also let the user know which appliance is consuming too much by dimming the image of the appliances in a similar way to the ambient interface.


Jacucci, G., Spagnolli, A., Gamberini, L., Chalambalakis, A., Björkskog, C., et al. (2009). Designing Effective Feeback of Electricity Consumption  for Mobile User Interfaces. PsychNology Journal 2009, volume 7, number 3, pp 265-289