5.5 Scrolling Backgrounds and Parallax Effects

Scrolling and parallax effects add depth and movement to your 2D scenes.

Step 1: Simple Scrolling Background

Use a script to move background layers at a fixed speed:

public float scrollSpeed = 0.5f;
private Vector2 offset;

void Update() {
    offset = new Vector2(Time.time * scrollSpeed, 0);
    GetComponent<Renderer>().material.mainTextureOffset = offset;
}

Step 2: Parallax Scrolling

Create multiple background layers (e.g., sky, mountains, trees).

Move each layer at a different speed relative to the camera:

public Transform[] layers;
public float[] parallaxScales;
public float smoothing = 1f;
private Vector3 previousCameraPos;

void Start() {
    previousCameraPos = Camera.main.transform.position;
}

void Update() {
    for (int i = 0; i < layers.Length; i++) {
        float parallax = (previousCameraPos.x - Camera.main.transform.position.x) * parallaxScales[i];
        layers[i].position += new Vector3(parallax, 0, 0);
    }
    previousCameraPos = Camera.main.transform.position;
}

Activity: Add scrolling and parallax backgrounds to your 2D level for dynamic visuals.

Summary of Module 5

By the end of this module, you will:

• Understand the key differences between 2D and 3D game development.
• Be able to create 2D environments using tilemaps and sprites.
• Build a functional 2D character controller with physics-based movement.
• Add physics interactions and dynamic visual effects to your game.

With these skills, you can create engaging 2D games that are both fun and visually compelling!