Month: September 2021

Project 4: String Art

sketch

var dx1;
var dy1;
var dx2;
var dy2;
var numLines1 = 20;
var numLines2 = 20;
var numLines3 = 20;

function setup() {
    createCanvas(400, 300);
    background(220);
    line(100, 50, 300, 200); // top left triangle
    line(100, 50, 150, 250);
    dx1 = (100-100)/numLines1;
    dy1 = (50-50)/numLines1;
    dx2 = (300-150)/numLines1;
    dy2 = (250-200)/numLines1;
    line(350, 25, 200, 275); // top right triangle
    line(350, 25, 50, 125);
    dx3 = (350-350)/numLines2;
    dy3 = (25-25)/numLines2;
    dx4 = (200-50)/numLines2;
    dy4 = (275-125)/numLines2;
    line(100, 50, 50, 125); // connection lines
    line(350, 25, 300, 200);
    dx5 = (100-50)/numLines3;
    dy5 = (125-50)/numLines3;
    dx6 = (350-300)/numLines3;
    dy6 = (200-25)/numLines3;
}

function draw() {
    var x1 = 100; // top left triangle
    var y1 = 50;
    var x2 = 150;
    var y2 = 250;
    for (var i = 0; i <= numLines1; i += 1) {
        line(x1, y1, x2, y2);
        x1 += dx1;
        y1 -= dy1;
        x2 += dx2;
        y2 -= dy2;
    }
    var x3 = 350; // top right triangle
    var y3 = 25;
    var x4 = 50;
    var y4 = 125;
    for (var j = 0; j <= numLines2; j += 1) {
        line(x3, y3, x4, y4);
        x3 += dx3;
        y3 += dy3;
        x4 += dx4;
        y4 += dy4;
    }
    var x5 = 100;
    var y5 = 50;
    var x6 = 350;
    var y6 = 25;
    for (var k = 0; k <= numLines3; k += 1) {
        line(x5, y5, x6, y6);
        x5 -= dx5;
        y5 += dy5;
        x6 -= dx6;
        y6 += dy6;
    }
    noLoop();
}

I wanted to see if I could create something that resembled a stage without having a lot of shapes. I ultimately chose to focus on the floor and lights to create both the playing space and the audience that surrounds it.

LO 4: Sound Art

Luke Du Bois’s piece Pop Icon: Britney is a generative video with sound, meant to be displayed in a physical frame. It explores the definition of “icon” in relation to pop stars and the history of Catholicism. Du Bois strips away the instrumentals from her songs, leaving only her voice, which is then processed with the reverb from the famous San Vitale Basilica in Ravenna, Italy. Without this context, the audio sounds like an ephemeral, yet discordant wash of tones absent of any structure or tonality. Du Bois also emphasizes the extensive and relatively new use of Photoshop and Autotune that ruled Britney’s experience of music and fame.

LO 04: Sound Art

Weather Thingy by Adrien Kaeser is a sound controller that uses real-time climate-related data to produce sound art. The data is used to modify the settings of the various instruments included in the station. The station consists of three climate sensors: a rain gauge, a wind vane, and an anemometer. The data collected from the three sensors pops up to an interface that allows the user to use the information to generate sound. The device is made with various machines including the Arduino mega. The software that connects the various machines includes Arduino, C ++, and MIDI protocol. I admire the performance aspect of the piece, where the audience can experience the live process of sound generation. The machines are put together in a visually appealing way. Furthermore, openness to human control over the data implementation seems to add more creativity to the project. The artist’s design to compose music through programming, live data collection, and human interaction seems to uplift the artistic sensibility of the entire piece

.https://www.creativeapplications.net/sound/weather-thingy-real-time-climate-sound-controller/

Project 4: String Art

string art
var dx1;
var dy1;
var dx2;
var dy2;
var dx3;
var dy3;
var dx4;
var dy4;
var dx5;
var dy5; 
var dx6;
var dy6;
var dx7;
var dy7;
var dx8;
var dy8;
var dx9;
var dy9;
var dx10;
var dy10;
var lines = 120; //for the left & right strings 
var lines2 = 100; //for the top-> bottom & left -> right strings
var lines3 = 20; //for center strings

function setup() {
    createCanvas(400, 300);
    background(220);
   
    //left blue+green strings
    line(0, 0, 0, 300); //initial line
    line(0, 300, 400, 0); //ending line
    dx1 = (0-0)/lines;
    dy1 = (300-0)/lines;
    dx2 = (400-0)/lines;
    dy2 = (0-300)/lines;

    //right blue+red strings
    line(0, 300, 400, 0); //initial line
    line(400, 0, 400, 300); //ending line
    dx3 = 400/lines;
    dy3 = -300/lines;
    dx4 = 0/lines;
    dy4 = 300/lines;

    //top -> bottom strings 
    line(0, 0, 400, 0); //initial line
    line(0, 300, 400, 300); //ending line
    dx5 = 400/lines2;
    dy5 = 0/lines2;
    dx6 = 400/lines2;
    dy6 = 0/lines2;

    //left -> right strings 
    line(0, 0, 0, 300); //initial line
    line(400, 0, 400, 300); //ending line
    dx7 = 0/lines2;
    dy7 = 300/lines2;
    dx8 = 0/lines2;
    dy8 = 300/lines2;

    //center piece
    dx9 = 100/lines3;
    dy9 = 150/lines3;
    dx10 = 100/lines3;
    dy10 = 150/lines3;
    
}

function draw() {

    //left -> right strings initial points
    var x7 = 0;
    var y7 = 0;
    var x8 = 400;
    var y8 = 300;

    //draw left -> right strings 
    for (var i = 0; i <= lines2; i += 1) {
        stroke(255, 95, 90); //red
        line(x7, y7, x8, y8);
        x7 += dx7;
        y7 += dy7;
        x8 -= dx8;
        y8 -= dy8;
    }


    //top -> bottom strings initial points
    var x5 = 0;
    var y5 = 0;
    var x6 = 400;
    var y6 = 300;

    //draw top -> bottom strings 
    for (var i = 0; i <= lines2; i += 1) {
        stroke(255, 105, 0); //orange
        line(x5, y5, x6, y6);
        x5 += dx5;
        y5 += dy5;
        x6 -= dx6;
        y6 -= dy6;
    }

    //left blue+green strings initial points
    var x1 = 0; 
    var y1 = 0;
    var x2 = 0;
    var y2 = 300;

    //draw blue+green strings
    for (var i = 0; i <= lines; i+= 1) { 
        stroke(0, random(50, 160), random(100, 200)); //pick random color from green & blue
        line(x1, y1, x2, y2);
        x1 += dx1;
        y1 += dy1;
        x2 += dx2;
        y2 += dy2;
    }

    //right blue+red strings initial points
    var x3 = 0;
    var y3 = 300;
    var x4 = 400;
    var y4 = 0;

    //draw blue+red strings
    for (var i = 0; i <= lines; i+= 1) { 
        stroke(random(80, 150), 0, random(100, 200)); //pick random color from red & blue
        line(x3, y3, x4, y4);
        x3 += dx3;
        y3 += dy3;
        x4 += dx4;
        y4 += dy4;
    }

    //center piece initial points
    var x9 = 100;
    var y9 = 150;
    var x10 = 300;
    var y10 = 150;

    //draw center piece
    for (var i = 0; i <= lines3; i += 1) {
        stroke(225, 210, 225); //white
        line(x9, y9, x10, y10);
        x9 += dx9;
        y9 += dy9;
        x10 -= dx10;
        y10 -= dy10;

    }

    noLoop();
}

I found it a bit challenging to visualize the way the strings would work in my head, and so the drafting part was quite difficult. However, I really liked how the strings overlapping created dimension in the piece.

Project-05-Wallpaper

sketch

function setup() { 
  createCanvas(750, 450);
  angleMode(DEGREES);
  rectMode(CENTER);
} 

function draw() {
  background(200);
  //LOOP OF ENTIRE PATTERN
  push();
  noStroke();
  //fill(202,204,232);
  //rect(100,80,150,120);
  //fill(171,255,220);
  //rect(100,20,150,10);
  //rect(100,40,150,40);
  pop();


  fill("yellow");
  ellipse(80,100,85,60);
  triangle(35,55,65,55,50,30);
  triangle(45,55,75,55,70,30);
  ellipse(55,65,50,50);

  fill(255);
  ellipse(55,60,20,15);

  fill(0);
  ellipse(50,50,2,2);
  ellipse(60,50,2,2);
  ellipse(55,55,5,4);

  fill("brown");
  rect(50,100,300,10);

  fill('yellow');
  push()
  rotate(-10);
  ellipse(60,95,20,40);
  pop();
  push();
  rotate(10);
  ellipse(60,95,20,40);
  pop();
  ellipse(90,125,25,20);
  ellipse(115,125,25,20);

  fill("pink");
  rect(30,80,10,30);

  noFill();
  stroke(0);
  curve(30,100,25,60,15,40,10,100);
  
  fill("red");
  ellipse(17,37,10,10);

  fill(93,245,133);
  rect(90,80,10,30);

  fill(114,146,252);
  rect(100,75,10,40);

  fill(255,18,125);
  ellipse(150,40,30,20);
  triangle(165,40,175,30,175,50);

  fill(31,225,255);
  ellipse(120,60,30,20);
  triangle(135,60,145,70,145,50);

  fill(255,94,0);
  ellipse(150,80,30,20);
  triangle(165,80,175,90,175,70);
  //END OF ONE PATTERN
  ////////////////////////////////////////////////

  push();
  translate(150,0);
  fill("yellow");
  ellipse(80,100,85,60);
  triangle(35,55,65,55,50,30);
  triangle(45,55,75,55,70,30);
  ellipse(55,65,50,50);

  fill(255);
  ellipse(55,60,20,15);

  fill(0);
  ellipse(50,50,2,2);
  ellipse(60,50,2,2);
  ellipse(55,55,5,4);

  fill("brown");
  rect(50,100,300,10);

  fill('yellow');
  push()
  rotate(-10);
  ellipse(60,95,20,40);
  pop();
  push();
  rotate(10);
  ellipse(60,95,20,40);
  pop();
  ellipse(90,125,25,20);
  ellipse(115,125,25,20);

  fill("pink");
  rect(30,80,10,30);

  noFill();
  stroke(0);
  curve(30,100,25,60,15,40,10,100);
  
  fill("red");
  ellipse(17,37,10,10);

  fill(93,245,133);
  rect(90,80,10,30);

  fill(114,146,252);
  rect(100,75,10,40);

  fill(255,18,125);
  ellipse(150,40,30,20);
  triangle(165,40,175,30,175,50);

  fill(31,225,255);
  ellipse(120,60,30,20);
  triangle(135,60,145,70,145,50);

  fill(255,94,0);
  ellipse(150,80,30,20);
  triangle(165,80,175,90,175,70);
  pop();
  //END OF ONE PATTERN

  ////////////////////////////////////////////////

  push();
  translate(300,0);
  fill("yellow");
  ellipse(80,100,85,60);
  triangle(35,55,65,55,50,30);
  triangle(45,55,75,55,70,30);
  ellipse(55,65,50,50);

  fill(255);
  ellipse(55,60,20,15);

  fill(0);
  ellipse(50,50,2,2);
  ellipse(60,50,2,2);
  ellipse(55,55,5,4);

  fill("brown");
  rect(50,100,300,10);

  fill('yellow');
  push()
  rotate(-10);
  ellipse(60,95,20,40);
  pop();
  push();
  rotate(10);
  ellipse(60,95,20,40);
  pop();
  ellipse(90,125,25,20);
  ellipse(115,125,25,20);

  fill("pink");
  rect(30,80,10,30);

  noFill();
  stroke(0);
  curve(30,100,25,60,15,40,10,100);
  
  fill("red");
  ellipse(17,37,10,10);

  fill(93,245,133);
  rect(90,80,10,30);

  fill(114,146,252);
  rect(100,75,10,40);

  fill(255,18,125);
  ellipse(150,40,30,20);
  triangle(165,40,175,30,175,50);

  fill(31,225,255);
  ellipse(120,60,30,20);
  triangle(135,60,145,70,145,50);

  fill(255,94,0);
  ellipse(150,80,30,20);
  triangle(165,80,175,90,175,70);
  pop();
  //END OF ONE PATTERN

  ////////////////////////////////////////////////

  push();
  translate(450,0);
  fill("yellow");
  ellipse(80,100,85,60);
  triangle(35,55,65,55,50,30);
  triangle(45,55,75,55,70,30);
  ellipse(55,65,50,50);

  fill(255);
  ellipse(55,60,20,15);

  fill(0);
  ellipse(50,50,2,2);
  ellipse(60,50,2,2);
  ellipse(55,55,5,4);

  fill("brown");
  rect(50,100,300,10);

  fill('yellow');
  push()
  rotate(-10);
  ellipse(60,95,20,40);
  pop();
  push();
  rotate(10);
  ellipse(60,95,20,40);
  pop();
  ellipse(90,125,25,20);
  ellipse(115,125,25,20);

  fill("pink");
  rect(30,80,10,30);

  noFill();
  stroke(0);
  curve(30,100,25,60,15,40,10,100);
  
  fill("red");
  ellipse(17,37,10,10);

  fill(93,245,133);
  rect(90,80,10,30);

  fill(114,146,252);
  rect(100,75,10,40);

  fill(255,18,125);
  ellipse(150,40,30,20);
  triangle(165,40,175,30,175,50);

  fill(31,225,255);
  ellipse(120,60,30,20);
  triangle(135,60,145,70,145,50);

  fill(255,94,0);
  ellipse(150,80,30,20);
  triangle(165,80,175,90,175,70);
  pop();
  //END OF ONE PATTERN

  ////////////////////////////////////////////////

  push();
  translate(-150,0);
  fill("yellow");
  ellipse(80,100,85,60);
  triangle(35,55,65,55,50,30);
  triangle(45,55,75,55,70,30);
  ellipse(55,65,50,50);

  fill(255);
  ellipse(55,60,20,15);

  fill(0);
  ellipse(50,50,2,2);
  ellipse(60,50,2,2);
  ellipse(55,55,5,4);

  fill("brown");
  rect(50,100,300,10);

  fill('yellow');
  push()
  rotate(-10);
  ellipse(60,95,20,40);
  pop();
  push();
  rotate(10);
  ellipse(60,95,20,40);
  pop();
  ellipse(90,125,25,20);
  ellipse(115,125,25,20);

  fill("pink");
  rect(30,80,10,30);

  noFill();
  stroke(0);
  curve(30,100,25,60,15,40,10,100);
  
  fill("red");
  ellipse(17,37,10,10);

  fill(93,245,133);
  rect(90,80,10,30);

  fill(114,146,252);
  rect(100,75,10,40);

  fill(255,18,125);
  ellipse(150,40,30,20);
  triangle(165,40,175,30,175,50);

  fill(31,225,255);
  ellipse(120,60,30,20);
  triangle(135,60,145,70,145,50);

  fill(255,94,0);
  ellipse(150,80,30,20);
  triangle(165,80,175,90,175,70);
  pop();
  //END OF ONE PATTERN

  ////////////////////////////////////////////////

  push();
  translate(105,80);
  fill("yellow");
  ellipse(80,100,85,60);
  triangle(35,55,65,55,50,30);
  triangle(45,55,75,55,70,30);
  ellipse(55,65,50,50);

  fill(255);
  ellipse(55,60,20,15);

  fill(0);
  ellipse(50,50,2,2);
  ellipse(60,50,2,2);
  ellipse(55,55,5,4);

  fill("brown");
  rect(50,100,300,10);

  fill('yellow');
  push()
  rotate(-10);
  ellipse(60,95,20,40);
  pop();
  push();
  rotate(10);
  ellipse(60,95,20,40);
  pop();
  ellipse(90,125,25,20);
  ellipse(115,125,25,20);

  fill("pink");
  rect(30,80,10,30);

  noFill();
  stroke(0);
  curve(30,100,25,60,15,40,10,100);
  
  fill("red");
  ellipse(17,37,10,10);

  fill(93,245,133);
  rect(90,80,10,30);

  fill(114,146,252);
  rect(100,75,10,40);

  fill(255,18,125);
  ellipse(150,40,30,20);
  triangle(165,40,175,30,175,50);

  fill(31,225,255);
  ellipse(120,60,30,20);
  triangle(135,60,145,70,145,50);

  fill(255,94,0);
  ellipse(150,80,30,20);
  triangle(165,80,175,90,175,70);
  pop();
  //END OF ONE PATTERN

  ////////////////////////////////////////////////

  push();
  translate(255,80);
  fill("yellow");
  ellipse(80,100,85,60);
  triangle(35,55,65,55,50,30);
  triangle(45,55,75,55,70,30);
  ellipse(55,65,50,50);

  fill(255);
  ellipse(55,60,20,15);

  fill(0);
  ellipse(50,50,2,2);
  ellipse(60,50,2,2);
  ellipse(55,55,5,4);

  fill("brown");
  rect(50,100,300,10);

  fill('yellow');
  push()
  rotate(-10);
  ellipse(60,95,20,40);
  pop();
  push();
  rotate(10);
  ellipse(60,95,20,40);
  pop();
  ellipse(90,125,25,20);
  ellipse(115,125,25,20);

  fill("pink");
  rect(30,80,10,30);

  noFill();
  stroke(0);
  curve(30,100,25,60,15,40,10,100);
  
  fill("red");
  ellipse(17,37,10,10);

  fill(93,245,133);
  rect(90,80,10,30);

  fill(114,146,252);
  rect(100,75,10,40);

  fill(255,18,125);
  ellipse(150,40,30,20);
  triangle(165,40,175,30,175,50);

  fill(31,225,255);
  ellipse(120,60,30,20);
  triangle(135,60,145,70,145,50);

  fill(255,94,0);
  ellipse(150,80,30,20);
  triangle(165,80,175,90,175,70);
  pop();
  //END OF ONE PATTERN
  ////////////////////////////////////////////////

  push();
  translate(-45,80);
  fill("yellow");
  ellipse(80,100,85,60);
  triangle(35,55,65,55,50,30);
  triangle(45,55,75,55,70,30);
  ellipse(55,65,50,50);

  fill(255);
  ellipse(55,60,20,15);

  fill(0);
  ellipse(50,50,2,2);
  ellipse(60,50,2,2);
  ellipse(55,55,5,4);

  fill("brown");
  rect(50,100,300,10);

  fill('yellow');
  push()
  rotate(-10);
  ellipse(60,95,20,40);
  pop();
  push();
  rotate(10);
  ellipse(60,95,20,40);
  pop();
  ellipse(90,125,25,20);
  ellipse(115,125,25,20);

  fill("pink");
  rect(30,80,10,30);

  noFill();
  stroke(0);
  curve(30,100,25,60,15,40,10,100);
  
  fill("red");
  ellipse(17,37,10,10);

  fill(93,245,133);
  rect(90,80,10,30);

  fill(114,146,252);
  rect(100,75,10,40);

  fill(255,18,125);
  ellipse(150,40,30,20);
  triangle(165,40,175,30,175,50);

  fill(31,225,255);
  ellipse(120,60,30,20);
  triangle(135,60,145,70,145,50);

  fill(255,94,0);
  ellipse(150,80,30,20);
  triangle(165,80,175,90,175,70);
  pop();
  //END OF ONE PATTERN
  ////////////////////////////////////////////////

  push();
  translate(405,80);
  fill("yellow");
  ellipse(80,100,85,60);
  triangle(35,55,65,55,50,30);
  triangle(45,55,75,55,70,30);
  ellipse(55,65,50,50);

  fill(255);
  ellipse(55,60,20,15);

  fill(0);
  ellipse(50,50,2,2);
  ellipse(60,50,2,2);
  ellipse(55,55,5,4);

  fill("brown");
  rect(50,100,300,10);

  fill('yellow');
  push()
  rotate(-10);
  ellipse(60,95,20,40);
  pop();
  push();
  rotate(10);
  ellipse(60,95,20,40);
  pop();
  ellipse(90,125,25,20);
  ellipse(115,125,25,20);

  fill("pink");
  rect(30,80,10,30);

  noFill();
  stroke(0);
  curve(30,100,25,60,15,40,10,100);
  
  fill("red");
  ellipse(17,37,10,10);

  fill(93,245,133);
  rect(90,80,10,30);

  fill(114,146,252);
  rect(100,75,10,40);

  fill(255,18,125);
  ellipse(150,40,30,20);
  triangle(165,40,175,30,175,50);

  fill(31,225,255);
  ellipse(120,60,30,20);
  triangle(135,60,145,70,145,50);

  fill(255,94,0);
  ellipse(150,80,30,20);
  triangle(165,80,175,90,175,70);
  pop();
  //END OF ONE PATTERN




  ////////////////////////////////////////////////

  push();
  translate(-150,160);
  fill("yellow");
  ellipse(80,100,85,60);
  triangle(35,55,65,55,50,30);
  triangle(45,55,75,55,70,30);
  ellipse(55,65,50,50);

  fill(255);
  ellipse(55,60,20,15);

  fill(0);
  ellipse(50,50,2,2);
  ellipse(60,50,2,2);
  ellipse(55,55,5,4);

  fill("brown");
  rect(50,100,300,10);

  fill('yellow');
  push()
  rotate(-10);
  ellipse(60,95,20,40);
  pop();
  push();
  rotate(10);
  ellipse(60,95,20,40);
  pop();
  ellipse(90,125,25,20);
  ellipse(115,125,25,20);

  fill("pink");
  rect(30,80,10,30);

  noFill();
  stroke(0);
  curve(30,100,25,60,15,40,10,100);
  
  fill("red");
  ellipse(17,37,10,10);

  fill(93,245,133);
  rect(90,80,10,30);

  fill(114,146,252);
  rect(100,75,10,40);

  fill(255,18,125);
  ellipse(150,40,30,20);
  triangle(165,40,175,30,175,50);

  fill(31,225,255);
  ellipse(120,60,30,20);
  triangle(135,60,145,70,145,50);

  fill(255,94,0);
  ellipse(150,80,30,20);
  triangle(165,80,175,90,175,70);
  pop();
  //END OF ONE PATTERN


  ////////////////////////////////////////////////

  push();
  translate(0,160);
  fill("yellow");
  ellipse(80,100,85,60);
  triangle(35,55,65,55,50,30);
  triangle(45,55,75,55,70,30);
  ellipse(55,65,50,50);

  fill(255);
  ellipse(55,60,20,15);

  fill(0);
  ellipse(50,50,2,2);
  ellipse(60,50,2,2);
  ellipse(55,55,5,4);

  fill("brown");
  rect(50,100,300,10);

  fill('yellow');
  push()
  rotate(-10);
  ellipse(60,95,20,40);
  pop();
  push();
  rotate(10);
  ellipse(60,95,20,40);
  pop();
  ellipse(90,125,25,20);
  ellipse(115,125,25,20);

  fill("pink");
  rect(30,80,10,30);

  noFill();
  stroke(0);
  curve(30,100,25,60,15,40,10,100);
  
  fill("red");
  ellipse(17,37,10,10);

  fill(93,245,133);
  rect(90,80,10,30);

  fill(114,146,252);
  rect(100,75,10,40);

  fill(255,18,125);
  ellipse(150,40,30,20);
  triangle(165,40,175,30,175,50);

  fill(31,225,255);
  ellipse(120,60,30,20);
  triangle(135,60,145,70,145,50);

  fill(255,94,0);
  ellipse(150,80,30,20);
  triangle(165,80,175,90,175,70);
  pop();
  //END OF ONE PATTERN

  ////////////////////////////////////////////////

  push();
  translate(150,160);
  fill("yellow");
  ellipse(80,100,85,60);
  triangle(35,55,65,55,50,30);
  triangle(45,55,75,55,70,30);
  ellipse(55,65,50,50);

  fill(255);
  ellipse(55,60,20,15);

  fill(0);
  ellipse(50,50,2,2);
  ellipse(60,50,2,2);
  ellipse(55,55,5,4);

  fill("brown");
  rect(50,100,300,10);

  fill('yellow');
  push()
  rotate(-10);
  ellipse(60,95,20,40);
  pop();
  push();
  rotate(10);
  ellipse(60,95,20,40);
  pop();
  ellipse(90,125,25,20);
  ellipse(115,125,25,20);

  fill("pink");
  rect(30,80,10,30);

  noFill();
  stroke(0);
  curve(30,100,25,60,15,40,10,100);
  
  fill("red");
  ellipse(17,37,10,10);

  fill(93,245,133);
  rect(90,80,10,30);

  fill(114,146,252);
  rect(100,75,10,40);

  fill(255,18,125);
  ellipse(150,40,30,20);
  triangle(165,40,175,30,175,50);

  fill(31,225,255);
  ellipse(120,60,30,20);
  triangle(135,60,145,70,145,50);

  fill(255,94,0);
  ellipse(150,80,30,20);
  triangle(165,80,175,90,175,70);
  pop();
  //END OF ONE PATTERN

  ////////////////////////////////////////////////

  push();
  translate(300,160);
  fill("yellow");
  ellipse(80,100,85,60);
  triangle(35,55,65,55,50,30);
  triangle(45,55,75,55,70,30);
  ellipse(55,65,50,50);

  fill(255);
  ellipse(55,60,20,15);

  fill(0);
  ellipse(50,50,2,2);
  ellipse(60,50,2,2);
  ellipse(55,55,5,4);

  fill("brown");
  rect(50,100,300,10);

  fill('yellow');
  push()
  rotate(-10);
  ellipse(60,95,20,40);
  pop();
  push();
  rotate(10);
  ellipse(60,95,20,40);
  pop();
  ellipse(90,125,25,20);
  ellipse(115,125,25,20);

  fill("pink");
  rect(30,80,10,30);

  noFill();
  stroke(0);
  curve(30,100,25,60,15,40,10,100);
  
  fill("red");
  ellipse(17,37,10,10);

  fill(93,245,133);
  rect(90,80,10,30);

  fill(114,146,252);
  rect(100,75,10,40);

  fill(255,18,125);
  ellipse(150,40,30,20);
  triangle(165,40,175,30,175,50);

  fill(31,225,255);
  ellipse(120,60,30,20);
  triangle(135,60,145,70,145,50);

  fill(255,94,0);
  ellipse(150,80,30,20);
  triangle(165,80,175,90,175,70);
  pop();
  //END OF ONE PATTERN
  ////////////////////////////////////////////////

  push();
  translate(450,160);
  fill("yellow");
  ellipse(80,100,85,60);
  triangle(35,55,65,55,50,30);
  triangle(45,55,75,55,70,30);
  ellipse(55,65,50,50);

  fill(255);
  ellipse(55,60,20,15);

  fill(0);
  ellipse(50,50,2,2);
  ellipse(60,50,2,2);
  ellipse(55,55,5,4);

  fill("brown");
  rect(50,100,300,10);

  fill('yellow');
  push()
  rotate(-10);
  ellipse(60,95,20,40);
  pop();
  push();
  rotate(10);
  ellipse(60,95,20,40);
  pop();
  ellipse(90,125,25,20);
  ellipse(115,125,25,20);

  fill("pink");
  rect(30,80,10,30);

  noFill();
  stroke(0);
  curve(30,100,25,60,15,40,10,100);
  
  fill("red");
  ellipse(17,37,10,10);

  fill(93,245,133);
  rect(90,80,10,30);

  fill(114,146,252);
  rect(100,75,10,40);

  fill(255,18,125);
  ellipse(150,40,30,20);
  triangle(165,40,175,30,175,50);

  fill(31,225,255);
  ellipse(120,60,30,20);
  triangle(135,60,145,70,145,50);

  fill(255,94,0);
  ellipse(150,80,30,20);
  triangle(165,80,175,90,175,70);
  pop();
  //END OF ONE PATTERN






  }

Project-04-String-Art

sketch

var dx1;
var dy1;
var dx2;
var dy2;
var numLines = 50;

function setup() {
    createCanvas(400, 300);
    background(255, 243, 79);
}

function draw() {
//reference function
    for(var i = 0; i < 200; i ++){

        var x1 = 0;
        var x2 = i*width/25;
        var y1 = i*height/50;
        var y2 = height;

        strokeWeight (0.5); //set thickness of the line

        stroke(13, 66, 22); // right green center of the butterfly 
        line(200+x1,y1,x2+100, y2);

        stroke(13, 66, 22); // left green center of the butterfly
        line(400-(200+x1),y1,400-(x2+100), y2);


        stroke(138, 233, 255); // right blue center of the butterfly 
        line(200+x1,y1,x2+100, y2+50);

        stroke(138, 233, 255); // left green center of the butterfly
        line(400-(200+x1),y1,400-(x2+100), y2+50);



        stroke(209, 102, 255);
        line(350+x1,y1,x2+100, y2);

        stroke(209, 102, 255);
        line(400-(350+x1),y1,400-(x2+100),y2);

        stroke("magenta");
        line(x1,y1,x2,y2);

        stroke("magenta");
        line(x1,300-y1,x2,300-y2);

        stroke("magenta");
        line(400-x1,y1,400-x2,y2);

        stroke("magenta");
        line(400-x1,300-y1,400-x2,300-y2);

        var x1 = 0;
        var x2 = i*width/25;
        var y1 = i*height/70;
        var y2 = height;

        stroke("orange");
        line(x1,y2,x2,y1);

        stroke("orange");
        line(400-x1,y2,400-x2,y1);

    }
    noLoop();
}

Project 04: String Art

sketch

//Tim Nelson-Pyne
//tnelsonp
//Section C

//shape 1
var ax1;
var ay1;
var ax2;
var ay2;

//shape 2
var by1;
var bx1;
var by2;
var bx2;

//shape 3
var cy1;
var cx1;
var cy2;
var cx2;

var numLines = 2;
var angle = 0;

//controls green value
var g = 0;
var gMod = 0;

//controls blue value
var b = 0;
var bMod = 0;

function setup() {
    createCanvas(400, 300);
    background(0);
    
    //shape 1
    ax1 = (100)/numLines;
    ay1 = (0)/numLines;
    ax2 = (100)/numLines;
    ay2 = (0)/numLines;

    //shape 2
    bx1 = (0)/numLines;
    by1 = (0)/numLines;
    bx2 = (0)/numLines;
    by2 = (0)/numLines;

    //shape 3
    cx1 = (100)/numLines;
    cy1 = (0)/numLines;
    cx2 = (0)/numLines;
    cy2 = (0)/numLines;
    
}

function draw() {

    //if you hold down the mouse it makes the canvas rotate around your mouse position
    if (mouseIsPressed == true){
        translate(mouseX, mouseY);
        rotate(radians(angle));
        angle += 1;
    }
    

    //brings green levels up and down based on sin() graph
    //maped between zero and 255
    gMod += 0.01;
    g = sin(gMod);
    g = map(g, -1, 1, 0, 255);

    //brings blue levels up and down based on cos() graph
    //maped between zero and 255
    bMod += 0.01;
    b = cos(bMod);
    b = map(b, -1, 1, 0, 255);


    //set stroke color and weight
    stroke(255, g, b);
    strokeWeight(.25);

    var x1 = min(mouseX, width);
    var y1 = min(mouseY, 246);
    var x2 = 0;
    var y2 = 0;

    //shape 1
    for (var i = 0; i <= numLines; i += 1) {
        line(x1, y1, x2, y2);
        x1 += ax1;
        y1 += ay1;
        x2 += ax2;
        y2 += ay2;
    }


    //green to zero for shape 2
    g = 0;
    stroke(255, g, b);

    var x1 = width;
    var y1 = map(mouseY, 0, height, 250, height);
    var x2 = 0;
    var y2 = map(mouseY, 0, height, 250, height);

    //shape 2
    for (var i = 0; i <= numLines; i += 1) {
        line(x1, y1, x2, y2);
        x1 += bx1;
        y1 += by1;
        x2 += bx2;
        y2 += by2;
    }

    
    //set blue to zero for shape 3 and return green to sin() based value
    b = 0;
    g = sin(gMod);
    g = map(g, -1, 1, 0, 255);
    stroke(255, g, b);

    var x1 = min(mouseX, width);
    var y1 = constrain(mouseY, 150, 246);
    var x2 = width;
    var y2 = 150;

    //shape 3
    for (var i = 0; i <= numLines; i += 1) {
        line(x1, y1, x2, y2);
        x1 += cx1;
        y1 += cy1;
        x2 += cx2;
        y2 += cy2;
    }
    


}

I chose to make some interactive string art. Moving the cursor around changes the drawing and clicking and dragging changes it even more. I also decided to incorporate shifting colors to make the drawing change a bit more over time.

Looking Outwards: 04

ORGANVM PERCEPTVS

By Happy Valley Band

“Organvm Perceptvs” is an album by Happy Valley Band consisting of covers of pop classics. These songs are written by feeding the original songs into a custom built machine learning software that spits them back out in an altered re-written state. The band then plays the music that the software has regurgitated. I think this is a cool example of a collaboration between the AI and the human musicians. The AI doesn’t directly synthesize the sounds, but rather there is a level of human interpretation by playing the music that the AI writes. I also think that the output is wonderfully uncanny. The artificial intelligence remixes the music in a way that I doubt any person would think of doing, giving a complex and novel result. 

https://happyvalleyband.bandcamp.com/

LookingOutwards-04

A particular work that I find very interesting is Bishop Ivy’s performances. As a student at CMU, he combines his cs background with his career in music. He is able to create performances that are visually appealing that are controlled by the sound he was creating. In a sense, it was such a great experience watching him because it was so cool how the lights and images were adding to the meaning of the song. I am unsure how the artist does do this, but he does it well. Overall, I really enjoyed his performances.

Musical and Computational Inspiration

The mix of computer science and music is a combination that I love to no end. As both a musician and an avid computer science nerd, the idea that there are ways to combine these two concepts is amazing to me. There is one musical instrument that has always fascinated me. That would have to be the Theremin. Built by physicist Lev Sergeyevich Termen, the theremin is an instrument that does not need to be touched in order to create sound. The Theremin works by generating electromagnetic waves between two antennae. Kind of like a graph, the horizontal antenna controls volume while the vertical antenna controls pitch. I admire this instrument because of its originality and uniqueness. The sounds produced are heavily saturated computer-generated sounds that are like no other. When a musician is playing the Theremin, their hands move through space like they are dancing.

Theremin
Edward Sussman – Theremin