QUIZ
Figure 6-7. After success, a video clip
A game or, indeed, any application, must communicate effectively with the user. Sometimes, you may
want to be subtle, but a good rule is to provide feedback for every user action, or at least think carefully
and make a conscious decision to not provide direct feedback. The color changes are feedback. The
video is feedback: the player who completes the game gets a visual reward.
This program should be considered a starting point. As designer, you will need to make decisions on
retries, game completion, hints, and so forth. I decided to make this game a random selection of 4
questions from a set of 20. You could consider these sets of 4 questions rounds in a longer game. You
could present one country along with several alternatives for its capital. And you could use images (img
elements with the src values set by code) in place of names. See the “Building the Application and Making
It Your Own” section for more ideas.
Our quiz program creates HTML elements that change and move around the screen as a result of player
action. It also uses arrays of arrays to hold information, and it includes video that plays at a specific point
in the game. Its hard to imagine a sophisticated game nowadays that wouldnt include such elements.
Moreover, this program suggests the potential of games for education, certainly an area worth exploring.
Critical requirements
A quiz requires a way to store information or, to use a fancier term, a knowledge base. We need a way to
choose specific questions to ask, hopefully randomly, so the player sees a different set of challenges
each time. Since what were storing is simply pairs of names, we can use a simple technique.