1. Modularity

• put each things into separate function
• deigning a function, calling it, and making a function modular

1. Reusability

• if you want to draw the same thing, you can use a function that does these twice

turn variables into object: key value/ name value pairs

✨make up your own function

function bounce() {
  if (ball.x > width || ball.x < 0) {
    ball.xspeed = ball.xspeed * -1;
  }

  if (ball.y > height || ball.y < 0) {
    ball.yspeed = ball.yspeed * -1;
  }
}

function display() {
  stroke(255);
  strokeWeight(4);
  fill(200, 0, 200);
  ellipse(ball.x, ball.y, 24, 24);
}

function move() {
  ball.x = ball.x + ball.xspeed;
  ball.y = ball.y + ball.yspeed;
}

//have to call out the function
function draw() {
  background(0);
  move();
  bounce();
  display();
}
//move, bounce, display aren't in the P5 library but you defined it below

Create a slider:

• 1 dimension mouse mapping
• low, upper bounds
• mousePressed + “slider”

can slide = true —> switch to make the room red