Project 03 – Dynamic Drawing

For this project, I was inspired by abstract artist, Kandinsky. I took some of the components in composition 8, and made it more interactive.

sketchDownload
//Se A Kim
//Section D

function setup() {
    createCanvas(600, 450);
    background(236, 233, 230);

}

function draw() {
background(236, 233, 230); 

var bigCircle = constrain(pmouseX, 50, 200);
var midCircle = constrain(pmouseX, 50, 170);
var smallCircle = constrain(pmouseX, 50, 80);
var miniCircle = constrain(pmouseY, 0, 50);

var linex = constrain(pmouseX, 200, 500);
var liney = constrain(pmouseY, 100, 500);

//var leftTri = constrain(pmouseY, 100, 300);

noStroke();

//circle layers
fill(217, 167, 164, mouseY/2);
ellipse(100, 100, bigCircle);
fill(39, 26, 34);
ellipse(100, 100, midCircle);
fill(120, 65, 116, mouseY);
ellipse(100, 100, smallCircle);


frameRate(10);
stroke(3);
//double lines following mouse
line(mouseX, mouseY, pmouseX, pmouseY);
line(mouseX - 10, mouseY - 10, pmouseX -10, pmouseY - 10);

//lines

line(150, 300, linex, 300);
line(500, 430, 500, liney);
line(550, 430, linex, liney);
line(500, 10, linex + 40, liney + 40);
line(600, 0, linex - 80, liney - 80);


//arcs
stroke(1);
fill(255, 255, 255);
arc(200, 300, 80, 80, PI, 0);
arc(280, 300, 80, 80, PI, 0);
arc(360, 300, 80, 80, PI, 0);
arc(440, 300, 80, 80, PI, 0);

//large triangle
fill(244, 241, 242, mouseY/2);
triangle(300, 800 - pmouseY, 400, 300 - pmouseY, 500, 800 - pmouseY);


noStroke();
//multiple circles
fill(299, 197, 94, mouseY);
ellipse(100, 350, miniCircle);
fill(26, 104, 155, mouseY);
ellipse(230, 400, miniCircle);
ellipse(500, 300, miniCircle);
ellipse(450, 150, miniCircle);


}

Leave a Reply