Month: September 2017

hqq – secE – LookingOutwards 04

“With my pictures, I create a musical space. With my music I create a pictorial space. Pictures and music are equivalent. They meet in the head of the beholder and the listener, and they reveal something new in him.” – Rolf Julius

Ash is an installation art piece by Rolf Julius that uses small particles of ash from German fireplaces to help create a medium to visualize soundwaves. Julius recorded a variety of everyday sounds at differing pitches to create a highly diverse soundscape that the piece uses to create imaging. The piece receives reverberations that are sustained within the terra cotta pots that make up the body of the unit. A small fabric drum within the piece holds ash that jumps and separates when vibrations from the sound are generated. This achieves a different image depending on what sounds are picked up.

Computationally, this piece uses an analog system to develop a top-down processing script and, although coding was not directly involved in the process, it uses a computationally-driven inherent logic that allows the image to differ between iterations.

The piece was created in 1991 and is still on display at the Mattress Factory in Pittsburgh, Pennsylvania.

ifv-project-04

sketch

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

function draw() {
  background(255,235,0);
     for (var i = 0; i < 70; i ++) {
       drawCurvedLines(i);
       //triangles made of lines
       line(210,200,i*3,300);
       line(210,200,150+i*3,0);
       line(210,200,400,150+i*3);
       line(i*3,0,i*3+2,);
       line(110,100,0,i*3);
       line(110,100,i*3,0);
     }

 }
function drawCurvedLines(count) {
 push();
 translate(200,200);
 rotate(radians(count*1));
 line(count*2+10, 0, count*3 + 10, 100);
 line(count*3+10,100,count*2+10,150);
 pop()
 push();
 translate(200,200);
 rotate(radians(count*2));
 line(count*2+10, 0, count*3 + 10, 100);
 line(count*3+10,100,count*2+10,150);
 pop()

 push();
 translate(100,100);
 rotate(radians(count*1));
 line(count*2+10, 0, count*3 + 10, 100);
 line(count*3+10,100,count*2+10,150);
 pop()
 push();
 translate(100,100);
 rotate(radians(count*2));
 line(count*2+10, 0, count*3 + 10, 100);
 line(count*3+10,100,count*2+10,150);
 pop()
 push();
 translate(100,100);
 rotate(radians(count*2+2));
 line(count*2+10, 0, count*3 + 10, 100);
 pop();
 push();
 translate(130,50);
 rotate(radians(count*2+2));
 line(count*2+10, 0, count*3 + 10, 100);
 pop();

 push();
 translate(400,0);
 rotate(radians(count*3));
 line(count*2+10, 0, count*3 + 10, 100);
 pop();

 push();
 translate(400,0);
 rotate(radians(count*2));
 line(count*2+10, 0, count*3 + 10, 100);
 pop();

 push();
 translate(400,0);
 rotate(radians(count*4));
 line(count*2+10, 0, count*3 + 10, 100);
 pop();

 push();
 translate(400,0);
 rotate(radians(count*5));
 line(count*2+10, 0, count*3 + 10, 100);
 pop();

 push();
 translate(400,0);
 rotate(radians(count*6));
 line(count*2+10, 0, count*3 + 10, 100);
 pop();

}

I just played around with curved and straight lines to create an abstract piece that has depth.

enwandu-LookingOutwards-04

‘Unnamed SoundSculpture’

Daniel Franke and Cedric Kiefer

‘Unnamed SoundSculpture’ is a computational design project operating at the intersection of sound, art, and technology. The sound sculpture is the result of recorded motion data of a real person. Laura Keil, a Berlin-based dancer, to interpret a musical piece – Kreukeltape by Machinefabriek – as closely as possible with the movement of her own body. She was recorded by three depth cameras (Kinect). The intersection of the images was later put together to a three-dimensional volume (3d point cloud), which was later put into 3D max for further rendering.  A three-dimensional scene was created including the camera movement controlled by the audio. Through this process, the digital body, consisting of 22,000 points, comes to life.

I couldn’t find much on the code or algorithms used in the creation of this project, but it doesn’t seem any custom-made software was needed for them to achieve their goals. With the sculpture based on the music and movement of the dancer, it captures the artistic sensibility of the performer. And the rendering of the 3D environment, and points making up the human form is truly evocative when in motion. I admire the emotional response of the project, in being able to capture an essence of performance, both with the music and the performer.

Project 04 – Yugyeong Lee

sketch

//Yugyeong Lee
//Section B
//yugyeonl@andrew.cmu.edu
//Project-04

var spacing;
var x;				//positionX
var y;				//positionY
var b;				//colorB	
var w;				//strokeWeight

function setup() {
    createCanvas(400, 300);
    x = 0;
    y = 0;
}

function draw() {
	//background color changes based on mouseX
	b = map(mouseX, 0, width, 0, 150);
	background(b);
    
    //spacing for each loop changes based on mouseX
    spacing = map(mouseX, 0, width, 10, 20);

    //the stroke weight changes based on mouseX
    w = map(mouseX, 0, width, .5, 1);
    strokeWeight(w);

    //the four corners
    for (i = 0; i < 50; i++) {
    	stroke(255, 200, 100+i*5);
    	line(x, y+i*spacing, x+i*1.5*spacing, height);
    	line(x, height-i*spacing, x+i*1.5*spacing, y);
    	stroke(255, 200, 255-i*5)
    	line(width, y+i*spacing, width-i*1.5*spacing, height);
    	line(width, height-i*spacing, width-i*1.5*spacing, y);
    }

    //the 'diamond'-like shape in the center 
    for (i = 0; i < 15; i++) {
    	stroke(255-i*2);
    	line(0, height/2, width, height/2);  //horizontal&vertical line
    	line(width/2, y+i*spacing, width/2+i*spacing, height/2);
    	line(width/2, y+i*spacing, width/2-i*spacing, height/2);
    	line(width/2, height-i*spacing, width/2-i*spacing, height/2);
    	line(width/2, height-i*spacing, width/2+i*spacing, height/2);
    }
}

I wanted to create an interactive string art. The string art created by four quadrants base its spacing size, stroke weight, and background color gradient on the position of mouseX.

eeryan-Project4-StringArt

sketch

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

function draw() {
  background(221,251,171);
  //curve 1
    startX = 400;
    stopX = 200;
    startY = 150;
    stopY = 0;
  for(var n = 0; n <20; n++){
    stroke(0);//black
    strokeWeight(1);
    line(startX, startY + 20,stopX - 20, stopY);
    startY += 20;
    stopX += 7;
  }
  
  //curve 2
    startX = 400;
    stopX = 0;
    startY = 250;
    stopY = 0;
  for(var n = 0; n < 20; n++){
    stroke(0,0,255);//blue
    strokeWeight(1);
    line(startX, startY - 20, stopX + 10, stopY);
    startX += 2;
    stopY += 20;
  }
  
  //curve 3
    startX = 0;
    stopX = 400;
    startY = 150;
    stopY = 0;
  for(var n = 0; n < 40; n++){
    stroke(200,118,165);//pink
    strokeWeight(2);
    line(startX, startY, stopX, stopY);
    startX += 10;
    stopY += 10;
  }
  //curve 4
    startX = 400;
    stopX = 200;
    startY = 150;
    stopY = 0;
  for(var n = 0; n <20; n++){
    stroke(255,0,0);//red
    line(startY + 20, startX,stopY, stopX - 20);
    startY += 20;
    stopX += 7;
  }
}

I used for loops with various add ons to create four different “curves”. I played around with adding mouse interaction but I didn’t think it looked cohesive when one or two of the curve’s moved along with the mouse. I chose a color palette that matched the modern feel of the assignment.

ljkim looking outward 04

I went to the California academy of sciences this summer in San Francisco. Its a fairly new museum with highly interactive exhibits.

One exhibit in particular was called the Color of Life. It allowed users to pluck a string of color, and a sound would emit. Through this interaction, guests could “hear” color and play a medley based on their mood. I admired this project because it allowed an intangible feeling of sound for color. I thought the interaction was especially memorable because it engages users to think beyond what a color normally is deemed as.

I suppose the algorithms used for it were simple, if a string is plucked, emit this sound.

dchikows – Section C – Project – 04 – String-Art

sketch

// David Chikowski
// Section C
// dchikows@andrew.cmu.edu
// Project-04 


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


    //top left line
    x1 = 0;
    y1 = height;
    x2 = 0;
    y2 = 0;
   
   //bottom right line 
    x3 = width
    y3 = height
    x4 = 0
    y4 = height

    //middle left line
    x5 = height
    y5 = width
    x6 = 0
    y6 = 0

    //middle right line
    x7 = height
    y7 = width
    x8 = 0
    y8 = 0

    //for loop for all lines 
    for (loop = 0 ; loop < 20 ; loop += 1) {

        //top left line
        stroke(255,0,0);
        line(x1, y1, x2, y2); 
        y1 -= height/10; 
        x2 += width/10; 

        //bottom right line 
        line(x3, y3, x4, y4);
        y3 -= height/10;
        x4 += width/10;

        //middle left line
        line(x5 -200, y5, x6, y6); //translates curve 200 points 
        y5 -= height/10;
        x6 += width/10;

        //middle right line
        line(x7 - 100, y7 + 150, x8, y8); //translates points 100 left, 150 down
        y7 -= height/10;
        x8 += width/10;




        
}


    
    }

I found this to be an interesting project to use for loops on. I believe it will be very useful in the future to use for loops for coding material similar to this since it can save a to of time.

ljkim_project 04 string art

sketch

/*Lois Kim
Section A
Project-04
*/

var x1 = 10;
var x2 = 200;
var y1 = 30;
var y2 = 400;

function setup() {
  createCanvas(400,300);
  background("#353334");
}

function draw() {
  for (var i = 0; i < 10; i++){
  noFill();
  stroke(299, 299 - i*20, 60);
  bezier (x1, y1, x2, y2, 90 + 500, 10 * i+ 200, 15+ 500, 80 * i + 100);
  } //yellow gradient curve
  
  for (var i = 0; i < 10; i++){
  noFill();
  stroke("#F4F4F4");
  bezier (x1 + 50, y1 + 40, x2 * 3, y2 * 2, 90, 10, 15, 80 * i + 50);
  } //white curves
  
  for (var i = 0; i < 10; i++){
  noFill();
  stroke("#1E4E87");
  bezier (40, 100, 225, 300, 90, 10, 500, 80 * i + 100);
  } //green curves
  
  for (var i = 0; i < 10; i++){
  noFill();
  stroke("#61BF25");
  bezier (x1 *20, y1 + 90, x2 * 4, y2 - 50, 700 * i + 100, 10, 500, 80 * i + 100);
  } //blue curves
  
  
  
}

I wanted color to be the focus of the curves. I also wanted to play around with different compositions. I ended up with this in the end

enwandu-Project-04-String Art

Sharingan

// Emmanuel Nwandu
// enwandu@andrew.cmu.edu
// Section D
// Project-04-String Art

var distribution = new Array(360);

function setup() {
    createCanvas(400, 300);
    for(i = 0; i < 275; i++){
        // Controls the properties of the line
        distribution[i] = floor(randomGaussian(350, 200));
    }
}

function draw() {
    background(0);

// Generates a set of random lines radiating from the center of the canvas
    push();
    translate(width/2, height/2);
    for(i = 0; i < 275; i++){
        rotate(TWO_PI/275);
        stroke(200, 0, 0);
        var dist = abs(distribution[i]);
        line(0, 0, dist, 0)
    }
    pop();

    var xBound = width;
    var yBound = height;
    var x = 0;
    var y2 = 0;

    strokeWeight(1)
    stroke(0); // Controls the color of the
// Generates lines which form an arc that moves diagonally
// across the canvas to each corner
// Similar geometry to the Mangekyou Sharigan
    for(i = 0; i < xBound; i +=10){
        var y = i * 3/4;
        line(x, y, i, yBound); //Lower left arc
        line(x, yBound -y, i, y2); // Upper Left arc
        line(xBound, y, xBound - i, yBound); // Lower Right arc
        line(i, y2, xBound, y); // Upper Right arc
    }

// Draws pupil
    fill(0);
    ellipse(200, 150, 75, 75);
}

This week, I was a bit unsure how to approach the assignment. I initially began coding random lines, to simply get a feel for what a happened when I manipulated certain parts of the code. This was extremely helpful, and while my code does not reflect all I wanted to achieve with this assignment, I learnt a lot by playing around with it a bit.

I drew inspiration from the Sasuke Uchiha’s Mangekyou Sharigan. It has been cropped, or zoomed in order to simplify it a bit. I had trouble coding the center petals of the floral pattern seen in his eye. It was a cool project though, definitely want to explore this more.

Inspiration. Initial thought.

 

ctv-looking outwards-04-Sound Art

Jerobeam Fenderson/2014

This person has built an algorithm to draw images using two channels of an oscilloscope. The two channels use addition and subtraction of analog waveforms to create the imagery. I love this piece because he takes a computational approach to render drawings. I would love to see this attached to an analog oscilloscope (one that uses a laser to illuminate phosphor powder). Within the past could years, I was exposed to the idea of creating interfering waves to control amplitude (I never took calculus). Since then, I have been fascinated with moiré patterns to create visually dynamic art and to control density of color value. This work relates because the artist is using the same principles to send interfering information to create something that is recognizable to humans. In this class, I would like to learn about generating analog wave forms from static imagery: the inverse of this artists’ work.