[JumpingJack PIC] Chapter 12.   A Side Scroller


The player's sprite in a side-scrolling game usually travels left or right through a landscape that extends well beyond the limits of the gaming pane. The landscape scrolls past in the background while the player jumps (or perhaps flies) over various obstacles and bad guys, landing safely on platforms to collect treasure, food, or rescue Princess Peach. Of course, the quintessential side-scroller is Super Mario (still available today in many versions, on many platforms).

Most side-scrollers implement their backgrounds using tile maps: the tiles can be square, rectangular, or any shape once transparent GIFS are brought in. Tiles can be unchanging blocks, animated, or behave like (clever) sprites.

Backgrounds are often composed from several tile map layers, representing various background and foreground details. They may employ parallax scrolling - layers 'further' back in the scene scroll past at a slower rate than layers nearer the front.

Tiling is a versatile technique: Super Mario (and its numerous relatives) present a side view of the game world, but tiles can offer bird's eye viewpoints looking down on the scene from above, and isometric views, as is Civilization, to create a pseudo-3D environment. We'll implement a basic isometric game in the next chapter.

This chapter describes JumpingJack, a side scroller in the Super Mario mould, considerably simpler, but illustrating tile maps, layers, parallax scrolling, and a jumping hero called 'Jack' who has to dodge exploding fireballs. A screenshot of JumpingJack is at the top of this page.

JumpingJack has a few unusual elements: the foreground is a tile map, which Jack scrambles over, but the other layers are large GIFs. The background layers and tiles wrap around the drawing area, so if Jack travels long enough he returns to his starting point. There is an introductory start-up 'screen', which doubles as a help screen, toggled by pressing 'h'.

An instrumental version of "Jumping Jack Flash" by the Rolling Stones repeatedly plays in the background, occasionally punctuated by an explosion audio clip when a fireball hits Jack.




Dr. Andrew Davison
E-mail: ad@fivedots.coe.psu.ac.th
Back to my home page