Midterm project: Final game-Jump Pinkie!

Inspiration:

I came up with the theme of my game when I was looking for different sprite sheets, as I really wanted to learn how to animate sprites during the development of my game. I came across “My Little Pony” sprite sheets, and thought it would be fun and colorful to work with ponies. Initially, I wanted to create a platform jumping game, but due to some challenges(listed below), I changed the concept of my game to a jumping pony game resembling the Chrome Dino Game.

Game Phase:

PinkiePie one of the characters in the cartoon is running away from the small dragon, that’s why she has to jump over it. Each successful jump adds one point. Also, when Pinkie Pie collects the star, she also gets one more point. Some funny phrases from the actual cartoon play, when she collects a star. When she hits Draco, the game is over and a funny cartoon phrase plays.

Challenges:

Unfortunately, while I was trying to create platform classes, place them randomly, jump over them and check for collisions, my program did not work, and I could not figure out the solution. That’s why I decided to stick to the game without platforms. It led to the alterations of the whole project and the assets of the game.

Also, one of the biggest challenges was the animation of the sprite, therefore I am really happy with the result that my pony is running. However, I couldn’t do two consecutive animations. For example, when a pony is jumping do jumping animation, and then change to running animation immediately.

Code:

Parallax motion:

image(back1, x1, 0, width, height);
image(back1, x2, 0, width, height);

x1 -= scrollSpeed;
x2 -= scrollSpeed;

if (x1 < -width){
  x1 = width;
}
if (x2 < -width){
  x2 = width;
}

Create dracos and check for collisions, if yes the game is lost(same for the stars):

//creates dracos
if (millis() >= lastFrame + frameDelay) {
  dracos.push(new Draco());
  frameDelay = random(0.6, 1) * 2000;
  lastFrame = millis();
  score++;
}
//draw dracos and check for collision
for(let d of dracos){
  d.move();
  d.display();
  if(pinkiePie.hits(d)){
    gameState='lose';
    console.log("game over");
    gameLost=true;
    //noLoop();
  }
}

Class Pinkie Pie:

class PinkiePie{
  constructor(animation){
    this.size=80;
    this.x=40;
    this.y=300;
    this.vy=0;
    this.gravity=3;
    this.animation = animation;
    this.w = this.animation[0].width;
    this.len = this.animation.length;
    this.speed = 0.2;
    this.index = 0;
    
  }
  
  display(){
    let index = floor(this.index) % this.len;
    image(this.animation[index], this.x, this.y, this.size,this.size);
    
  }
  jump(){
    if (this.y==height-100){
      this.vy=-35;
    }
    
  }
  hits(elem){
    return collideCircleCircle (this.x,this.y,this.size,elem.x,elem.y,elem.size);
  }
  run(){
    this.index += this.speed;
    this.y+=this.vy;
    this.vy+=this.gravity;
    this.y=constrain(this.y, 0, height-100);
  }
}

Class Dracos/stars-aka obstacles:

class Draco{
  constructor(){
    this.size=40;
    this.x=width;
    this.y=height-70;

  }
  
  move(){
    this.x-=6;

  }
  display(){
    image(draco, this.x, this.y, this.size,this.size);
  }
}

Reflection:

Even though I had a lot of challenges when I was making the game and my initial concept was changed, I am really happy with my result.  I learned a lot during this process of mistakes. Also, I learned that breaking the problem into small problems is really great way of development. I started the code with primitive shapes and then started adding my assets and animation, point system and etc. I was checking the animation code separately and added it only when it was finally moving.