Menus and Settings - Building JavaScript Games for Phones, Tablets, and Desktop - page 254

Finally, in the update method of the PenguinPairsGameWorld class, you retrieve the current value of
the slider and use it to update the volume of the background music:
sounds.music.volume = this.musicSlider.value;
Note Most games contain some menu screens. With these screens, the player can set options, choose
levels, watch achievements, and pause the game. Creating all these additional screens can be a lot of work
that doesn't contribute to the actual game play, so developers tend to put less effort into them. But that is a
very wrong decision.
An artist once said, “Your game is as good as its worst screen.” If one of the menu screens has poor quality,
the player will get the feeling the game is unfinished and the developer didn't put enough effort into it.
So make sure all your menu screens look beautiful and are easy to use and navigate.
Think carefully about what you put in these screens. You might be tempted to create options for everything:
the difficulty of the game, the music to play, the color of the background, and so on. But remember, you're the
person who should create the game, not the player. You or your artist should determine what gives the most
interesting game play and the most compelling visual style, not the user.
Try to avoid options as much as possible. For example, should a player really set the difficulty? Can't
you adapt the difficulty automatically by monitoring the player's progress? And do you really need a
level-selection screen? Can't you simply remember where the player was the last time, and immediately
continue there? Keep your interface as simple as possible!
Reading and Storing Game Settings
Having the slider control the volume of the background music isn't complicated. Now, suppose
you want an on/off button to control whether the player can press a button to view a hint. Where
should you store this option information? In this example, it's stores in a special variable called
GameSettings . You declare this variable in the same place where you declare the sprites and sounds
variables—the PenguinPairs.js file:
var GameSettings = {
hints: true
};
This variable is now accessible everywhere. Note, however, that it isn't persistent across game plays:
if you close the game and open it in the browser later, the variable defaults to its original settings.
In Chapter 21, you see a way to maintain data across different game plays.