Visual Design of Games — Dilan Nana

Completed Exercises: 

Core: 

1. The Play Quiz Button so the user can begin the game
2. The score out of 50 to show the user their progress
3. The timer so the player knows how much time they have left. There is no indication elsewhere that this game only lasts 5 minutes. 
4. The words in the “Cheese or font?” column (excluding the label at the top ‘Cheese or font?”)
5. The input box for the player to enter their answer
6. The “Resume” button after a user presses pause. Although the “Pause” button is not necessary, escaping the “pause” is a necessary button. Otherwise, the user loses their progress and must start over. 

Supportive:

1. The label above the left-hand column in dark orange “Cheese or Font” because it could technically be removed and the player still understand what to do to some extent from the name of the game. However, it is helpful to see and be reminded: “oh I need to figure out if the words in this column are fonts or names of cheeses.”
2. Instruction saying “Enter C or F” 
3. The text showing whether the user’s entry was correct or incorrect i.e. “Correct! Just kidding, it’s a cheese” or “Font”; it’s not vital to game play but is helpful for users to see how they’ve been performing in addition to their score (which answers they specifically got right and wrong)
4. The “Replay” button after the game is finished. Technically, one could just reload the browser and get a new game, but a replay button makes the restart experience more intuitive. 
5. The “Pause” button 

Extraneous

1. Average score – this is not helpful for gameplay nor is it necessary to play the game (this is shown after game is over)
2. “Challenge friends” button – this is same as the “Average Score” reason above
3. The doubled labels for “Enter C or F” and “Cheese or Font.” Once displayed on the left table, there is no reason to repeat the instructions for the right table. 
4. Highlighting the current row for which the user is entering an answer. 
5. The level of expression in the labels i.e. “Correct! Just kidding, it’s a cheese” or “NOT FONT. RAGUSANO CHEESE YUMMY.” These are not necessary and could simply be replaced with “correct” and  “incorrect” or “font” and “cheese.” When a user enters a wrong answer, the font can retain the red-colored text functionality and the game still makes sense. 
6. The next and previous buttons
7. The ads
8. The option to play other games

Sketch of the core elements: 

One element that is HUGE: 

One color in thumbnail along with black: 

3-4 thumbnails using type in different ways: 

Proximity

I think that the logistical information such as the timer and the score should be grouped together. The user does not need to explicitly interact with these pieces of information, but the user does need to see them. In contrast, the user interacts with the “Font or Cheese” button (or input in the real game) and the arrows next to the word (or the prev and next buttons in the real game). Since the user has to explicitly touch these buttons or type things in, the game content that requires user action should be grouped; it’s the focal point of the entire game: the word and the buttons.

Screenshot of game: 

Explanation: 

 

For this prompt, I chose “Where’s My Water” which is an incredibly addicting game I played in high school. The game looks very cartoonish but realistic at the same time. The graphic designers made the terrain look like dirt or earth, the rocks, although purple, have markings on them to make them look boulder-ish. 

Furthermore, the water has bubbles in it and continuously moves like real water being swayed by wind. The ducks in the game, if embedded in dirt, also have a circular cutout surrounding them so they are easy to spot since their color is similar to the dirt. Also, in the top left, the user can see their progress through the number of ducks they get, because the ducks change color as the user “fills the ducks” with water. If the user gets all three, then they successfully completed the level and all three ducks turn from orange to yellow. 

The designers also picked colors well. The colors contrast nicely: we have blue contrasting with the orange-hued dirt. We have purple contrasting with the gray blowers. 

In terms of realism, the designers also add intuitive water functionality as well: when the water moves and falls, it splashes upon contact with a surface; it flies up walls as it makes impact; it runs off down paths the user didn’t expect as water might do in reality. This hints at the designers’ larger emphasis on the laws of physics. They made the game fantastical and challenging but still kept the principles of physics parallel in the game to reality to ground the game in what users know, such as that water would fall from a higher height to lower height due to gravity.

Lastly, the designers took a hierarchical approach to the game: the user starts at the top of the screen with the water and essentially must get the water to the bottom of the screen to the alligator; never is the alligator positioned above where the user starts and water is supposed to magically fly up to it.