function setup() {
createCanvas(480, 640);
ellipseMode(CENTER);
}
function draw() {
background(0);
fill(255);
var m = max(min(mouseX, 640), 0); //mouse X min/max
var l = max(min(mouseY, 480),0); //mouse Y min/max
var sizeX = m * 350 / 400; //size of ellipses
var sizeY = l * 350 / 400; // size of ellipses
var colA = random(0,255);
var colB = random(0,255);
var colC = random(0,255); // all these create flashing black and white colors
var colD = random(0,255); //strobe light effect
var colE = random(0,255);
var colF = random(0,255);
//creates groups of flashing ellipses that strech and shrink with movements of the mouse
fill(colA);
ellipse(10+m*190/300, 300, sizeX, sizeX);
ellipse(30+m*80/460, 80+l*400 / 400, sizeX,sizeY);
fill(colB);
ellipse(200+m*50/200, 250,sizeX,sizeY);
ellipse(26+m*300/600, 70+l*400 / 500,sizeX,sizeX);
fill(colC);
ellipse(20+m*90 / 400, 280,sizeY,sizeX);
ellipse(30+m*40 / 400, 85+l*450 / 40,sizeX,sizeY);
fill(colE);
ellipse(200+m*90 / 400, 200, sizeX, sizeY);
ellipse(30+m*40 / 430, 80+l*45 / 400,sizeY,sizeX);
ellipse(30+m*40 / 400, 85+l*450 / 40,sizeX,sizeX);
fill(colE);
ellipse(100+m*75 / 400, 50, sizeY,sizeY);
ellipse(50+m*20 / 460, 550, sizeX,sizeY);
ellipse(30+m*40 / 400, 600, sizeY,sizeX);
fill(colF);
ellipse(20+m*90 / 400, 100,sizeY,sizeY);
ellipse(30+m*407 / 440, 65+l*350 / 400,sizeX,sizeY);
}
For this project I decided to make a dynamic drawing that stretches and shrinks a series of ellipses when the mouse is moved around the canvas. I was listening to music while I was coding it and it made me think that the shapes were almost dancing around on the screen 🙂