let x_coordinate = 0;

let y_coordinate = 0;

let rect_width = 0;

let rect_height = 0;

let color_count = 0;

let pop_sound;

​

function setup() {

  createCanvas(400, 400);

  frameRate(3); //ensuring slow fr

  background(255, 255, 255);

  pop_sound = loadSound("pop.mp3"); //loads the uplaoded sound 

}

​

function draw() {

  if (frameCount % 30 == 0) //everytime the framecount reaches 30

  {

    color_count++;

    if (color_count % 2 == 0) //alternate the background

    {

      background(255, 255, 255); //white

    }

    else

    {

      background(0, 0, 0); //black

    }

  }

  for (let i = 0; i < 2; i++) //needed 2 rectangles popping at once

    {

      strokeWeight(1);

      noFill();

      if (color_count % 2 == 0) //change the color of the rectangles

        {

          stroke(0, 0, 0);

        }

      else

        {

          stroke(255, 255, 255);

        }

      x_coordinate = (random(0, 401)) - 50; //random x coordinate but needed to make sure some start out of frame as well

      y_coordinate = random(0, 401);

      rect_width = 1.4 * random(10, 150); //1.4 is a random number but ensure the rectangles arent too small

      rect_height = 1.4 * random(10, 150);

      rect(x_coordinate, y_coordinate, rect_width, rect_height); //make triangle

      pop_sound.play();

    }

}