function setup() {
createCanvas(640, 480);
}
function draw() {
// Changes the colours from Red to Blue when the mouse is moved horizontally.
colR= map(mouseX,220,width,220,180);
colG= map(mouseX,180,width,100,180);
colB= map(mouseX,190,width,100,255);
background(colR,colG,colB);
noStroke();
// Declares variables for height and width of shapes.
varOpp = width - mouseX;
var cH = 70;
var cW = 70;
// Changes the size when the mouse is moved horizontally.
var cH = map(mouseX,0,width,250,0);
fill(255,255,255);
ellipse(width/2,height/4,cW,cH);
fill(180,170,255);
rect(mouseX+200,height/3,cW,cH);
fill(255,170,255);
rect(mouseX,height/2,cW,cH);
fill(255,170,255);
rect(varOpp,height/2,cW,cH);
fill(180,170,255);
rect(varOpp-200,height/2,cW,cH);
fill(255,170,255);
rect(mouseX,height/4,cW,cH);
fill(255,170,255);
rect(varOpp,height/1.5,cW,cH);
}
I took inspiration from the first deliverables assignment, so I’d say what I came up with is pretty simple. What I want to work on for next time is adding more depth to the movement of graphics, since this is pretty 2-dimensional.