In a game where the top level of play is mediated by a website - where in one sense the site is the game - then the site design, both interaction and visuals (if those can be separated) is vital. The design for the SAVE ENERGY serious game site, GreenMyPlace.net, has taken a while to mature but I think the result has been worth the wait.
We still maintain a set of prototypes where designs were turned into actual code, so the screen shots below sometimes link to an active site.
Our 1st prototype, designed by Eva Szàdeczky-Kardoss
Candidate 1 for updating the site, taken from a commercial Flash/html template
Candidate 2 for updating the site, taken from a commercial html template
Candidate 3 for web site template, taken from a commercial html template
Candidate 4 for the website, from a commercial Flash template
Candidate 5 for web site template, taken from a commercial Flash template
Candidate 6 for the website template, taken from original designs plus a commercial html template
Current working version for Green My Place web portal - intro/log-in page
Current working version - Europe view
Current working version - pilot view
Current working version - Mini-game 2: Window Watcher, Manchester
And that’s it! Presently, we are working on interaction refinements for the web portal, which will result in some visual alterations - so this is not the final final version. But its getting close. Real close.
Tags: designs, Green My Place, prototype, Serious game, web portal