7 steps: From endless runner to platformer (JS Game development)

Some more game development guides for novice programmers.
We're taking our endless runner into a platformer by adding some collision detection.

This video shows how, in 7 easy steps, we turn our endless runner into a platformer.

0:00 | humansinabox.com
0:21 | Step1: All data in a global state
1:16 | Step2: Refactor code into functions
2:39 | Step3: Control the hamster with the keyboard.
4:28 | Step4: Change animation depending on hamster movement
6:47 | Step5: Collision detection: View the box
9:20 | Check out humansinabox.com
9:28 | Collision detection: Detecting collision
11:30 | Step6: Platforms should block hamster on collision
16:46 | Step7: Scene follows the hamster



The tools used here are:
VSCode
Aseprite for graphics
Google Chrome

Play the game: jacklehamster.github.io/hamster-run/

Source Code: github.com/jacklehamster/hamster-run/

Watch the whole series:    • New Channel Announcement: Developer with B...  


====
Check out our game:
Humans in a box: humansinabox.com/?utm_source=bignutsdev
Big Nuts Games: bignutsgames.com/?utm_source=bignutsdev