Week 5 – Midterm Progress

Concept

I was thinking for a while of a good midterm project that would combine everything we have been taught so far and would be also fun to make and even more fun to play/experience. I came up with an arcade style game that combines the fast paced racing games I used to play as a kid to the fun and popular endless runners like “Subway Surfers”. I am making a game where the player controls car movement left and right to avoid oncoming traffic and collect coins. The more the game progresses and the more coins the user collects, the game becomes faster and therefor harder making it a fun challenge for everyone.

User interactions
  • Arrow keys to move the car left and right, allowing for quick and responsive controls
  • Randomly positioned traffic that appears on the screen, requiring strategic movement to avoid collision
  • Randomly appearing coins that the player collects to increase their score, encouraging risk-taking and precise movement
  • A progressively challenging difficulty curve where traffic increases in speed and density over time
  • Game over state when the player collides with traffic, prompting a restart option to try again and improve their score
Code design

I have structured my code using object oriented programming with the following classes:

Car – Represents the player’s car and handles movement

Traffic – Represents the incoming traffic and resets to random position when it moves off screen

Coins – Represents collectable coins that appear at random positions when collected

Additionally the game includes:

Score system

Collision detection system

Car class:

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
class Car {
constructor(x, y, w, h) {
this.x = x;
this.y = y;
this.w = w;
this.h = h;
}
display() {
fill(0, 0, 255);
rect(this.x, this.y, this.w, this.h);
}
move() {
if (keyCode === LEFT_ARROW && this.x > 100) {
this.x -= 50;
} else if (keyCode === RIGHT_ARROW && this.x < 400) {
this.x += 50;
}
}
}
class Car { constructor(x, y, w, h) { this.x = x; this.y = y; this.w = w; this.h = h; } display() { fill(0, 0, 255); rect(this.x, this.y, this.w, this.h); } move() { if (keyCode === LEFT_ARROW && this.x > 100) { this.x -= 50; } else if (keyCode === RIGHT_ARROW && this.x < 400) { this.x += 50; } } }
class Car {
    constructor(x, y, w, h) {
        this.x = x;
        this.y = y;
        this.w = w;
        this.h = h;
    }
    display() {
        fill(0, 0, 255);
        rect(this.x, this.y, this.w, this.h);
    }
    move() {
        if (keyCode === LEFT_ARROW && this.x > 100) {
            this.x -= 50;
        } else if (keyCode === RIGHT_ARROW && this.x < 400) {
            this.x += 50;
        }
    }
}

Collision detection:

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
if (car.x < traffic.x + traffic.w &&
car.x + car.w > traffic.x &&
car.y < traffic.y + traffic.h &&
car.y + car.h > traffic.y) {
console.log("Collision with traffic!");
noLoop();
}
if (car.x < traffic.x + traffic.w && car.x + car.w > traffic.x && car.y < traffic.y + traffic.h && car.y + car.h > traffic.y) { console.log("Collision with traffic!"); noLoop(); }
if (car.x < traffic.x + traffic.w &&
    car.x + car.w > traffic.x &&
    car.y < traffic.y + traffic.h &&
    car.y + car.h > traffic.y) {
    console.log("Collision with traffic!");
    noLoop();
}

Currently I have the car and the traffic as simple p5 box objects while I set everything up, but will change them to images as I work on the project.

Challenges and Risks

The most complex part of the project so far was implementing collision detection and ensuring objects reset properly. This was essential for making the game playable and preventing unfair conditions where the player could not avoid obstacles. I have dealt with this challenge already, but I am thinking of implementing a power up system into the game which might bring a completely new set of challenges with it.

Next steps

While the core mechanics have already been implemented there is still work to be done such as:

Add game sound

Improve the visuals

Add high score tracking

Possible implementation of power up system

 

So far this project has been a great learning experience, I am looking forward to work on it even more and refine it further!

Leave a Reply