Charmaine Qiu – Project 04 – String Art

sketch

/* Charmaine Qiu
   charmaiq@andrew.cmu.edu
   Section E
   Project 04 String Art*/
var spacing = 10;
var gcolor = 34;
var bcolor  = 140;
function setup() {
    createCanvas(400, 300);
}

function draw() {
  //set background color and initial stroke color of center piece
    background(0, 13, 255);
    stroke(255, gcolor, bcolor);
  //the center piece that follows the mouse
    for(var i = 0; i < 30; i++){
  //changes color when moving between left and right side of canvas
      if(mouseX > width / 3){
        stroke(150, gcolor, bcolor);
      }
      if(mouseX > 2*width / 3){
        stroke(50, gcolor, bcolor);
      }
  //the center piece drawn with a spacing variable that sets distance between two lines
      line(mouseX, i * spacing, width, height / 2);
      line(0, height / 2, mouseX, i * spacing);
    }
  //line art that surrounds the opposite corners of canvas
    for(var i = 0; i < width; i += 10){
  //yellow lines
      stroke(218, 245, 66);
      line(i, 0, width, i / 2);
      line(0, i, i /2, width);
  //orange lines
      stroke(255, 162, 0);
      line(width, height - i, width - i, 0);
      line(0, i / 2, i, height);
    }


}

It was challenging to figure out how to efficiently create the lines on canvas. I tried to incorporate an interactive aspect towards my project, and it was fun to explore with. I now have a better understanding of how digital line art is created and the thought process behind it.