Project 04: String Art

I had a lot of difficulty coming up with this project but I’m pretty happy with how it turned out. I wasn’t sure of the syntax of combining an if statement and a loop and it took a few tries to get it how it is. Instead of just drawing a crack when an area is clicked on, the crack gets darker and darker the more you click on it and eventually the window “breaks” to show an orange sunset color.

window

var dx1;
var dy1;
var dx2;
var dy2;
var dx3
var dx4
var dx5
var dx6
var numLines = 24 ////builds the cracks
var numLines2 = 12
var numLines3 = 36
var shatterCount = 0  ////keeps track of the clicks until the window breaks


function setup() {
    createCanvas(300, 400);
    dx1 = (120 - 110 )/numLines;
    dy1 = (80 - 80)/numLines;
    dx2 = (150 - 50)/numLines;
    dy2 = (200 - 200)/numLines
    dx3 = (240 - 220) /numLines2
    dx4 = (250 - 150)/numLines2
    dx5 = (170 - 160)/numLines3
    dy5 = (260 - 240)/numLines3
    dx6 = (250 - 150)/numLines3

}
function draw() {
    rectMode(CENTER)
    background(0)
    fill(237, 160, 17)  ////window info
    rect(width / 2, height / 2, 150, 300)
    line(width / 2, 50, width / 2, 350)
    line(75, height / 2, 225, height / 2)
    noLoop()
    line(110, 80, 120, 80)
    line(220, 140, 240, 160)
    line(160, 240, 170, 260)
   
            
}

function mousePressed() {
    var x1 = 110
    
    var y1 = 80
    var x2 = 75
    var y2 = 200
    var x3 = 220
    var y3 = 140
    var x4 = 150
    var y4 = 200
    var x5 = 160
    var y5 = 240
    var x6 = 150
    var y6 = 200
    var brokenx1 = random(0, width)
    var brokeny1 = random(0, height)
    var brokenx2 = random(0, width)
    var brokeny2 = random(0, height)
    print(shatterCount)
    
       if (mouseX <= width / 2 & mouseY <= height / 2) { 
        
        for (var s = 0; s <= numLines; s += 1) {
            line(x1, y1, x2, y2)
            x1 += dx1;
            y1 += dy1;
            x2 += dx2;
            y2 += dy2; ////first crack
            
        } shatterCount = shatterCount + 1
    }
       if (mouseX >= width / 2 & mouseY <= height / 2) {
        
       for (var s = 0; s <= numLines; s += 1) {
            line(x3, y3, x4, y4)
            x3 += dx3;
            x4 += dx4; ////second crack along the middle pane
            
            } shatterCount = shatterCount + 1
        }
        if (mouseX >= width / 2 & mouseY >= height / 2) {
            
            for (var s = 0; s <= numLines; s += 1) {
            line(x5, y5, x6, y6)
            x5 += dx5
            y5 += dy5
            x6 += dx6; ////bottom crack along the middle pane
            
           } shatterCount = shatterCount + 1
        }
        
        if (shatterCount >= 12) {
            fill(237, 160, 17) ////what to do after the window "breaks"
            rect(width / 2, height / 2, width, height)
                
    }
}

LO-04: Sound Art

One piece I found particularly interesting was Keiko Uenishi’s LandFilles. It is a structure made out of recyclables, with an “instrument” made out of used plastic bottles that Uenishi moves to interact with the piece. An algorithm (she doesn’t describe it) then interprets her movements as though the bottles were a tube or resonance chamber to create sound, while a separate person uses video cameras, lights, and monitors to change the environment of the instrument. It’s a great example of how to find uses for anything, and I find the concept of natural resonance extremely interesting. It was fascinating to see how to algorithm read Uenishi’s movements with the structure of bottles to create these hollow, airy sounds. It also had an interesting range and tone, between a lower brass instrument such as a french horn, and the upper limits of a flute, while also incorporating piano-like sound as well. The program involved most likely follows something such as a set of sensors throughout the bottles, or a mapping program which follows their movement, then models a chamber for sound that is then played through speakers. It presents Uenishi’s personal views of the environment as conservation-focused, as the entire structure is built from recycled materials, and the sounds coming from the instrument aren’t your typical beautiful notes. It produces eerie, unsettling pitches that I can only see as a commentary on our treatment of the environment.

http://soundleak.org/works/landfilles

A small section of the audiovisual performance

LO 4 Sound art

The Long player
The long player is a thousand year long “musical piece” created by composer and artist Jem Finer. It started playing on the midnight of the 31st of December 1999 and won’t repeat itself until 2999. The piece itself is in reality a re-interpretation of a source piece that is 20 minutes and 20 secs in length. After being reprocessed by a simple computer algorithm, the variations and combos can be played for a runtime of 1000 years. The algorithm is written in the SuperCollider language, and is actually itself written to plan for the eventual failure and obsoleteness of current technology. Thus, the music score itself was designed to be able to be played on any instrument with any technology. Finer, produced the piece after spending several years studying musical systems, however the piece itself presents an exploration on a far larger scale. With the piece lasting 1000 years, the piece is a reflection and exploration on the concept of time, scale, ephemerality and our traditional ideas about music. Although the score is predetermined, the exact way the piece will be played is a constant unknown for a human listening to it because of the vast scale it exists on. For finer, the piece is an exploration into the unknown, something that will capture the human imagination on a unfathomable level.

The LongPlayer

Looking Outwards 4

Project Name: Sorting

Created by Ren Yuan in 2018, Sorting attempts to transform data into an auditory system through various algorithmic methods of sorting the set. Yuan has created 7 different sorting algorithms, which allows the production of a different set of sounds each time even though the same data set could be run through each sorting system. The auditory and sorting output is also visualized through circular webs and shaded sectors that fluctuate depending on how the data is sorted, compared, swapped, and historically related to other data sets. Yuan describes 7 different algorithms that he uses to sort a data set: “insertion sort, shell sort, bubble sort, quick sort, selection sort, heap sort, [and] merge sort”. Each visual and auditory output created depends on the data inputted, the algorithm used, as well as the random initial condition that is created. However, Yuan does create an initial color palette and web base through the use of the aforementioned circular shape, which helps to define some visual boundaries in which the final piece is limited to.

Project 04 Line Art

The line art examples reminded me of space and warp patterns we would see in movies, so I decided to try to capture a sense of movement similar to a spaceship warp.

sketch
var dx1;
var dy1;
var dx2;
var dy2;
var tunnelW = 20;
var tunnelH = 20 ;
var xwall ;
var ywall;
var conNumLines = 20;
var numLines;
var x = 0;
var rb = 0;
var gb = 0;
var bb = 0;

function setup() {
    createCanvas(400, 400);
    background(200);
}
function draw(){
    var r = (random(0,255));
    var g = (random(0,255));

    numLines = random(15);
    xwall = max(dist(mouseX,0,0,0),dist(mouseX,0,width,0));
    ywall = max(dist(0,mouseY,0,0),dist(0,mouseY,0,height));
    //setupbackground
    background(rb,gb,bb);
    rb += random(0,1);
    gb += random(0,2);
    bb += random(0,2);
    if (rb>255 || gb>255 || bb>255){
        rb=0;
        gb=0;
        bb=0;
    }
    //setup end oof tunnel 
    rectMode(CENTER);
    noFill();
    push();
    translate(mouseX,mouseY);
    rect(0,0,tunnelW+x,tunnelH+x);
    x+=3;
    if ((tunnelW+x)> xwall || (tunnelH+x)> ywall) {
        x=0;
    }
    pop();
    fill(255);
    rect(mouseX,mouseY,2*tunnelW,2*tunnelH);
    
    //inner lines
    //top line
    line(mouseX-tunnelW,mouseY-tunnelH,mouseX+tunnelW,mouseY-tunnelH);
    //bottom line
    line(mouseX-tunnelW,mouseY+tunnelH,mouseX+tunnelW,mouseY+tunnelH);
    //left line
    line(mouseX-tunnelW,mouseY-tunnelH,mouseX-tunnelW,mouseY+tunnelH);
    //right line
    line(mouseX+tunnelW,mouseY-tunnelH,mouseX+tunnelW,mouseY+tunnelH);
    
    //outer lines 
    //top line
    line(0,0,width,0);
    //bottom line
    line(0,height,width,height);
    //left lin 
    line(0,0,0,height);
    //right lin
    line(width,0,width,height);

    //perspective line
    //top 
    dx1 = ((mouseX+tunnelW)-(mouseX-tunnelW))/numLines;
    dy1 = ((mouseY-tunnelH)-(mouseY-tunnelH))/numLines;
    dx2 = (width-0)/numLines;
    dy2 = (0-0)/numLines;
    stroke(r,g,0);
    strokeWeight(random(0.5,2));
    var topx1 = mouseX-tunnelW;
    var topy1 = mouseY-tunnelH;
    var topx2 = 0;
    var topy2 = 0;
    for (var i = 0; i <= numLines; i += 1) {
        line(topx1, topy1, topx2, topy2);
        topx1 += dx1;
        topy1 += dy1;
        topx2 += dx2;
        topy2 += dy2;
    }   
    //bottom 
    dx1 = ((mouseX+tunnelW)-(mouseX-tunnelW))/numLines;
    dy1 = ((mouseY+tunnelH)-(mouseY+tunnelH))/numLines;
    dx2 = (width-0)/numLines;
    dy2 = (height-height)/numLines;
    stroke(r,g,0);
    strokeWeight(random(0.5,2));
    var bottomx1 = mouseX-tunnelW;
    var bottomy1 = mouseY+tunnelH;
    var bottomx2 = 0;
    var bottomy2 = height;
    for (var i = 0; i <= numLines; i += 1) {
        line(bottomx1, bottomy1, bottomx2, bottomy2);
        bottomx1 += dx1;
        bottomy1 += dy1;
        bottomx2 += dx2;
        bottomy2 += dy2;
    }   
    //left 
    dx1 = ((mouseX-tunnelW)-(mouseX-tunnelW))/numLines;
    dy1 = ((mouseY+tunnelH)-(mouseY-tunnelH))/numLines;
    dx2 = (0-0)/numLines;
    dy2 = (height-0)/numLines;
    stroke(r,g,0);
    strokeWeight(random(0.5,2));
    var leftx1 = mouseX-tunnelW;
    var lefty1 = mouseY-tunnelH;
    var leftx2 = 0;
    var lefty2 = 0;
    for (var i = 0; i <= numLines; i += 1) {
        line(leftx1, lefty1, leftx2, lefty2);
        leftx1 += dx1;
        lefty1 += dy1;
        leftx2 += dx2;
        lefty2 += dy2;
    }   
    //right 
    dx1 = ((mouseX+tunnelW)-(mouseX+tunnelW))/numLines;
    dy1 = ((mouseY+tunnelH)-(mouseY-tunnelH))/numLines;
    dx2 = (width-width)/numLines;
    dy2 = (height-0)/numLines;
    stroke(r,g,0);
    strokeWeight(random(0.5,2));
    var rightx1 = mouseX+tunnelW;
    var righty1 = mouseY-tunnelH;
    var rightx2 = width;
    var righty2 = 0;
    for (var i = 0; i <= numLines; i += 1) {
        line(rightx1, righty1, rightx2, righty2);
        rightx1 += dx1;
        righty1 += dy1;
        rightx2 += dx2;
        righty2 += dy2;
    }   
    stroke(255);
    //side 1 
    dx1 = (width-0)/conNumLines;
    dy1 = (0-0)/conNumLines;
    dx2 = (0-0)/conNumLines;
    dy2 = (height-0)/conNumLines;
    strokeWeight(1);
    var sidex1 = 0;
    var sidey1 = 0;
    var sidex2 = 0;
    var sidey2 = height;
    for (var i = 0; i <= conNumLines; i += 1) {
        line(sidex1, sidey1, sidex2, sidey2);
        sidex1 += dx1;
        sidey1 += dy1;
        sidex2 -= dx2;
        sidey2 -= dy2;
    }
    //side 2
    dx1 = (width-0)/conNumLines;
    dy1 = (0-0)/conNumLines;
    dx2 = (width-width)/conNumLines;
    dy2 = (height-0)/conNumLines;
    strokeWeight(1);
    var sidex1 = 0;
    var sidey1 = 0;
    var sidex2 = width;
    var sidey2 = 0;
    for (var i = 0; i <= conNumLines; i += 1) {
        line(sidex1, sidey1, sidex2, sidey2);
        sidex1 += dx1;
        sidey1 += dy1;
        sidex2 += dx2;
        sidey2 += dy2;
    }
    //side 3
    dx1 = (width-width)/conNumLines;
    dy1 = (height-0)/conNumLines;
    dx2 = (width-0)/conNumLines;
    dy2 = (height-height)/conNumLines;
    strokeWeight(1);
    var sidex1 = width;
    var sidey1 = height;
    var sidex2 = 0;
    var sidey2 = height;
    for (var i = 0; i <= conNumLines; i += 1) {
        line(sidex1, sidey1, sidex2, sidey2);
        sidex1 -= dx1;
        sidey1 -= dy1;
        sidex2 += dx2;
        sidey2 += dy2;
    }
    //side 4
    dx1 = (width-0)/conNumLines;
    dy1 = (height-height)/conNumLines;
    dx2 = (0-0)/conNumLines;
    dy2 = (height-0)/conNumLines;
    strokeWeight(1);
    var sidex1 = width;
    var sidey1 = height;
    var sidex2 = 0;
    var sidey2 = height;
    for (var i = 0; i <= conNumLines; i += 1) {
        line(sidex1, sidey1, sidex2, sidey2);
        sidex1 -= dx1;
        sidey1 -= dy1;
        sidex2 += dx2;
        sidey2 -= dy2;
    }
}

Looking Outwards 04: Sound Art

The project that I chose to focus on was the Synth Play by Yuri Suzuki in collaboration with Raven, a Chinese tech company focused on developing operating systems using AI and new interactions. I chose this project because like all of Suzuki’s other works, it captured my attention by how he is able to make something as complex as music creating technology into something even a small child can use. I love the accessibility of understanding and interacting with his work since it lets everyone enjoy his installations, not just those with more knowledge in a specific area. The algorithms used to generate the work is similar to how a regular synthesizer works to create or modify music. However, by applying sensors to the inflatables, it makes the experience interactive. Suzuki’s artistic sensibilities manifest in the final outcome of this project since, like his previous works, he chose to focus on creating music and easy accessibility.

LO – 04

IM.PRINT by Demodern, is a very fascinating piece of artwork. Created in 2018, this audiovisual masterpiece starts with the tap of your finger. From there, you are taken into a world of your own, where you get to control the audio and visual with your own movements. When I first saw this I was visually entranced by it. It reminds me of virtual reality, which the artists tried very hard to recreate. They wanted you to truly feel immersed in what you create, and they did this with what they call an “Infinity Room”. The artpiece uses image processing when it scans your fingerprint and leap motion to give you control over the sound and colors, restoring to the original fingerprint upon stillness. Art is meant to be what you make it, if I wasn’t told this I don’t think I would’ve gotten as into it as I did. They truly demonstrate their understanding of art and how it is unique to every single person. By creating a space where artists can really express themselves, they help them tap into a world they can honestly call their own. To find out more information check out their website below (although I found that there vimeo gave a little more information, so I posted that link as well):

https://demodern.com/projects/im-print

https://vimeo.com/278485333

Looking Outwards : 4

Meandering Rivers premiered at Funkhaus, Berlin in July, 2018 and is an audiovisual installation that captures the natural forces that have actually shaped landscapes over time. The vibrant and dynamic textures show the unchanged nature with all the transformations going around in life. Based on a bespoke algorithm, the rippling and oscillating movement inherent in the generated imagery, provides a vantage point that transforms an understanding of progress, to examine the rhythm of natural forces.

The “Meandering River” is a multi-channel video with a set generative soundscape and the music has been composed by an A.I. (in collaboration with Kling Klang Klong) playing that shifts in tone when the river and surface patterns shift while this video is playing which further adds on movement through sonic sound and visuals. An interesting harmony is created through the installation creating an audio-visual journey and the the viewer is left with a humbling sense of the unpredictability of change and the beauty of nature.

Project 4 : String Art

sketch
//Aadya Bhartia
//Section A

var r = 250;
var g = 10;
var b = 140;
var bg = 80;
var change = 1;
var angle = 0;
function setup() {
    createCanvas(400, 300);
    background(200);
    text("p5.js vers 0.9.0 test.", 10, 15);
}

function draw() {
	background(bg);
	//contraining mouse within canvas
	var x = min(mouseX, width);
	var y = min(mouseY, height);
	//creating a mirror
	var mx = width - x;
	var my = height - y;
	for(var m = 0; m<=width; m+=15){ 
		stroke(170, 90, 100);
		//bottom left as a mirror image of the top right
		line(0,300 - m,400 - m,300);
		line(0,300 - m,400 - m/2,300);
		//top right 
		line(400,m,m,0);
		line(400,m,m/2,2);
		//creating 4 moveable string based on the mouse
		stroke(r+50, g+20, b+10);
		line(width-m,y, x,m);
		line(m,my, mx,300-m);
		line(width - m,my, x,300-m);
		line(m,y, mx,m);
	}
	//background shades as a gradient 
	bg = bg + change;
	if(bg>150){
		change = -change;
	}
	if (bg<=0) {
		change = -change;
	}
}

Sound Computational Art – “Sorting”

Eamonn Burke

My favorite hobby is drumming. As a drummer, a good sense of math is necessary for rhythm, but only at a basic level. However, being the CMU student that I am, I like to push the limits and find complex time signatures generated by complex algorithms. This is why I admire this project, “Sorting” because it’s taking a mathematical approach to sound and applies algorithms to it in an exploratory way. 

The software, Processing, uses data information and seven different algorithms to sort the data, visualize it, and convert it to sound. Beyond that it is honestly hard to tell exactly how the program works, but there seems to be a “ticker” that processes the numbers procedurally, creating radian ranges as it works and sorts the data into these radian ranges based on data information. 

The artistic sensibilities come across in the use of color and motion, which both serve to show how the data is being processed. The pairing of different sounds with the motion and color indicate what is happening, whether a confirmative ticking (with sparks) or a rejecting “thud” (with red flash).The varying line weights create a really beautiful and mesmerizing hierarchy of systems.