Part 2 — Platforms, a bigger world and a camera
Turn one bar of ground into a level that scrolls, with platforms to climb.
12 min readPart 1 left you with a character on a single strip of ground. Now make it a place.
Make the world bigger than the screen
The canvas is how big the game is on screen. The world is how big the level is, and it can be much larger.
- Click empty canvas to select the scene, or pick it in the Scenes list.
- Set World width to
3840— three screens. - Leave World height at
720.
The stage now shows a wider area with the visible screen marked inside it.
Follow the player
- With the scene still selected, find Camera.
- Set Follow to
Player. - Set Lerp to
0.1.
Lerp is how quickly the camera catches up. 1 is rigid and
makes people queasy; 0.1 feels natural; below
0.05 feels like the camera is half asleep.
Extend the ground
The ground is 1280 wide and the world is now 3840. Rather than stretching one bar, place three:
- Select Ground.
- Press Ctrl/Cmd + D to duplicate it.
- Set the copy's X to
1920. - Duplicate again and set X to
3200.
Leave gaps between them if you want somewhere to fall — that is what makes a jump matter.
Add platforms
Generate a smaller bar for platforms so they read differently from the ground:
- Press ✨, generator
roundedBar, nameplatform. - Options:
{ "width": 220, "height": 28, "color": "#818cf8", "bevel": true }. - Add it, then double-click the tile to place one.
- Give it static physics, exactly like the ground.
- Duplicate it around the level. Vary the heights — 560, 460, 380 — so there is a climb rather than a staircase.
How far can the player actually jump?
This is worth measuring rather than guessing, because a gap one pixel too wide makes a level impossible and it is not obvious why.
- Press Play and jump straight up. Note roughly how high the character gets.
- Jump while running. That is your maximum gap.
- Make your widest gap about three quarters of it.
If the jump feels wrong, change jumpVelocity on the
behaviour rather than moving every platform — one number instead of twenty.
A backdrop
- Press ✨, generator
gradientSky, namesky. - Options:
{ "top": "#1b2a44", "bottom": "#6a5a8c", "width": 1280, "height": 720 }. - Add it and place it in the scene.
- Set its Layer to Background.
- Set its Scroll factor to
0.3.
A scroll factor below 1 makes the backdrop drift more slowly than the world, which reads as distance. That is parallax.
Play it
You should be able to run right, watch the camera follow, climb the platforms and fall down the gaps. Next: give the player a reason to.