NOC – Week 1: p5 basics (Wentao)

For this assignment, I mostly focused on the function of mouse position and mouse pressed function.

When moving the mouse around the canvas, you can change the background color according to the position of the mouse.

When you click the mouse, a white ellipse will appear at the position of the mouse and will move around with the moving of the mouse.

When you press the mouse, the size, color, and transparency of the ellipse will change randomly. And when you stop pressing the mouse, the color will change back to white again.

 

let a, b;

function setup() {
  createCanvas(400, 400);
}

function draw() {
  background (mouseX*255/width,mouseY*255/height, 0, 12)
	noStroke();
  if (mouseIsPressed){
    a = random(10, 60);
    fill(random(0,255), random(150,255))
  }
  else {
    fill(255);
  }
  
  ellipse(mouseX, mouseY, a, b);
  
}

Leave a Reply