Lan Wei-Project-04-String-Art

my-sketch.js
In the project I tried to create the sence of space by creating layers of different properties. And by adding the balls on the strings, I attempt to create a dynamic feeling in the still graphic.

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

function draw() {
    //back lines
    for (var y1 = 0; y1 < height; y1 += 7){
        stroke(0, 0, 120);
        strokeWeight(0.1);
        line(0, y1, width, y1)
    }

    //draw the top-down curves
    x1 = 0;
    x2 = width;
    y2 = 0;
    for (var y1 = 0; y1 < height - 50; y1 += 10){
        x2 -= 20;
        stroke(150);
        strokeWeight(0.1);
        line(x1, y1, x2, y2);
    }

    //draw the first part of the curves
    x1 = 0;
    x2 = 0;
    y2 = height;
    for (var y1 = 0; y1 < height - 70; y1 += 10){
        x2 += 40;
        stroke(255);
        strokeWeight(0.3);
        line(x1, y1, x2, y2);
    }

    //draw the second part of the curves
    x2 = width;
    y2 = height - 50;
    for (var y1 = height - 70; y1 < height + 100; y1 += 10){
        y2 += 3;
        stroke(255);
        strokeWeight(0.5);
        line(x1, y1, x2, y2);
    }

    //balls
    fill(3, 168, 158);
    noStroke();
    ellipse(300, 215, 15, 15);

    //draw the red curves
    y1 = height;
    y2 = height;
    for (var x1 = 0; x1 < width; x1 += 10){
        y2 -= 20;
        stroke(150, 20, 0);
        strokeWeight(0.5);
        line(x1, y1, x2, y2);
    }

    //balls
    fill(3, 168, 158);
    noStroke();
    ellipse(120, 200, 50, 50);
    ellipse(30, 100, 30, 30);
    ellipse(310, 90, 60, 60);
    ellipse(420, 200, 100, 100);
}

Leave a Reply