Category: Section E

mstropka-Project-11-E

sketch

function setup() {
    createCanvas(400, 400);
    background(0);
    strokeJoin(MITER);
    strokeCap(PROJECT);

}

function mousePressed(){

  drawturtles(mouseX, mouseY);

}

function drawturtles() {
  var t1 = makeTurtle(mouseX + 20, mouseY);
  var t2 = makeTurtle(mouseX - 20, mouseY);
  var t3 = makeTurtle(mouseX, mouseY + 20);
  var t4 = makeTurtle(mouseX, mouseY - 20);

  t1.penDown;
  t2.penDown;
  t3.penDown;
  t4.pendown;
  for(var i = 0; i < 480; i++){
    stroke(random(0,255),0,0);
    t1.forward(random(0,40));
    t1.right (random(0, 180));
    t1.forward (random(0,40));

    stroke(random(0,255), random(0,255), random(0,255));
    t2.forward(random(0,40));
    t2.right (random(0, 180));
    t2.forward (random(0,40));

    stroke(random(0,255), random(0,255), random(0,255));
    t3.forward(random(0,40));
    t3.right (random(0, 180));
    t3.forward (random(0,40));

    stroke(random(0,255), random(0,255), random(0,255));
    t3.forward(random(0,40));
    t3.right (random(0, 180));
    t3.forward (random(0,40));


  }
}
function draw() {
  }


  function turtleLeft(d){this.angle-=d;}function turtleRight(d){this.angle+=d;}
  function turtleForward(p){var rad=radians(this.angle);var newx=this.x+cos(rad)*p;
  var newy=this.y+sin(rad)*p;this.goto(newx,newy);}function turtleBack(p){
  this.forward(-p);}function turtlePenDown(){this.penIsDown=true;}
  function turtlePenUp(){this.penIsDown = false;}function turtleGoTo(x,y){
  if(this.penIsDown){stroke(this.color);strokeWeight(this.weight);
  line(this.x,this.y,x,y);}this.x = x;this.y = y;}function turtleDistTo(x,y){
  return sqrt(sq(this.x-x)+sq(this.y-y));}function turtleAngleTo(x,y){
  var absAngle=degrees(atan2(y-this.y,x-this.x));
  var angle=((absAngle-this.angle)+360)%360.0;return angle;}
  function turtleTurnToward(x,y,d){var angle = this.angleTo(x,y);if(angle< 180){
  this.angle+=d;}else{this.angle-=d;}}function turtleSetColor(c){this.color=c;}
  function turtleSetWeight(w){this.weight=w;}function turtleFace(angle){
  this.angle = angle;}function makeTurtle(tx,ty){var turtle={x:tx,y:ty,
  angle:0.0,penIsDown:true,color:color(128),weight:1,left:turtleLeft,
  right:turtleRight,forward:turtleForward, back:turtleBack,penDown:turtlePenDown,
  penUp:turtlePenUp,goto:turtleGoTo, angleto:turtleAngleTo,
  turnToward:turtleTurnToward,distanceTo:turtleDistTo, angleTo:turtleAngleTo,
  setColor:turtleSetColor, setWeight:turtleSetWeight,face:turtleFace};
  return turtle;}

For this week’s assignment, I made a program in which four turtles are drawn around the mouse when it is clicked. They move forward and right by random increments until they move off of the canvas.

LookingOutwards11-jooheek

The Classyfier – AI detects situation and appropriates music

Website: http://www.creativeapplications.net/processing/the-classyfier-ai-detects-situation-and-appropriates-music/

This project is called “The Classyfier”, a table that detects what beverages people are drinking around them, and chooses music that fits with that certain beverage. There is a microphone on the table that catches the characteristic sounds of the beverage, and goes through a pre-inputed list of songs that are categorized as hot beverages, wine, and beer. It goes through and chooses a song that fits your beverage, and you can choose the song in the certain category by knocking on the table. The objective of this project is to create a smart object that combines machine learning and natural sounds to create an ambience of different situations.

I thought this project was interesting because it uses computation to create a musical environment that is dependent on an object, in this case a beverage. The thought and idea of a computer analyzing what you are drinking and creating music that fits that drink is very innovative and clever. Now, you won’t have to go through all of your music to find the right music for your mood; you can just use “The Classyfier”.

ifv-LookingOutwards-11

 Ge Wang makes computer music aiming to use computers and phones to make new kinds of instruments. He created a computer music programming language called ChucK. Programs made with this language can be run with various interfaces. In the embedded TedTalk he showcases various instruments he has made. One example is a repurposed game controller that can be set to create a variety of noises (mostly futuristic/science fiction sounding) the other is a ‘wind’ instrument which is played by blowing into the phones microphone and can be altered by holding various buttons on the screen that mimic holes/buttons that would exist on a traditional instrument.

juyeonk-LookingOutwards-11

Title: The Classyfier

Artist: Benedict Hubener, Stephanie Lee, Kelvyn Marte, with the help of Andreas Refsgaard

Year of Creation: 2017

Link to the Article: http://www.creativeapplications.net/processing/the-classyfier-ai-detects-situation-and-appropriates-music/

The Classyfier is a machine that chooses an appropriate song that suits your mood. It does so by detecting the kind of beverages people are consuming by using the built-in microphone to catch the characteristic sounds and comparing it to the pre-trained examples (ex: clinking of the wine glasses or opening a can of beer), and the main programs used to create the algorithms were Wekinator, Processing and the OFX collection. The Classyfier will then “classify” the drinks into one of the three categories: hot beverages, wine, and beer, then it would start playing the music from the playlist that is designated to each category. The user could also knock on the table to navigate through the playlist.

It is interesting to me how machines could help us in social situations and help everything to go naturally with the flow when machines are generally expected to be a hindrance to interactions between people. It’s exciting to see how technology is getting more and more seamlessly integrated to our lives.

 

ifv-Project-11

sketch

//Isabelle Vincent
//Section E
//ifv@andrew.cmu.edu
//Project-11

function turtleLeft(d) {
    this.angle -= d;
}


function turtleRight(d) {
    this.angle += d;
}


function turtleForward(p) {
    var rad = radians(this.angle);
    var newx = this.x + cos(rad) * p;
    var newy = this.y + sin(rad) * p;
    this.goto(newx, newy);
}


function turtleBack(p) {
    this.forward(-p);
}


function turtlePenDown() {
    this.penIsDown = true;
}


function turtlePenUp() {
    this.penIsDown = false;
}


function turtleGoTo(x, y) {
    if (this.penIsDown) {
      stroke(this.color);
      strokeWeight(this.weight);
      line(this.x, this.y, x, y);
    }
    this.x = x;
    this.y = y;
}


function turtleDistTo(x, y) {
    return sqrt(sq(this.x - x) + sq(this.y - y));
}


function turtleAngleTo(x, y) {
    var absAngle = degrees(atan2(y - this.y, x - this.x));
    var angle = ((absAngle - this.angle) + 360) % 360.0;
    return angle;
}


function turtleTurnToward(x, y, d) {
    var angle = this.angleTo(x, y);
    if (angle < 180) {
        this.angle += d;
    } else {
        this.angle -= d;
    }
}


function turtleSetColor(c) {
    this.color = c;
}


function turtleSetWeight(w) {
    this.weight = w;
}


function turtleFace(angle) {
    this.angle = angle;
}


function makeTurtle(tx, ty) {
    var turtle = {x: tx, y: ty,
                  angle: 0.0,
                  penIsDown: true,
                  color: color(128),
                  weight: 1,
                  left: turtleLeft, right: turtleRight,
                  forward: turtleForward, back: turtleBack,
                  penDown: turtlePenDown, penUp: turtlePenUp,
                  goto: turtleGoTo, angleto: turtleAngleTo,
                  turnToward: turtleTurnToward,
                  distanceTo: turtleDistTo, angleTo: turtleAngleTo,
                  setColor: turtleSetColor, setWeight: turtleSetWeight,
                  face: turtleFace};
    return turtle;
}

function lines(t1){
  for(var j = 0; j<4;j++){
    t1.penDown();
    t1.forward(10);
    t1.left(180);
  }
}

function setup(){
  createCanvas(480,480);
}

function draw(){
  //inverse the stroke and bg colors
  var v = map(mouseY,0,height,0,255);
  var b = map(mouseY,height,0,0,255);
  background(v);
  var t1 = makeTurtle(mouseX,mouseY);
  t1.setColor(b);
  t1.setWeight(6);
  t1.penUp();
  //t1.forward(20);
  //t1.penDown();
  //t1.left(90);
  //t1.left(10);
  for(var i=0; i<1000; i++){
      t1.penUp();
      //go out from center
      var dist=(-(mouseY+mouseX)/2) +1 + i *1
      t1.forward(dist);
      //draw
      lines(t1);
      //come back
      t1.penUp();
      t1.left(180);
      t1.forward(dist);
      t1.left(180);

      //rotate by some angle
      t1.left(10);
  }
}

yoonyouk-project11-Composition

sketch

//Yoon Young Kim
//Section E
//yoonyouk@andrew.cmu.edu
//Assignment10-A


var turtle;



function setup() {
    var heartmeterangle = random(40, 70);
    var heartmeterlength = random(75, 150);
    createCanvas(480, 360);
    background(random(170, 255));
    frameRate(10);
    turtle = makeTurtle(0, height/2);
    turtle.penDown();
    turtle.setColor(0);
    turtle.setWeight(random(5, 20));


    for(i = 0; i < 8; i++) {

        //rainbow colors
        var r = random(50, 200);
        var g = random(50, 200);
        var b = random(50, 200);
      

        turtle.setColor(color(r, g, b));
        turtle.setWeight(50);


       // turtle.right(sqrt(sq(floor(mouseX - turtle.x))+sq(floor(mouseY-turtle.y))));
        //turtle.forward(floor(mouseX - turtle.x), floor(mouseY-turtle.y));

    turtle.penDown();
    turtle.left(heartmeterangle);
    turtle.forward(heartmeterlength);
    turtle.right(180-heartmeterangle);
    turtle.forward(2*heartmeterlength);
    turtle.left(180-heartmeterangle);
    turtle.forward(heartmeterlength);   
    turtle.right(120-heartmeterangle);

    }

}


function draw() {


}


function turtleLeft(d){this.angle-=d;}function turtleRight(d){this.angle+=d;}
function turtleForward(p){var rad=radians(this.angle);var newx=this.x+cos(rad)*p;
var newy=this.y+sin(rad)*p;this.goto(newx,newy);}function turtleBack(p){
this.forward(-p);}function turtlePenDown(){this.penIsDown=true;}
function turtlePenUp(){this.penIsDown = false;}function turtleGoTo(x,y){
if(this.penIsDown){stroke(this.color);strokeWeight(this.weight);
line(this.x,this.y,x,y);}this.x = x;this.y = y;}function turtleDistTo(x,y){
return sqrt(sq(this.x-x)+sq(this.y-y));}function turtleAngleTo(x,y){
var absAngle=degrees(atan2(y-this.y,x-this.x));
var angle=((absAngle-this.angle)+360)%360.0;return angle;}
function turtleTurnToward(x,y,d){var angle = this.angleTo(x,y);if(angle< 180){
this.angle+=d;}else{this.angle-=d;}}function turtleSetColor(c){this.color=c;}
function turtleSetWeight(w){this.weight=w;}function turtleFace(angle){
this.angle = angle;}function makeTurtle(tx,ty){var turtle={x:tx,y:ty,
angle:0.0,penIsDown:true,color:color(128),weight:1,left:turtleLeft,
right:turtleRight,forward:turtleForward, back:turtleBack,penDown:turtlePenDown,
penUp:turtlePenUp,goto:turtleGoTo, angleto:turtleAngleTo,
turnToward:turtleTurnToward,distanceTo:turtleDistTo, angleTo:turtleAngleTo,
setColor:turtleSetColor, setWeight:turtleSetWeight,face:turtleFace};
return turtle;}

For this turtle graphics project, I made a heart meter like graphic that changes whenever refreshed. A new turtle is drawn after each jump. When refreshed, the colors and positions and lengths change color as well. 

mecha-project11-composition

sketch

//sets up an empty arrays for turtles
var turtleArray = [];
var turtleArray2 = [];
var turtleArray3 = [];
var turtleMouse = [];
var turtleX;
var turtleY;
var x;
var y;

function setup() {
    createCanvas(480, 480);
    background(220);
}

function draw() {
    turtles();
    turtles2();
    turtles3();
}

//when mouse is pressed, new turtles are pushed into array
//(with same x and y values)
function mousePressed() {
    turtleX = 0;
    //allows for stair cases to be at every part of canvas
    turtleY = random(-height, height);
    turtleArray.push(makeTurtle(turtleX, turtleY));
    turtleArray2.push(makeTurtle(turtleX, turtleY));
    turtleArray3.push(makeTurtle(turtleX, turtleY));
}

function turtles() {
    //for every turtle in array, sets new color
    for (var i = 0; i < turtleArray.length; i++) {
        turtleArray[i].penDown();
        turtleArray[i].setColor(random(0, 255));
        turtleArray[i].setWeight(2);

        //will fill up canvas by creating staircase
        for (var j = 0; j <= 12; j++) {
            turtleArray[i].forward(width / 12);
            turtleArray[i].right(90);
            turtleArray[i].forward(width / 12);
            turtleArray[i].left(90);
        }

        turtleArray[i].penUp();
    }
}

function turtles2() {
    for (var i = 0; i < turtleArray.length; i++) {
        turtleArray2[i].penDown();
        turtleArray2[i].setColor(random(0, 255));
        turtleArray2[i].setWeight(2);

        for (var j = 0; j <= 24; j++) {
            turtleArray2[i].forward(width / 24);
            turtleArray2[i].right(90);
            turtleArray2[i].forward(width / 24);
            turtleArray2[i].left(90);
        }

        turtleArray[i].penUp();
    }
}

function turtles3() {
    for (var i = 0; i < turtleArray.length; i++) {
        turtleArray3[i].penDown();
        turtleArray3[i].setColor(random(0, 255));
        turtleArray3[i].setWeight(2);

        for (var j = 0; j <= 36; j++) {
            turtleArray3[i].forward(width / 36);
            turtleArray3[i].right(90);
            turtleArray3[i].forward(width / 36);
            turtleArray3[i].left(90);
        }

        turtleArray[i].penUp();
    }
}

function turtleLeft(d) {
    this.angle -= d;
}


function turtleRight(d) {
    this.angle += d;
}


function turtleForward(p) {
    var rad = radians(this.angle);
    var newx = this.x + cos(rad) * p;
    var newy = this.y + sin(rad) * p;
    this.goto(newx, newy);
}


function turtleBack(p) {
    this.forward(-p);
}


function turtlePenDown() {
    this.penIsDown = true;
}


function turtlePenUp() {
    this.penIsDown = false;
}


function turtleGoTo(x, y) {
    if (this.penIsDown) {
        stroke(this.color);
        strokeWeight(this.weight);
        line(this.x, this.y, x, y);
    }
    this.x = x;
    this.y = y;
}


function turtleDistTo(x, y) {
    return sqrt(sq(this.x - x) + sq(this.y - y));
}


function turtleAngleTo(x, y) {
    var absAngle = degrees(atan2(y - this.y, x - this.x));
    var angle = ((absAngle - this.angle) + 360) % 360.0;
    return angle;
}


function turtleTurnToward(x, y, d) {
    var angle = this.angleTo(x, y);
    if (angle < 180) {
        this.angle += d;
    } else {
        this.angle -= d;
    }
}


function turtleSetColor(c) {
    this.color = c;
}


function turtleSetWeight(w) {
    this.weight = w;
}


function turtleFace(angle) {
    this.angle = angle;
}


function makeTurtle(tx, ty) {
    var turtle = {
        x: tx,
        y: ty,
        angle: 0.0,
        penIsDown: true,
        color: color(128),
        weight: 1,
        left: turtleLeft,
        right: turtleRight,
        forward: turtleForward,
        back: turtleBack,
        penDown: turtlePenDown,
        penUp: turtlePenUp,
        goto: turtleGoTo,
        angleto: turtleAngleTo,
        turnToward: turtleTurnToward,
        distanceTo: turtleDistTo,
        angleTo: turtleAngleTo,
        setColor: turtleSetColor,
        setWeight: turtleSetWeight,
        face: turtleFace
    };
    return turtle;
}

For this assignment, I decided that I wanted to try and make an interesting pattern with my turtles. At first, I started with a basic staircase which generated at a random y value in between -480 and 480. Once I was able to figure out the code for that, I started to make new turtle arrays that ended up resembling a snowy mountain peak based on the color and the way that each of the lines intersected.

Every time a user clicks inside of the canvas, three turtles will generate with different color values.


sketch process


examples of turtle compositions

katieche-project 11

katieche-10

var t1;
var t2;
var t3;

function setup() {
    createCanvas(480, 480);
    background(250);

    // starts the turtle at a random location in the canvas
    t1 = makeTurtle(random(0, 480), random(0, 480));
    t2 = makeTurtle(random(0, 480), random(0, 480));
    t3 = makeTurtle(random(0, 480), random(0, 480));

    //puts pen down and sets colors and weight of each line
    t1.penDown();
    t1.setColor(color(190, 210, 240));
    t1.setWeight(3);
    t2.penDown();
    t2.setColor(color(200, 240, 210));
    t2.setWeight(3);
    t3.penDown();
    t3.setColor(color(250, 190, 210));
    t3.setWeight(3);
    frameRate(10);
}
 
function draw() {
    //starts making the turtle move
    t1.forward(10);
    t2.forward(10);
    t3.forward(10);
    //makes the turtle turn towards the mouse
    t1.turnToward(mouseX, mouseY, 10);
    t2.turnToward(mouseX, mouseY, 10);
    t3.turnToward(mouseX, mouseY, 10);

}

function turtleLeft(d){this.angle-=d;}function turtleRight(d){this.angle+=d;}
function turtleForward(p){var rad=radians(this.angle);var newx=this.x+cos(rad)*p;
var newy=this.y+sin(rad)*p;this.goto(newx,newy);}function turtleBack(p){
this.forward(-p);}function turtlePenDown(){this.penIsDown=true;}
function turtlePenUp(){this.penIsDown = false;}function turtleGoTo(x,y){
if(this.penIsDown){stroke(this.color);strokeWeight(this.weight);
line(this.x,this.y,x,y);}this.x = x;this.y = y;}function turtleDistTo(x,y){
return sqrt(sq(this.x-x)+sq(this.y-y));}function turtleAngleTo(x,y){
var absAngle=degrees(atan2(y-this.y,x-this.x));
var angle=((absAngle-this.angle)+360)%360.0;return angle;}
function turtleTurnToward(x,y,d){var angle = this.angleTo(x,y);if(angle< 180){
this.angle+=d;}else{this.angle-=d;}}function turtleSetColor(c){this.color=c;}
function turtleSetWeight(w){this.weight=w;}function turtleFace(angle){
this.angle = angle;}function makeTurtle(tx,ty){var turtle={x:tx,y:ty,
angle:0.0,penIsDown:true,color:color(128),weight:1,left:turtleLeft,
right:turtleRight,forward:turtleForward, back:turtleBack,penDown:turtlePenDown,
penUp:turtlePenUp,goto:turtleGoTo, angleto:turtleAngleTo,
turnToward:turtleTurnToward,distanceTo:turtleDistTo, angleTo:turtleAngleTo,
setColor:turtleSetColor, setWeight:turtleSetWeight,face:turtleFace};
return turtle;}

I just wanted to do something that reminded me of like things flying in the air, so I went with powerpuff girls colored lines that fly and do spins in the air. They fly following your mouse, and do circles in place when you mouse is not in motion.



adev_LookingOutwards11_SoundArt

Ryoji Ikeda, Supercodex

I chose to talk about Ryoji Ikeda’s live set performance, Supercodex. I had the opportunity of attending this performance in Pittsburgh about a year ago and it is still being performed internationally today. Witnessing this performance was absolutely incredible. This entire live experience takes place in a large, black cube-shaped room, and it is almost hypnotic.

Ryoji Ikeda is an electronic and visual artist and uses physical environments and mathematical notions to create live performances of his work in highly immersive environments.