What is Gravity in a Platformer

hi

Imagine jumping in a game and floating forever without coming down. That would feel completely broken. Gravity is what pulls your character back down and makes movement feel real. Gravity in a platformer is a simple system that constantly pulls the player downward. It makes jumping, falling, and landing possible.

Try It in a Real Level

This runner loads GameLevel3: Crater Falls so you can feel gravity, jumping, moving platforms, and collision timing in an actual platformer level.

Game Status: Not Started

Example #1: Basic Gravity

One example is how a player falls when they walk off a platform. The game keeps increasing the downward speed every frame.

%%js


let y = 100;
let vy = 0;
const gravity = 0.5;

function update() {
    vy += gravity;   // gravity pulls down
    y += vy;         // apply movement

    console.log("Player height:", y);
}

// Simulate frames
for (let i = 0; i < 5; i++) {
    update();
}

Challenge

Gravity

Lines: 1 Characters: 0
Game Status: Not Started

What’s happening:

The player starts with no movement, but gravity increases velocity each frame, causing faster and faster falling.

Example #2: Jumping

The player should be able to jump up and then come back down naturally.

%%js

let y = 300;
let vy = 0;
const gravity = 0.5;

function jump() {
    // Add code here
}

function update() {
    vy += gravity;
    y += vy;

    console.log("y:", y);
}

jump();
for (let i = 0; i < 5; i++) {
    update();
}

Challenge

Jumping

Lines: 1 Characters: 0
Game Status: Not Started

Gravity with Game Mechanics

In real games, gravity is combined with limits and collisions to make gameplay smooth.

Example #3: Limiting Fall Speed

%%js

let vy = 0;
const gravity = 0.5;
const maxFall = 10;

function update() {
    vy = Math.min(vy + gravity, maxFall);
    console.log("Velocity:", vy);
}

for (let i = 0; i < 10; i++) {
    update();
}

Challenge

Terminal Velocity

Lines: 1 Characters: 0
Game Status: Not Started

This prevents the player from falling infinitely fast and breaking the game.

Platform Collision

Platforms stop the player from falling forever and allow jumping again.

%%js


let y = 320;
let vy = 5;
const platformTop = 300;
const playerHeight = 20;

if (y + playerHeight >= platformTop && vy >= 0) {
    y = platformTop - playerHeight;
    vy = 0;
    console.log("Landed on platform!");
}

console.log("Final y:", y);

Challenge

Platforms

Lines: 1 Characters: 0
Game Status: Not Started

Grounded Jumping

This makes it so you can only jump when on a platform or on the ground

%%js 

let vy = 0;
let isGrounded = false;

function jump() {
    if (isGrounded) {
        vy = -10;
        isGrounded = false;
    }
}

player.update = function () {
    const wDown = this.pressedKeys?.[87];
    if (wDown && !this._wWasDown) {
        jump();
    }
    this._wWasDown = !!wDown;

    const maxFall = 10;
    vy = Math.min(vy + gravity, maxFall);

    this.velocity.y = 0;
    this.position.y += vy;

    isGrounded = false; // reset each frame

    const platformTop = gameEnv.innerHeight * 0.6;
    if (this.position.y + this.height >= platformTop && vy >= 0) {
        this.position.y = platformTop - this.height;
        vy = 0;
        isGrounded = true;
    }

    const floor = gameEnv.innerHeight - this.height;
    if (this.position.y >= floor) {
        this.position.y = floor;
        vy = 0;
        isGrounded = true;
    }

    _originalUpdate();
    this.velocity.y = 0;
};

Challenge

Grounding

Lines: 1 Characters: 0
Game Status: Not Started

Platformers in Games 🎮

Ex:

  • In Mario: You jump and fall back down due to gravity
  • In Minecraft: You fall if there is no block under you (except in our game there is no fall damage) ➡️ Gravity is always running in the background