yunzhous-project-04-string art

sketch

var spacing = 5;

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

function draw() {
    background(0);
    //botton right corner
    for (i = 0; i < 100; i++){
        stroke(251, 201, 137);
        //limit mouseX
        if (mouseX < 100){
            mouseX = 100;
        }
        if (mouseX > 300){
            mouseX = 300;
        }
        map(mouseX, 0, width, 0, 30);
        line(0, height, mouseX * i, 5*i);
    }
    for (i = 0; i < 20; i++){
        map(mouseY, 0, height, 0, 20);
        //upper left corner
        //color gradient
        stroke(50, 200, mouseX);
        line(0, i * spacing * 5, width - i * spacing * 3, 0);
        //upper right corner
        stroke(255, 255 - i * 3, 255 - i *10);
        line(width - i * spacing, 0, width - i * spacing, height - i * spacing *5);
        //red lines
        //limit mouseY
        if (mouseY > 50){
            mouseY = 50;
        }
        stroke("red");
        line(width - i * mouseY, 0, i * spacing, height);
    }
    //background white lines
    for (i = 0; i < 50; i++) {
        stroke(255);
        line(width, height - i * spacing * 3, sq(i * spacing/6), height - i * spacing * 3);
    }
}

I played around with different variables, compositions, color gradient to create a visually harmonious image.

Leave a Reply