BrandonHyun-FinalProject-SectionB

Website for actually trying the program online

 

 

 

code for Final Project

ZIP File for Final Project for 15104

The purpose of this project is to gain different interpretations about the current events by giving the users the opportunity to draw or write about the issues that are presented to them. The content that gets presented is related to current events and political status. Furthermore, I would like to develop this project so that this website can exist in the online world with different interpretations and with opinions that can reside and see different opinions visually. This would be an anonymous participation by the public so we can get honest reviews about the political atmosphere around us and what people are thinking about.

BrandonHyun-ProposalFinalProject12

So for my Final Project, I would like to create a website where the users can draw and write their thoughts about a particular word or a phrase on a blank canvas using a cursor. Once they are done they will be automatically be uploaded to a page where there is a collection of these drawings and writings so they can see what other people have drawn or wrote about the topic.

For the topics on the first page, I will select a topic that is broad enough so there could be different interpretations and opinions but I would also like to post something that is politically charged. People who participate will be anonymous so we can have an honest and open discussion board for the people to participate.

This work could be interpreted as a political artifact, but I would want to explore this prompt as a way for my self to see what people think about the world that is around them.

BrandonHyun-LookingOutwards12

Ken Okiishi is an artist who uses television projection to combine the aesthetics of painting and moving image all at one entire television screen.

According to ArtSpace Okiishi’s “series of paintings on flat-screen monitors, gesture/data, evolved from a routine museumgoing act: Okiishi admired a painting by Joan Mitchell at MoMA and tried to capture it on his iPhone. His sheer, streaky brushstrokes, which veil an equally glitchy mixture of VHS and digital recordings, remind you how much gets lost in translation from the wall to the cloud.”

His dialog between the new media which is, in this case, a tv monitor and the old Media which is the painting over the television screen is so captivating and interesting for me because it is a combination of the things that we are talking about in class.

Projection does not always have to be using projectors. Every electric device that we use in order to absorb information and imagery is what “projection” means to me. So, in this case, I think Okiishi is touching upon a good point because he uses television screens rather than projectors that uses light beams.

Ken Okiishi’s Website

Ken Okiishi at Reena Spaulings
GESTURE/DATA by Ken Okiishi

BrandonHyun-Project11

sketch

function setup() {
    createCanvas(400, 400);
    background(0);
    var turtle = makeTurtle(130, 80);
    turtle.penDown();
    turtle.setColor(255);
    for (var i = 0; i < 300; i++) {
        turtle.forward(150);
        turtle.right(141.5);
        turtle.forward(60);

        if (i % 20 === 0) {
            turtle.forward(70);
        }
    }
    noLoop();
}


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;}

I wanted to create this composition because it was interesting to see how these turtles change when I repeat the number of repetition of turtle movement.

BrandonHyun-LookingOutwards11

According to the

Stanford Laptop Orchestra, ” The Stanford Laptop Orchestra (SLOrk) is a large-scale, computer-mediated ensemble and classroom that explores cutting-edge technology in combination with conventional musical contexts – while radically transforming both. Founded in 2008 by director Ge Wang and students, faculty, and staff at Stanford University’s Center for Computer Research in Music and Acoustics (CCRMA), this unique ensemble comprises more than 20 laptops, human performers, controllers, and custom multi-channel speaker arrays designed to provide each computer meta-instrument with its own identity and presence. The orchestra fuses a powerful sea of sound with the immediacy of human music-making, capturing the irreplaceable energy of a live ensemble performance as well as its sonic intimacy and grandeur. At the same time, it leverages the computer’s precision, possibilities for new sounds, and potential for fantastical automation to provide a boundary-less sonic canvas on which to experiment, create, and perform music. ”
Ge Wang, the founder of Stanford Laptop Orchestra is giving a TED talk to the public on the DIY Orchestra of the future using computers and phone to create digital music.

They are becoming one of the first innovators and pioneers on this area and theyr are performing a lot.

Site for the Stanford Laptop Orchestra(SLOrk) 

BrandonHyun-Project-10

sketch

//Brandon Hyun
//bhyun1@andrew.cmu.edu
//15104 Section B
//Project 10


var terrainSpeed = 0.0005;
var terrainDetail = 0.005;

function setup() {
    createCanvas(480, 480);
    frameRate(10);

}

function draw() {
  moon();
  drawMountains1();
  drawMountains2();
  drawMountains3();
  drawMountains4();

}


function drawMountains1(){
  //noStroke();
  fill(118,54,38,20);
  beginShape();
  for (var x = 0; x < width; x++) {
      var t = (x * terrainDetail) + (millis() * terrainSpeed*0.5);
      var y = map(noise(t), 0,1, 0, height);
      vertex(x, y-15);
  }
  vertex(width,height);
  vertex(0,height);
  endShape();
}

function drawMountains2(){

  fill(225,54,38,30);
  beginShape();
  for (var x = 0; x < width; x++) {
      var t = (x * terrainDetail) + (millis() * terrainSpeed*0.5);
      var y = map(noise(t), 0,1, 0, height*1.2);
      vertex(x, y-15);
  }
  vertex(width,height);
  vertex(0,height);
  endShape();
}

function drawMountains3(){

  fill(245,54,38,30);
  beginShape();
  for (var x = 0; x < width; x++) {
      var t = (x * terrainDetail) + (millis() * terrainSpeed*0.5);
      var y = map(noise(t), 0,1, 0, height*1.35);
      vertex(x, y-15);
  }
  vertex(width,height);
  vertex(0,height);
  endShape();
}

function drawMountains4(){

  fill(255,54,38,30);
  beginShape();
  for (var x = 0; x < width; x++) {
      var t = (x * terrainDetail) + (millis() * terrainSpeed*0.5);
      var y = map(noise(t), 0,1, 0, height*1.6);
      vertex(x, y-15);
  }
  vertex(width,height);
  vertex(0,height);
  endShape();
}

function moon(){
  fill(105,105,105);
  ellipse(width/2,height/3,200,200);
}

I wanted to create an abstract landscape that creates continuous landscape and the contour lines create this 3-dimensional space. In order to create this feel, I increased the opaqueness of each mountain ranges and It has a surreal feel to it.

BrandonHyun-LookingOutwards10

Daily tous les jours is a company that creates interactive pieces in a public setting. Mouna Andraos who founded the company Daily tous les jours and she has a principal saying that “The design studio uses technology and storytelling to explore collaboration, the future of cities and the power of humans. They are best known for their work in public spaces, where passing crowds are invited to play a critical role in the transformation of their environment and their relationships. Their projects lie at the intersection of digital arts, performance and placemaking, utilizing contemporary tools that range from sensors, cameras, mobile phones and real-time data, to musical instruments, dance choreographies, writing, food and meditation.”

Her works are mostly presented in a public setting where all types of people can interact and bring positive change to the society that they present their work in.

One of their companies project was the Market Street Prototyping and it is shown in the Video.

Daily tous les jours website

Mouna Andraos bio

 

 

BrandonHyun-LookingOutwards-09

For this Weeks Looking Outwards, I am going to be looking at Scott Snibbe who is an Interactive Media Artist, researcher, and an entrepreneur. He is one of the First who works with projector based interactivity wall.

According to Scott Snibbes Website project ” Cause and Effect ” (2004) records viewers’ movements in silhouette as they simultaneously displace the recordings of previous viewers. When the movies re-play on sliding tiles, only the viewers’ movements are shown, giving a sense of autonomy to actions that were actually determined through interaction with the prior recordings. “Cause and effect” is a common translation for the Buddhist term Karma, which dictates that all human experiences, however minute, are the result of their own prior actions.

Since we have worked with projection and looked at artist that uses silhouette in Children’s museum, I think it was really interesting who originally used this type of method.

 

BrandonHyun-Project09

sketch

//Brandon Hyun
//Section B
//bhyun1@andrew.cmu.edu
//project09-PixelArt

var underlyingImage;

function preload() {
  //brings image from Imgur
    var ImageURL = "https://i.imgur.com/oSC8MC5.jpg";
    underlyingImage = loadImage(ImageURL);
}

function setup() {
    //creates canvas that fits the size of the picture
    createCanvas(778, 1219);
    background(0);
    underlyingImage.loadPixels();
    //draws the rectangles in certain speed
    frameRate(150);
}

function draw() {
    var px = random(width);
    var py = random(height);
    var ix = constrain(floor(px), 0, width-1);
    var iy = constrain(floor(py), 0, height-1);
    var theColorAtLocationXY = underlyingImage.get(ix, iy);

    noStroke();
    fill(theColorAtLocationXY);
    rect(px, py, 30, 70);



}

The portrait gets drawn onto the canvas is a rectangle that creates a mosaic of an image and the following image has the fast FrameRate that reveals the image quickly. I did not want the image to reveal so slowly since its hard for the viewers to view it. I also created the rectangles quite largely so the image can get revealed more quickly.

BrandonHyun-LookingOutwards-08

Heather Knight is a student who is currently conducting her doctoral research at Carnegie Mellon’s Robotics Institute and running Marilyn Monrobot Labs in NYC, which creates socially intelligent robot performances and sensor-based electronic art. She earned her bachelor and masters degrees at MIT in Electrical Engineering and Computer Science and has a minor in Mechanical Engineering. I’m inspired by her work because she creates robots that interact with human and also use robotic intelligence to create performances that are interesting.

Footnote on the Video: Heather Knight’s Ted talks with the Marilyn Monrobot which creates socially intelligent robot performances and sensor-based electronic art.

 

Her work also includes: robotics and instrumentation at NASA’s Jet Propulsion Laboratory, interactive installations with Syyn Labs, field applications and sensor design at Aldebaran Robotics, and she is an alumnus from the Personal Robots Group at the MIT Media Lab.

When she talks she talks very fluently and it was nice to see the actual robot interacting with the audience. I find that very powerful and a good way to present.