As it was mentioned in Chapter 1, Starting the Game, continuous backgrounds and foregrounds for games are created using small images tiled together, creating an illusion of a very long graphic strip. The more pieces the game has, the more varied is the appearance of the strip. Although this is only a compilation of flat images, an artistic illusion of 3D space can be created to divide the scenery by individual layers, changing their position at various speeds. The foreground will move normally, the further ones will be slower and the most distant will almost stand still. Such a visual scene convinces the viewer that it has depth, interpreting it as the natural physical phenomenon known as parallax . It characterizes the apparent alteration of a visible object's position against a far background when viewers changes their location. The closest objects change their position very noticeably (in other words, they have a pretty big parallax), but the distant ones alternate only a bit (small parallax). The most spectacular and vivid example of parallax in action can be observed from a window of a moving car: the landscape flows irregularly; objects on roadsides, such as bushes and utility poles, move quickly; more distant elements, such as houses and trees, move slower; and hills or mountains on the horizon are snail like, but the sky looks like a fixed image. By moving in the car, viewers change their position constantly. Being in such a state enables them to see the incessant demonstration of parallax. The following figure shows a character in motion who faces parallax:

The artificial graphic landscapes can utilize the same principle to look convincing. For the first time such an idea was adapted by traditional animators. As you know, the drawn animation was based on the layer system: moving pictures were created on stacked transparent cells (sheets made of celluloid), which are as flat as ream. But, the transparent layers were distributed at some distance between each other and arranged in an improvised cabinet, and so multiplane camera was invented. Walt Disney patented the device in 1940. It helped to simulate the behavior of real-world scenery because all components have different distances from the camera lens and react accordingly to the natural parallax formula. It was a model of three-dimensional landscape with depth based on separate flat images. The first cartoon that demonstrated the spectacular advantages of such system was The Old Mill produced by Disney in 1937. The method was immortalized in the same year when Snow White and the Seven Dwarfs released.

The following image shows a parallax layout of a game scene:

2D games use the same approach to create the illusion of depth. Of course, they have no cabinet for layers, but the landscape is fully constructed of flat images, which have specific rules to determine their speed. One of the early examples of scrolling parallax can be found in the game Jump Bug published by Rock-Ola in 1981. It featured a solid main scene that scrolls, a fixed night sky with some stars, and slowly moving clouds. This can be read as an attempt to illustrate the depth of a virtual scenery. A year later, the game Moon Patrol was developed by Irem, in which the scrolling parallax was implemented in full form. The game had three moving layers that vividly simulated the distance between them.

Commonly, the scrolling parallax in games is calculated by eye, without any conceptual formulas, because nobody knows the exact z position of objects in the background, allowing them to have any given speed (that is, in a case it looks persuasive enough). There is only one general rule: counting from the main scene, each next layer should be slower than the previous one. For instance, you give the main scene speed that is equal to a variable called v, the next layer should be v x 0.4, followed by v x 0.2, and so on. Your own taste forms the picture.

The following figure shows the calculation of a scrolling parallax:

But there is another way that is special for captious persons, a special formula that can be written. All you need to do is choose the distance to the horizon in your game scene (in the real world, this value is nearly equal to 5 kilometers, but you are most likely to choose something in pixels). At this distance, objects have no apparent alteration, that is, a vanishing point. Then, using the normal speed of the main scene, a right triangle can be constructed. It helps to calculate the speed of each layer, depending on its distance from the horizon (this value should be defined by you manually). All you need to do is determine the angle between the hypotenuse and the adjacent side using the arctangent function. Next, a simple trigonometric formula will help you to figure out specific speed properties of any remote object.

To the effect of elements' speed, there is an interesting phenomenon: if you use in the background a regular-designed continuous element, consisting of something that looks like a geometric ornament with identical images, and whose speed is high enough, you will see what is called the wagon-wheel effect .

Instead of moving from right to left, as it was intended, the element will begin to move backward! It is terrific! Why? All the variables are correct! It can drive you crazy! Don't worry, this is not the fault of the game engine, but only a result of a strong optical illusion. Recall a fast-moving car that is shot on camera; in this case, it has rims with spokes. The movement of the wheels looks very odd, that is, the rims and tires rotate normally, but the spokes move backward. Coaches and wagons, whose wheels rotate in the opposite direction, are even better illustrations of the illusion; several movies depict this phenomenon, making us familiar with it. The illusion is based on the fact that despite an element moving with the correct vector of speed, it suddenly appears in the unpredictable positions on the screen. The following is a figure showing the wagon-wheel effect:

As you can see, there is a row of identical utility poles in the background, but for descriptive reasons, I marked odd poles with a dot. If the row moves at a slow speed, total time is normal: each pole successively passes the grid, drawing a trajectory with phases that stay pretty tight. What if the speed is wrong, that is, it is higher than the specified threshold? As you can see, the distance between phases is increased, each individual pole leaves the screen very quickly, but because the objects are so identical, a viewer begins to mistake one pole with the next one, which is displayed to the right. In this case, the human visual system makes an incorrect judgment about the direction of the movement (don't blame it, because the task is truly hard) and the poles suddenly begin to move backward. The phenomenon can be defeated easily: the speed should be changed so there will be no contradiction between the general frequency and the frequency of the objects appearing on the screen.

It is noteworthy that besides the parallax itself, there is another distinction that can increase the illusion of the third dimension in your game: aerial (or atmospheric) perspective. Even on a bright sunny day, distant objects look different than those nearby. There are many particles in the air: dust, water vapor, and so on; together they optically affect the rays of light, which transfers the information about visual properties of a particular element of a landscape. Figuratively speaking, there is a little noise in transmission. As a rule, objects that are far away have less contrast, are less saturated, the blue channel dominates their color spectrum, and their contour and details are blurry. The last feature is most important; an imitation of the field's depth not only looks great and natural but also creates a good contrast between the background (which is blurry) and the sharp main scene. This increases the expressiveness of the main character. If for the sake of the graphic style, you cannot make a blurry background (for example, if the graphic style is vector based and flat), use only colors and make them less saturated.

Sometimes, game developers also use a special layer placed between the main scene and a player called the foreground . Usually, it is passive and static. It does not comprise any important game scene components and only adds decorative value that creates special moods and increases the sense of the depth in a scene. Foregrounds are commonly blurred because they simulate a situation when objects that are too close to the viewers are out of focus. The typical subjects are grass, foliage, wires, and so on. The speed of these layers is always faster than the main scene, because they are closer to a player. There is also a unique feature: a scene depicted through a blurred foreground creates the sensation of peeping, as if somebody is looking at the situation on the screen from an ambush. A good inspiration source is Limbo, a game in which blurry and noisy layers of game scenes create profound feelings.