Month: September 2017

hamza

//hamza qureshi
//section e
//project 04
//hqq@andrew.cmu.edu

var x1;
var y1 = 1;
var x2 = 1;
var y2 = 1;
var yDes = 400;

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

function draw(){
    background(30); //dark gray background
    //create a single loop that sets the limits
    //within the x1 variable to allow the curves
    //to stretch horizontally
    for (var x1 = 0; x1 < 4*width; x1 += 5){
        strokeWeight(0.3);
        var y1 = x1 * 0.50;
        var yDev = height/4 + y1;
//outermost lines that are brightest in color
        stroke(180);
        line(x1*4, y1, x1-yDes, y2*0.5);
        line(x1*.10, height, x2, yDev);

//next ring
        stroke(130);
        line(x1*0.4, y1*0.6, x1-yDes, y2*0.5);
        line(x1*2, height*2, x2, yDev);

//next ring
        stroke(80);
        line(x1*0.4, y1, x1-yDes, y2*0.5);
        line(x1*.90, height, x2, yDev);

///next ring
        stroke(60);
        line(x1*0.3, y1, x1-yDes, y2*0.5);
        line(x1*1.7, height, x2, yDev);

//next ring
        stroke(50);
        line(x1*0.2, y1, x1-yDes, y2*0.5);
        line(x1*2.5, height, x2, yDev);

//final ring
        stroke(40);
        line(x1*0.1, y1, x1-yDes, y2*0.5);
        line(x1*3.2, height, x2, yDev);
    }
}

//voila!

For this piece of string art, I wanted to create a piece that used a tunneling effect to show depth. To do this, I used the for loop to change the size, orientation, and stroke color to make it appear as if the sections are getting deeper and deeper. After a few projects where the code became so long, I’m glad that this one uses a much more refined syntax.

sketch

//Elizabeth Wang
//elizabew
//Section E
//Project-04: String Art


// for (var VARNAME = STARTINGVALUE; VARNAME < LIMIT; VARNAME += INCREMENT) {
//     WHAT_TO_DO;
// }


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

}

function draw() {

  for (var x = 0; x <= 300; x += 10){ //looping lines with a spacing of 10 each time
    stroke(255);
    strokeWeight(.01);

    line(0, height - x, x * 1.5, 0); //upperleft

    line(width, x * 1.5, height - x, height); //lowerright

    line(0, x * 1.5, height/4 + x, height); //left side of eye

    line(height, height/20 + x, x * 1.5, 0); //right side of eye

    noStroke();
    fill(255);
    ellipse(180, 160, 80, 80);

  }



}

Reflection

At the beginning of the project, instead of coming up with an idea of what to make with lines, I wanted to practice getting used to using the for() function and seeing how it affects the shape and look of the lines. After a while, I felt that what I was beginning to form looked like an eye, and so I decided to work towards that as the goal of my project.

sketch

//Sun Min Kim 
//Section E
//sunmink@andrew.cmu.edu
//project04-stringart 

var x1 = 50; //x of line
var y1 = 0; //y of line 

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

function draw() {
    background(190, 100, 120);

    var r = acos(height, width); //rotating angle 

    for (var i = 0; i <800; i +=30) {
    	strokeWeight(1); 
    	rotate(r); 

    	stroke(191, 61, 80); //top red line 
    	line(400 , i / 8, i / 6, 2); 

    	stroke(191, 20, 130); //left pink line 
    	line(0, i / 3, i, 200);

    	stroke(130, 100, 140);
    	line(x1 + 250, y1, i/2 -300, 400); //left purple line 

    	stroke(255); 
    	line(x1 + 340, y1, i/2 -100, 400); //right white line 

    	stroke(245);
    	line(x1 - 100, width/2  , i - 300, 300); //bottom grey line 
    	
    	

    }

}

For this project, I started off with simple straight lines because I was not sure how function for () is going to act on this problem. However, as I gained confidence in using for (), I could build more layers of strings step by step. It was very interesting to create curves without curve vertex function and I look forward to learning many other ways to build similar result.