let myBubbles = [];

​

function setup() {

  createCanvas(800, 800);

  for (let i = 0; i < 52; i++) {

    for (let j = 0; j < 52; j++) {

      mySquares.push(new Squares());

    }

    myBubbles.push(new Bubble());

  }

}

​

function draw() {

  background(220);

  for (let i = 0; i < myBubbles.length; i++) {

    myBubbles[i].show();

    mySquares[i].show();

  }

}

class Bubble {

  constructor() {

    this.x = random(100);

    this.y = random(200);

    this.s = random(-3, 3);

    this.r = (20, 30);

  }

  show() {

    ellipse(this.x, this.y, this.r);

    this.x = this.x + this.s;

    this.y = this.y + this.s;

    if (this.x > width || this.x < 0) {

      this.s = this.s * -1;

​

    }

    if (this.y > height || this.y < 0) {

      this.s = this.s * -1

    }

  }

​

}

class Squares {

  constructor() {

    this.x = random(100);

    this.y = random(200);

    this.s = random(1, 3);

    this.r = (20, 30);

  }

  show() {

    fill(200, 200, 140, 50);

    noStroke();

    square(this.x, this.y, this.r);

    this.x = this.x - this.s;

    this.y = this.y - this.s;

    if (this.x > width || this.x < 0) {

      this.s = this.s * -1;

​

    }

    if (this.y > height || this.y < 0) {

      this.s = this.s * -1

    }

  }

}