Correctly adjusting the camera behavior in a classic 2D platformer is not as easy as it may seem.
The easiest approach is to tightly tie the camera to the player’s character so that it is always in the center of the screen. This may come down for prototypes, but this camera has flaws that annoy players.
')
For example, if the camera shifts up with each jump of a character, then it can easily cause nausea. In addition, during instant acceleration and stopping of a character, the camera can jerk sharply.
In our new
Tiny Thor game, we experimented with various options. I want to talk about what techniques we stopped as a result.
First, we process the X and Y axes independently of each other.
X scrolling
For the X axis, we set the left and right borders (the Focus area in the screenshot).
When a player moves, the camera calculates the distance between the previous camera position and the new player position. This way we will know how many pixels to scroll. To smooth this movement, we divide this distance by 32 so that the camera lags a bit. We also have a maximum camera speed that is never exceeded.
Different camera zonesTo avoid triggering the camera during each small movement, we apply scrolling only if the character leaves the left or right border of the focus area. At the same time, the camera immediately catches it.
Because of this camera lag, the visible area in the direction of the player’s gaze has decreased. This reduces the amount of important information on the screen that a player needs to react to enemies, obstacles, platforms, etc.
To solve this problem, we move the horizontal focus area based on the orientation of the character's sprite.
The camera is now looking in the same direction as the player. When a player moves to the right, the focus area shifts to the left, so that the character remains to the left of the center of the screen. With increasing character speed along the X axis, we shift the focus area further away from the center. Due to the increased apparent distance, the player can react to the difficulty level.
As a result, we received smooth camera movements, adapting to the following player actions, relieved him of irritation and provided greater freedom in level design.
Y scrolling
Scrolling along the Y axis follows a similar logic and uses the upper and lower boundaries of the focus area.
Instead of dividing the difference between the coordinates of the character and the camera by 32, we use divider 16 for the smoothing effect. Moreover, the camera begins to move only when the character is standing on the object, so that she does not follow each jump.
The camera starts scrolling along the Y axis as soon as the character has the ground under its feet. The camera does not move along the Y axis when the player jumps. The behavior of the camera along the X and Y axes in action. It seems that for ordinary cases these rules are enough, but if a player jumps near the top of the screen or falls into the abyss, the camera behavior “breaks”.
To solve this problem, we added two more horizontal lines checking the vertical position of the character. We call them “panic lines” (shown in dark yellow in the illustrations) because crossing them causes the camera to move quickly.
Therefore, when a character jumps or falls and crosses one of these lines, the camera quickly begins to follow it.
The camera catches up with the character as soon as he crosses the lines of panic. All this works fine in most situations at our levels, but in some cases we need to manually override this behavior.
We do this with simple rectangles in the level editor, which allow you to lock the camera along one of the axes while the character is in a given area.
This is very useful when you need to show the player that falling from the edge of the platform is safe.
Also, this function can be used in random areas of levels that are mainly oriented in one direction, for example, when falling down into a deep abyss filled with jewels.
We also use this logic to lock the camera in boss fights, when the player is still locked on the screen, and a stable camera helps him avoid all attacks and shots.
Another example of use is to completely switch the focus of the camera to another part of the level. The logic here is that the camera flies along the line between the position of the character and the desired area, stops there for a second and comes back again. We use it, for example, to demonstrate the consequences of using a switch.
All this allowed us to get the dynamic behavior of the camera, working without problems 95% of the time, and giving us the tools to manually set the camera behavior in those 5% of situations that are needed in the gameplay or for a dramatic effect.
about the author
Jochen is the founder of
Asylum Square , an independent game studio engaged in retrostyle games, which we loved so much in childhood. Inspired by the games of the 16-bit era, the Tiny Thor platformer will be released soon on
Steam .