Dynamic Drawing

sketch

function setup() {
    createCanvas(480,640);
    background(0);
}

function draw() {
    var shapeWidth;
    shapeWidth = Math.abs(mouseX - 240) / 2 + 80;
    background(0);
    fill(255, mouseY / 2.5, 0);
    ellipse(240, 180, shapeWidth, 200);
    fill(0, 255, mouseY / 2.5);
    ellipse(120, 440, shapeWidth, 200);
    fill(mouseY / 2.5, 0, 255);
    ellipse(360, 440, shapeWidth, 200);
}

I drew three circles that change color and width based on the mouse position. First I drew the circles and changed the colors, and then I decided that wasn’t complicated enough. Now they look super cool!

Leave a Reply