Simple game with Javascript

WALL-E (CLICK! to try the game)

My teammate and I decided to make a simple game. Our first idea was to make a game that’s similar to T-REX DINO from google chrome using balloons. We each opened up a separate p5 editor to code and decided to see how it goes from there. We helped each other out.

Our first conflict was to move ballon in a wave form. My teammate spent time to figure out how to move things in a wave form and I decided to move on. As a result my teammate and I came up with two distinctive games that are totally different but have a similar logic.

Screen Shot 2019-09-25 at 12.15.30 AM.png
//UFO DESIGN

  //lenz
  push();
  stroke(255, 255, 255, 180);
  strokeWeight(5);
  fill(0, 255, 0);
  ellipse(82, 95, 60, 50);
  pop();

  push();
  noStroke();
  fill(a-80, b-80, c-80,240);
  moonY = moonY - 0.5
  ellipse(moonY - 10, 75, 35, 35)
  pop();

  //bottom
  for (i = 0; i < 10; i++) {
    noFill();
    fill(255);
    stroke(0, 80);
    strokeWeight(1);
    ellipse(82, 100 - (2.3 * i), 120 - (1.5 * i), 10);
  }

  //top
  for (i = 0; i < 10; i++) {
    noFill();
    fill(255);
    stroke(0, 80);
    strokeWeight(1);
    ellipse(82, 75 - (2.3 * i), 70 - (1.5 * i), 10);
  }

  //draw radar
  for (i = 0; i < 10; i++) {
    push();
    fill(0, 255, 0, (20 * i) - 30);
    noStroke();
    rect(50 - (1.5 * i), 100 + (20 * i), 65 + (3 * i), 20);
    pop();
  }

  for (i = 0; i < 10; i++) {
    noFill();
    stroke(255, 255, 255, random(0, 255));
    strokeWeight(1);
    ellipse(80, 290 - (20 * i), 120 - (5 * i), 10);
  }
Screen Shot 2019-09-25 at 12.48.18 PM.png
//WALL-E DESIGN

var mouseClick = 0

function mouseClicked() { //had to use this instead of mouseIsPressed
  if (mouseClick === 0) { //to challenge the user
    userX = userX - 5 //movement speed of user charcater
  }
  
function draw() { 
//User character movement
  if (userX === 85) {
    userY = userY - 1
    enemyX = enemyX;
  }

  if (userX <= 85) {
    userX = 85 // when it reaches ufo, it won't move to left anymore
    enemyX = enemyX
  }

  if (userX <= enemyX) {
    enemyX = enemyX
  }

  //draw user character
  push();
  noStroke();


  fill(255);
  ellipse(userX, userY, 45, 80);
  fill(0);
  ellipse(userX, userY - 30, 75, 30);
  fill(120);
  ellipse(userX, userY - 17, 38, 10)
  fill(255);
  ellipse(userX, userY - 36, 45, 38);
  fill(200);
  ellipse(userX - 28, (userY + 3), 12, 60);
  ellipse(userX + 28, (userY + 3), 12, 60);
  fill(255);
  ellipse(userX - 30, (userY + 3), 6, 60);
  ellipse(userX + 30, (userY + 3), 6, 60);
  fill(0);
  ellipse(userX, userY - 32, 33, 23);
  fill(0);
  ellipse(userX, userY - 32, 33, 23);
  fill(0, 0, 255);
  ellipse(userX - 7, userY - 32, 10, 9);
  ellipse(userX + 7, userY - 32, 10, 9);
  pop();
}
Screen Shot 2019-09-25 at 12.15.48 AM.png
//draw the enemy character
  push();
  noFill();
  stroke(255, 204, 100);
  strokeWeight(1);
  if (userX <= 85) { //to make enemy stop when the user lost game
    enemyX = enemyX

  } else {

    if (userX <= enemyX) {

      enemyX = enemyX - 0.55; //make enemy move[SPEED](Game level)
    }
  }



  //draw electricity

  curve(enemyX - 30, 160, (enemyX - 10), 240, ((enemyX + 10) + random(-10, 30)), 300, ((enemyX - 30) + random(-10, 20)), 300);
  curve(enemyX - 30, 160, (enemyX - 10), 240, ((enemyX + 10) + random(-10, 30)), 300, ((enemyX - 30) + random(-10, 20)), 300);
  curve(enemyX - 30, 160, (enemyX - 10), 240, ((enemyX + 10) + random(-10, 30)), 300, ((enemyX - 30) + random(-10, 20)), 300);
  curve(enemyX - 30, 160, (enemyX - 10), 240, ((enemyX + 10) + random(-10, 30)), 300, ((enemyX - 50) + random(-10, 20)), 300);
  curve(enemyX - 30, 160, (enemyX - 10), 240, ((enemyX + 10) + random(-10, 30)), 300, ((enemyX - 30) + random(-10, 20)), 300);
  pop();

  push();
  stroke(255, 204, 100, 180);
  strokeWeight(1)
  curve(enemyX, 160, (enemyX + 10), 240, ((enemyX - 10) + random(-10, 50)), 300, ((enemyX + 50) + random(-10, 50)), 300);
  curve(enemyX, 160, (enemyX + 10), 240, ((enemyX - 10) + random(-10, 50)), 300, ((enemyX + 50) + random(-10, 50)), 300);
  curve(enemyX, 160, (enemyX + 10), 240, ((enemyX - 10) + random(-10, 50)), 300, ((enemyX + 50) + random(-10, 50)), 300);
  curve(enemyX, 160, (enemyX + 10), 240, ((enemyX - 10) + random(-10, 50)), 300, ((enemyX + 50) + random(-10, 50)), 300);
  curve(enemyX, 160, (enemyX + 10), 240, ((enemyX - 10) + random(-10, 50)), 300, ((enemyX + 50) + random(-10, 50)), 300);
  pop();

  push();
  stroke(255, 255, 255, 180);
  strokeWeight(1)
  curve(enemyX + 30, 190, (enemyX + 10), 240, ((enemyX - 10) + random(-10, 20)), 300, ((enemyX - 50) + random(-10, 20)), 300);
  curve(enemyX + 30, 190, (enemyX + 10), 240, ((enemyX - 10) + random(-10, 20)), 300, ((enemyX - 50) + random(-10, 20)), 300);
  curve(enemyX + 30, 190, (enemyX + 10), 240, ((enemyX - 10) + random(-10, 20)), 300, ((enemyX - 50) + random(-10, 20)), 300);
  curve(enemyX + 30, 190, (enemyX + 10), 240, ((enemyX - 10) + random(-10, 20)), 300, ((enemyX - 50) + random(-10, 20)), 300);
  curve(enemyX + 30, 190, (enemyX + 10), 240, ((enemyX - 10) + random(-10, 20)), 300, ((enemyX - 50) + random(-10, 20)), 300);

  stroke(0, 0, 80, 180)
  curve(enemyX - 30, 160, (enemyX - 10), 240, ((enemyX + 10) + random(-10, 30)), 300, ((enemyX - 30) + random(-10, 20)), 300);
  curve(enemyX - 30, 160, (enemyX - 10), 240, ((enemyX + 10) + random(-10, 30)), 300, ((enemyX - 30) + random(-10, 20)), 300);
  curve(enemyX - 30, 160, (enemyX - 10), 240, ((enemyX + 10) + random(-10, 30)), 300, ((enemyX - 30) + random(-10, 20)), 300);
  curve(enemyX - 30, 160, (enemyX - 10), 240, ((enemyX + 10) + random(-10, 30)), 300, ((enemyX - 50) + random(-10, 20)), 300);
  curve(enemyX - 30, 160, (enemyX - 10), 240, ((enemyX + 10) + random(-10, 30)), 300, ((enemyX - 30) + random(-10, 20)), 300);
  pop();

  //draw arm
  push();
  noFill();
  stroke(255);
  strokeWeight(4);
  line(enemyX, 233, (enemyX - 5), 200);
  pop();


  //draw face and body
  push();
  fill(0);
  stroke(255, 204, 100);
  strokeWeight(3);
  ellipse(enemyX + 5, 260, 25, 25)
  stroke(255);
  fill(255, 204, 100);
  strokeWeight(2)
  rect((enemyX - 10), 243, 30, 20, 6);
  strokeWeight(1.5);
  ellipse(enemyX, 233, 35, 40);
  ellipse((enemyX - 10), 193, 25, 30);
  pop();

  push();
  stroke(255);
  strokeWeight(4);
  fill(0);
  ellipse(enemyX, 233, 20, 20);
  pop();

  //draw gun
  push();
  fill(255, 0, 0)
  noStroke();
  rect(enemyX - 35, 240, 8, 15, 10);
  rect(enemyX - 50, 240, 18, 6);
  fill(255);
  rect(enemyX - 59, 241, 8.7, 3);
  pop();

  //draw eyes
  push();
  noStroke();
  fill(0);
  rect(enemyX - 20, 190, 20, 8, 30);
  pop();


  //draw eyeball
  push();
  fill(255, 0, 0, random(130, 255));
  noStroke();
  rect(enemyX - 17, 192, 5, 5, 30);
  rect(enemyX - 8, 192, 5, 5, 30);
  pop();


  //draw arms
  push();
  noFill();
  stroke(255);
  strokeWeight(4);
  line(enemyX, 233, (enemyX - 20), 260);
  line((enemyX - 20), 260, (enemyX - 30), 250)
  pop();