Category: Section C

Lrospigl – Looking Outwards – 04 (Bebot)

Bebot is robot synth. It is an iPhone app that allows you to control the effects and the scale, all while a little robot sings at you. While I really like the app, what interested me more is that it doesn’t have a limiting range. It really is up to the suer and how they take it. For example, this man tested the limits of Bebot to make an interesting and complicated song.

Since it’s a multitouch app, the writer of the code cannot assume how many fingers the user is actually going to use. In the video for example, the user here used up to 4 fingers at a time, something that the author took account for.

Official Apple App store bebot site .

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.

Looking Outward-04

For sound art, I found a project called The Classyfier. This project was created by Benedict Hubener, Stephanie Lee and Kelvyn Marte at the CIID.

The Classyfier is a table shaped speaker that detects what type of beverage people are drinking and plays a certain playlist according to the beverage. The speaker picks up on cue noises, such as the clinking of wine glasses or the popping open of a beer can.

I find this project inspiring because of the aspect of machine learning. The machine picks up on certain sound characteristics and compares it to a catalogue of sounds preprogrammed into it. From there, it is able to connect the suitable playlist and play the right music. In addition, the table has a feature where the user can knock on the tabletop to skip to the next song. This project connects very human understandings such as genres, mood, vibes, to a very robotic calculation. From a simple sound characteristic, a computer program is able to emulate the mood of drinking a relaxing glass of wine or cracking a cold beer with a pal.

Link

Lrospigl Project 04 line pattern

When I started with this project, I didn’t have a clear idea of what I wanted my image to look like. However, I did know I wanted the to be a play in line quantity that the user was able to have control over. I made it so that if you move your mouse to the top left corner of the canvas, you will see the darkest color possible, as well as the highest concentrations of lines. And if you move your mouse to the bottom right corner, you will see the least amount of lines, and the lightest/ least visible color.

sketch

//Laura Rospigliosi
//Section C
//lrospigl@andrew.cmu.edu
//Project-04-String art

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

function draw () {
  background (240);

var r = mouseX; 
var g = mouseY;
var x1 = width/2;
var y1 = height/2;
var x2 = width/5;
var y2 = height/5;
var spacing = 5;
strokeWeight (0.5);

//line sequence one
stroke (r, g, 150);
//top left quadrant `
  for (x = width/5; x < width/2 + 10; x += spacing) {
    line (x, y1, x2, y2);
  }
  for (y = height/5; y < height/2; y += spacing) {
    line (x1, y, x2, y2);
  }
  
//top right quadrant
  push ();
  scale (-1, 1);
  translate (-400, 0);
    for (x = width/5; x < width/2 + 10; x += spacing) {
    line (x, y1, x2, y2);
  }
  for (y = height/5; y < height/2; y += spacing) {
    line (x1, y, x2, y2);
  }
  pop();
  
//bottom left quadrant
  push ();
  scale (1, -1);
  translate (0, -300);
    for (x = width/5; x < width/2 + 10; x += spacing) {
    line (x, y1, x2, y2);
  }
  for (y = height/5; y < height/2; y += spacing) {
    line (x1, y, x2, y2);
  }
  pop();
  
//bottom right quadrant
  push ();
  scale (-1, -1);
  translate (-400, -300);
    for (x = width/5; x < width/2 + 10; x += spacing) {
    line (x, y1, x2, y2);
  }
  for (y = height/5; y < height/2; y += spacing) {
    line (x1, y, x2, y2);
  }
  pop();


//line sequence two
//top left quadrant
  for (x = 0; x < width/5; x += spacing) {
    line (x, y1, x2, y2);
  }
  for (y = 0; y < height/5; y += spacing) {
    line (x1, y, x2, y2);
  }
  
//top right quadrant
  push ();
  scale (-1, 1);
  translate (-400, 0);
  for (x = 0; x < width/5; x += spacing) {
    line (x, y1, x2, y2);
  }
  for (y = 0; y < height/5; y += spacing) {
    line (x1, y, x2, y2);
  }
  pop();
  
//bottom left quadrant
  push ();
  scale (1, -1);
  translate (0, -300);
  for (x = 0; x < width/5; x += spacing) {
    line (x, y1, x2, y2);
  }
  for (y = 0; y < height/5; y += spacing) {
    line (x1, y, x2, y2);
  }
  pop();
  
//bottom right quadrant
  push ();
  scale (-1, -1);
  translate (-400, -300);
  for (x = 0; x < width/5; x += spacing) {
    line (x, y1, x2, y2);
  }
  for (y = 0; y < height/5; y += spacing) {
    line (x1, y, x2, y2);
  }
  pop();

//curves
var c2 = height;
var c3 = width;
var c4 = height;
var spacing2 = map(mouseX, 0, width, 5, 15);

//curves
  noFill();
  stroke (0)
  strokeWeight (0.5);

  for (c1 = width/10; c1 < width*(2/3); c1 += spacing2) {
    curve (0, 0 ,0, 0, c1, c2, c3, c4);
    }

  push ();
  scale (1, -1);
  translate (0, -300)
    for (c1 = width/10; c1 < width*(2/3); c1 += spacing2) {
    curve (0, 0 ,0, 0, c1, c2, c3, c4);
    }
  pop();

  push ();
  scale (-1, 1);
  translate (-400, 0);
    for (c1 = width/10; c1 < width*(2/3); c1 += spacing2) {
    curve (0, 0 ,0, 0, c1, c2, c3, c4);
    }
  pop();
  
  push ();
  scale (-1, -1);
  translate (-400, -300);
    for (c1 = width/10; c1 < width*(2/3); c1 += spacing2) {
    curve (0, 0 ,0, 0, c1, c2, c3, c4);
    }
  pop();

}

jdbrown – Project 4: String Theo– I mean “Art”

Jdbrown-StringArt

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

function draw () {
        background (0);
        strokeWeight (1);
        fill (255);
        rect (10, 10, 580, 380);
        for (var i = 0; i < 60; i++) {
            drawMarker (i);
        }

}

function drawMarker (i) {

        push ();                    // Exterior wheel
        translate (200, 200);
        rotate (radians (i * 4));
        rotate (radians (i));
        line (150, 0, -200, -400);
        pop ();

        push ();                    // Exterior wheel (circle outline)
        translate (200, 200);
        rotate (radians (i * 1));
        fill (0);
        ellipse (150, 3, 5, 5);
        pop ();

        push ();
        translate (50, 200);       // weird mountain thing (main)
        rotate (radians (i /2));
        line (300, 0, 600, 400);
        pop ();

        push ();
        translate (50, 200);       // weird mountainthing (darker)
        rotate (radians (i /3));
        line (300, 0, 600, 400);
        pop ();

        push ();
        translate (50, 200);       // weird mountain thing (darkest)
        rotate (radians (i /5));
        line (300, 0, 600, 400);
        pop ();

        push ();                   // Inner wheel
        translate (200, 200);
        rotate (radians (i * 5));
        line (75, 0, 100, 400);
        pop ();

        push ();                    // Inner wheel (circle outline)
        translate (200, 200);
        rotate (radians (i * 3));
        fill (0);
        ellipse (75, 3, 5, 5);
        pop ();

        push ();
        translate (50, 200);       // weird mountain thing (small, main)
        rotate (radians (i));
        line (225, 0, 300, 200);
        pop ();

        push ();
        translate (50, 200);       // weird mountain thing (darker, main)
        rotate (radians (i / 2));
        line (225, 0, 300, 200);
        pop ();

        push ();
        translate (50, 200);       // weird mountain thing (darkest, main)
        rotate (radians (i / 4));
        line (225, 0, 300, 200);
        pop ();

        push ();                    // vision lines
        var c = 1;
        translate (200, 200);
        rotate (radians (i * 6));
        line (0, 0, mouseX / 2, mouseY);
        line (0, 0, mouseY / 10, mouseX / 4);
        stroke (255);
        line (0, 0, mouseY / 2, mouseX);
        pop ();

        var R = mouseX;
        var G = mouseY;
        var B = mouseX;

        fill (R, G, B);        // mountain eye (iris)
        ellipse (200, 200, 30, 30);
        fill (0);                  // mountain eye (pupil)
        ellipse (200, 200, 15, 15);
        fill (255);                // mountain eye (pupil)
        ellipse (195, 195, 5, 5);
}

For my String Art project, I was really inspired by the lecture this morning  (Friday, Sept. 22). I ended up making this weird all-seeing eye, spreading its illuminati dogma throughout the land. I like it, and you should to.

Josh

selinal-Project-String Art-04

My process for creating these visuals was first to cement a series of curves in a “random” line and balance that series with other curves series based on the location and spread of the first.

sketch

//Selina Lee
//Section C
//selinal@andrew.cmu.edu
//Project-04

function setup() {
    createCanvas(400, 300);
    background(250, 220, 130); //faint yellowish background
    
    noStroke();
    fill(200, 220, 170, 120); //greenish arced shadow on right lower corner
    ellipse(400, 320, 550, 400);

    for(var line1x = 0; line1x < width; line1x += 15) { //initial red series of curves with increments of 15
    	fill(200, 210, 110, 120); //greenish light color to fill curve shapes
    	stroke(250, 70, 20); // red line
    	curve(line1x, line1x, line1x * 10, 100, line1x * 2.5, 200, line1x * 2, height); 

    	curve(line1x - 15, height*1.5, line1x * 10 + 20, 220, line1x/2, 50, line1x * 2, 0);

    	curve(line1x/5, 0, -line1x, 0, line1x, 75, line1x + 50, 200);

    	curve(line1x, -100, -line1x/5, 100, line1x*10, 0, line1x + 50, 200);
    }
    
    for(var line2x = 6; line2x < width; line2x += 15) { //yellow series of curves with increments of 15 but starting more right
    	noFill();
    	stroke(250, 200, 0);
    	strokeWeight(2);
    	curve(line2x, line2x, line2x * 10, 100, line2x * 2.5, 200, line2x * 2, height*2); //thicker top set

    	strokeWeight(1);
    	curve(line2x - 15, height, line2x * 10 + 20, 220, line2x/2, 50, line2x * 2, 0);

    	strokeWeight(.5);
    	curve(line2x/5, 0, -line2x, 0, line2x, 75, line2x + 50, 200); //diminishing bottom sets that overlap with red series and green fills

    	curve(line2x, -100, -line2x/5, 100, line2x*10, 0, line2x + 50, 200);
    }

    for(var line3x = 0; line3x < width; line3x += 20) { //linear series with larger increments of 20
    	stroke(255, 180, 10);
    	strokeWeight(1.5);
    	line(line3x, height +20, line3x*2.3, 200 - line3x/15); //evened out yellow lines on bottom of canvas

    	line(line3x, height+20, line3x*1.8, 180 - line3x/15);

    	line(line3x, height + 20, line3x * 2, 190 - line3x/ 15);

    	fill(200, 50, 0, 150);
    	ellipse(line3x*2, 190 - line3x/15, 10, 10); //ellipse series of red circles

    }
    for(var circle4 = 220; circle4 < width; circle4 += 30) { //ellipse series from right half of canvas to balance out exponential series of red circles
    	fill(200, 50, 0, 150);
    	ellipse(circle4, 190 - circle4/15, 10, 10);
    	ellipse(circle4, 210 - circle4/25, 10, 10);
    }
    for(var line4y = 0; line4y < height; line4y += 15) { //vertical curve series to balance out horizontal strokes
    	fill(200, 100, 10, 50); // orange color with 50 percent transparency
    	curve(width, line4y, 250, line4y, 100, line4y, 0, height - line4y);
    }
}

function draw() {
}

selinal-LookingOutward-04

Bending the Arc by Jennifer Wen Ma

https://fluxprojects.squarespace.com/jennifer-wen-ma/

This sound art installation by Jennifer Wen Ma uses the combined voice frequencies of participants speaking into a microphone to raise the visual of the arc. What I admire about this project is the input of interaction in that more participation and louder singing/ speaking, etc. generate a collaborative effort to “raise the arc,” which allows audience members to reflect the action they are performing metaphorically. I was not able to find any explanations of the algorithms Ma used, but what I can assume from witnessing the piece and researching it is that the height of sound frequency is translated to the bending points in the curve drawn, which moves the line up and down.

Image result for bending the arc jennifer wen ma

Image result for bending the arc jennifer wen ma

serinal – project 4 (section C)

my string art isn’t super complex as I didn’t really have a vision of what I wanted it to look like when I started the project, except the fact that I wanted a light color background and a non-super contrasting (color-wise) end product. My favorite part is the little crosshatching component kind of in the background, I think it turned out quite nicely and holds the piece together well in a subtle way. I definitely could get some more getting use to with for loops!

sketch

//Serina Liu
//Section C
//serinal@andrew.cmu.edu
//project-04, string art

function setup() {
    createCanvas(400, 300);
    background (176, 196, 222);
    
var x = 3;
var y = 250; 

    for (var i = 0; i < 400; i += 4) {
        stroke(256, 256, 256);
        strokeWeight(2);
        line (x-3, y*i-7, 30*i, 300); //left curve
        var y = x * 0.5; //every time the y value is used, it is multiplying x by 0.5 
        stroke (255, 255, 0,90); 
        strokeWeight (1);
        line (x, y*i-50, 300 *i , 30); //background yellow curve
        stroke (256, 256, 256);
        strokeWeight (2);
        line (399, 3*i, 5*i, 1); //upper right curve
        strokeWeight (0.6);
        line (0, y*i, 2*i, 1); //crosshatching line
        strokeWeight (2);
        line (1, 5*i+90, 5*i, 299); // lower left curve
        line (6*i, 300, 400, height-5*i) // lower right curve

    }
}

abradbur-Looking Outwards-04

This is “Fall” by Robert Henke.

“Fall” by Robert Henke, 2016

This art piece was named after a village in Bavaria that was submerged under the waters of a reservoir in the 1950’s, which reemerged in 2015  when the reservoir water level fell. It is a series of suspended, extremely thin swatches of fabric, and the laserlights that play on them in different shapes, colors, and patterns. The cloth pattern itself was designed with an algorithm, and the sound aspect pulls from granulated bavarian music, water sounds, church bells, and other distortions. I love how haunting the backstory combined with the execution of this piece is. I always appreciate art that is a well researched tribute. In this piece, Fall is resurrected.

Here is the installation page on Henke’s website.

ablackbu-LookingOutwards-04

Specdrums

When I was home over Winter break last year a friend of mine was working on this project for kickstarter:

Specdrums

Specdrums is a drum machine and synthesizer that you wear like a ring on your finger. Depending on what color you tap with the device, a different drum sound will be produced. Your cell phone can synthesize different sounds and the device works on any surface. It can pick up the colors of your clothes so you can play body music.

What I admire about this project is how playful it is. A lot of new technology like this is very intimidating to use but this seems almost childish and fun.

I was lucky enough to see these guys working on this project and see the mechanisms on the inside of the test product.

Specdrums packaging