Visual Design of Games: Cheese or Font?
To understand a bit about graphic design in games, let’s examine the game Cheese or Font.
We can categorize all the elements of Cheese or Font as follows:
- Core: “Play Quiz” button, input field for “f” or “c” answer, correct/incorrect feedback indicator
- Supportive: “How To Play” instructions, symbol labels (double arrow down means “Forced Order”, an x means wrong answers)
- Extraneous: timer, “Pause” button, play count, table graphic (displaying correct/incorrect on answered), average score/stats, drop-down menus to change visual display
Rearranging the core elements, we can come up with some interesting layout design sketches.
One thing in particular that was interesting to play around with was proximity. Similar elements, such as the “cheese?” and “font?” buttons in many of these designs are close together to signify their relatedness, whereas other elements such as the correct/incorrect indicators are entirely separate.
But let’s move onto a beautiful game.
This is screenshot from Okami, a 2006 action-adventure game featuring a wolf who embodies the goddess Amaterasu as she travels across Nippon (japan), freeing it from its curse.
The art of the game is animated like Japanese ink-illustration, but despite the constant effects during battle, the HUD is simple and clear. The top left corner contains symbols to represent Amaterasu’s current solar energy (or health) and ink pot capacity, where as the bottom right corner contains a red bar to represent the boss’ life. The proximity of each element with one another along with the simple and careful use of symbols keeps the HUD clear and allows players to focus more on the battle at hand.
