Refined Interface

After receiving some feedback at the crit i made a few changes to my interface; you can now enter your own name into the title and the demonstration shows more clearly how one tree can change at a time.

file:///Users/alexmcdougal/Documents/112%20Interaction%20Design/Project%202B/TO%20HAND%20IN.html

Final Interface

So, in the end i developed from the possible display of the interface in my last blog and added some features to convey how the user would interact with it.

The buttons in the bottom corner provide visual explanations of the interface. The film strip shows a demo of how the forest can change according to how you drive and the note button shows a legend to help the user understand the different trees. Both of these buttons have links back to the main display which is the one in this image.

The trees are all individual buttons themselves, in terms of it being ultimately a touch screen, the user just needs to touch and hold the tree to get more information about what each tree means. in this case all the trees are positive contributing factors so the information is all in positive percentages, though if the trees were brown then the information would be a negative percentage.

The only constantly present text in the interface is "Your Forest", i did this so that the user is always reminded of their personal connection with the forest as it is their actions whilst driving that influence it. 

Over all i wanted my interface to be aesthetically pleasing and require little thinking in its operation from the user so that it would appeal to everyone and entice people to keep on using it.   

Still Interface

Here i made a possible display that the interface could produce as an example of how the user can interact with it.

To test it out copy and paste this link into your browser

file://localhost/Users/alexmcdougal/Documents/112%20Interaction%20Design/Project%202B/real%20final%20interface.html

How to Simplify the Interface - What works best

From the feedback I realised I needed to make the interface more simple in order for the trees to be more relative. There were two possible strategies i could do in order to achieve this:

1. I could completely simplify the trees in order to make them easier to understand, they would ultimately just be make out of circles each one representing a different contributing factor to the energy consumption, the colour indicating whether it was a good or bad factor (brown = bad, dark green = great). The user would simply touch the circle to access more information.

2. The other strategy would be to keep the existing tree shapes I have but simplify the legend down so there is just three block colours that are easy to remember, and each tree represents a different contributing factor to the energy consumption however, you would no longer have to remember what each one represents you would just touch the tree to find out more information.

Feedback:

After asking a number of people (both designers and non designers) which one they thought was better, almost everyone said that strategy 2 was a lot better looking and fit with the idea of the forest better. It appeared more sophisticated which would be better suited to the people who ultimately would drive - adults.    

User Feedback

I showed some people my current interface, explaining it to them as i intended to do so for the hand in, and asked them if there was anything they did not understand or thought certain aspects could be improved, this was the feedback i received;
- The weather was quite confusing, the rain made them think something bad was happening and that the sun was good. Otherwise they didn't like it at all.
- The colours between the status' were too similar so it was hard to distinguish the change with out a big change in the number of trees.
- Learning the different trees in the legend would also be difficult but without actually changing the trees to symbols of engines and so on it would be very difficult to change this fact.

Legend

I designed this legend that could be viewed when the user touched anywhere on the screen. It is intended to help the user understand what each aspect in the interface means, i tried to keep it as simple as possible.

Weather?

I experimented with adding a weather element into the interface. However, it was very difficult to work with and the over all aesthetics looked a little bit crowded and quite stiff. I don't think I want to try to make it as realistic as possible because it will most likely turn out looking tacky.

To view the weather in motion paste this link in into your browser

file://localhost/Users/alexmcdougal/Documents/112%20Interaction%20Design/Interface4.html