Improvements to the interface

Taking away from my last presentation, I have simplified my interface quite a bit. On the main page I have set it out in a nicer looking way, and taken out some unnesecary information. I have also made it so that the leaderboard is invisible, unless you press the arrow at the bottom. The tabs on the left have also been slightly simplified.

For the pages that display information, I have kept them the same colour for consistency and so the users don't get confused over what the colours mean. All now have red for high power use, and green, for low power use. There is also an indication saying "High Power Use" above what is using a high amount of power and "Low Power Use" for what is using a low amount.

Overall I think these changes make my interface much simpler and easier to understand, which is crucial if this was to be a real facebook application for saving power.

Final

This is the final design for the profile tab, the first tab that can be seen when opening the application. I wanted to give the user useful information at a glance. The user can see that their power use is below average and therefore has a green background. If the user would be using too much power the background will go red. Their progress can be seen at the bottom and other information like experience, rank, and the amount of experience needed to get to the next rank can all be seen in the same area. On the right, the user is reminded of possible achievements it could accomplish, along with how far along they are to accomplishing it "1 day to go".
I originally had all the other icons coloured, but so that there is not too much confusion, the tabs not in use are grey. The user can also see which page they are on at the top, with "home" being darker than the rest. Also "Money Saved" can always be seen at the top, in a larger font because of its importance. A small leaderboard can also be seen at the very bottom. It is simple and shows visually where you are ranked among your friends. The users picture is larger so that they can easily locate themselves.

The next tab, which shows the users house's power used as divided into "Home Appliances", "Water Heating" and "Lighting". The percentages along with the chart shows which parts of their house is using the most power.

The above 3 images are the remaining tabs that show power use around the house. The charts, icons and background are all matching, to make it easy to know which tab they're on. Information about each device is also shown. Showing the Watts that the device uses, along with the time it has been used that day and the Watts per hour. Also the devices can be shown individually, with more information by clicking the names below the chart. Although it did not choose to show this. On the home appliance tab a warning is shown beside the heater because it is using too much power.

I beleive that this type of application, if used on facebook, would encourage power saving with the use of competivness between friends, rewards through achievements and an easy to understand system. The other pages;  leaderboards,achievments and stats would be also similarly themed.

Further Development

Trying out a different coloured background to complement the main interface.

I added a tab to see all the different groups of energy use so that it is easy to compare. Also a tab to show the users information and progress. I placed it behind a browser to see if the size was correct

In this concept the devices are sorted in to groups; household appliances, water and lighting. They are represented by different coloured icons. Under each group, the appliances can be also selected separately.

Trying out different colour uses. The title corresponds with the colour of the icon

The title is the same color of the icon. Also, I think that it is easy to know which page you are on. I decided on this this type of chart because it is fairly easy to understand. Also the amounts that are largest are darker, which is also another way of understanding the chart. I like that the chart matches the specific group by using the same colour

Deciding on different layouts

A layout I made experimenting with the positioning of my original idea. The selected device is highlighted. Also the amount of money saved is larger to show its importance. The headings are also much Smaller and it is easy to see which page is selected.

I decided to move on from my original layout and tried to simplify it a bit. In this concept I also played with the idea of how to show data. Each ball representing a different device, its size shows how much power it is using and the string it is hanging on shows how long that device has been used for. Although I like the simplified look of this concept, I didnt think that this way of showing energy use was easy to understand.

Another simple looking layout that lists the different devices being monitored and shows information about them. I also played with a 3d look.

Prototype Description

I plan on designing a facebook application that can monitor several appliances, letting the user know how much power they are using, their average power use and money save while using the application.  The user can also compare power savings between their facebook friends, encouraging the user to try and save power as well as use the application more. The user can also get “achievements” for completing certain tasks, like saving a certain amount of power or being ranked highly among friends. These achievements should serve as a reward for saving power. The user can also see detailed data about their power use under a tab called “stats”. The reason why I wish to use facebook as the platform for my app is because facebook is the most used social networking site in the world, meaning that my application can be widely used. My user group will be young adults that wish to save power and money. Not only will my app make monitoring energy use easy but also fun and competitive with the use of leader boards and achievements. I will make a simple interface that is easy to understand and look appealing. Social media is a powerful tool and I wish to utilise it to make saving power easy, accessible, simple and fun

Prototype 4

Prototype 3

Prototype 2

Project 2 Prototype - 1

Concepts

 Layout for final prototype below

Looking at popular facebook games

Currently the most popular game on facebook is farmville. I think that creating a power monitoring app or game that simply shows how much power you use would not be used by anyone. In order for it to be affective, some type of rewards should be given other than that of the reward of saving power and money.

Ways that farmville rewards its players:
- rewards "ribbons" for certain achievments in game
- lets you progress by acquiring new crops, animals, items etc.

- can visit neighbors (facebook friends) to help them grow crops
- having a successful farm, makes the user feel like they are accomplishing somthing
- developing a relationship with your animals and crops, not wanting them to die
- allows you to collect things



Also in order to be successful in farmville, players must be social. This means that players invite other people to participate, in order to recieve in - game rewards. This pulls new players and in a way advertises the game.
The game also allows you to customize your farm, allowing to personalize it. Also competition between players makes players want to play more and be more successful in order to be better than their friends.

In my experience I have found myself playing "Tetris Battle", not onlybecause it is a fun game, but mainly because of competitiveness between me and my friends.

 
The leader board (which I have highlighted in red) can be seen every time you start the game and also more in depth under the leader board tab.
These kind of rewards and the competitivness of a leader board is something that I think would make my energy saving app successful