Final Project: Phase IIIb – Design Stage 2 - Low-fidelity prototype

Task: Concept generation, low fidelity prototype, user-evaluation walk through

Concept generation:

Now, we shall go on to the process of conceptualizing the UI for the ePan. In conceptualizing, we will follow this information architecture:

1. Home
2. Games
   a) Single Player
   - Game 1
   - Game 2
   b) Multi Player
   - Game 3
   - Game 4
3. Cartoons
4. Nutritional Calculator
   a) Appetiser
   b) Main Course
   c) Drinks
   d) Desserts
   e) Kids Menu
5. Drawing pad
6. Gallery

Hence we went about sketching the design of each feature on pieces of A4 sized paper. We opted for a simple and clear layout with the five features of the ePan, as well as the “home” buttons and the sound toggle forming a row at the top of the screen, while any sub-menu buttons would be located on the left taskbar. This layout is chosen as it is very similar to what people encounter when surfing the web, hence will match real world expectations that will make using our system easy and intuitive (part of Jakob Nielsen’s 10 heuristics). The sub-menu for the cartoons is placed on the right instead of the left as we know the top left portion of the screen attracts the most attention. We want to allow audience to be able to focus their attention on the cartoon video instead of having the sub-menu intruding on their view.

First, the system will run into the home page, where a welcome message will be shown:

In creating the games page, I proposed to include a game, spot the difference as one of single player games. This game is proposed as it can be played by a single person, or a group of players can try to spot the difference at the same time and it is addictive. Next, an example of games layout is showed below:

Following is an example of the layout of the cartoons screen:

Next, is the layout of the nutritional calculator screen:

Finally, is the layout of the drawing pad screen:

We used these paper prototypes and did some user testing. From the user testing, we had feedback that the drawing pad only allows clear all function may not be user friendly as some users may only want to clear a small part of the drawing pad. Therefore, we shall include an eraser in the high fidelity prototype.