Game Development Reference
In-Depth Information
Chapter 6
Sprites and Sprite Sheet Animations
Loading in bitmap graphics is a necessary procedure and gives you the ability to further style and polish your games,
but as your games require more and more graphics, it's not ideal to load them all individually. In this chapter, you'll
learn how to better optimize your load times, and how to achieve even better performance by using sprite sheets.
Using sprite sheets with EaselJS, you'll also see the benefit of using bitmap fonts, and how animated sprites can bring
your characters to life.
Animation and sprite sheet applications will be covered and compared, and you'll see how you can use them to
prepare your assets for single frame or animated sprites for EaselJS. These procedures all revolve around the sprite sheet.
Sprite Sheets
Sprite sheets are images that contain many images within a single file. They are usually accompanied by a
corresponding data file that specifies the regions for each image. A sprite sheet can be built to specify both images
and image sequences, or
sprite animations
. Figure
6-1
shows an example of what a sprite sheet might look like when
creating the assets for a mancala game.
Figure 6-1.
Sprite sheet using graphics for a mancala game
