Author: yoonyouk@andrew.cmu.edu

yoonyouk-project02-variablefaces

yoonyouk-project02-variablefaces

//Yoon Young Kim
//Section E
//yoonyouk@andrew.cmu.edu
//Project-02

var eyeLxSize = 40;
var eyeRxSize = 20;
var faceWidth = 240;
var faceHeight = 200;

var nose1x = 300;
var nose1y = 250;
var nose2x = 350;
var nose2y = 250;
var nose3x = 325;
var nose3y = 285; 
var earpoint = 100;
var smileWidth = 25;
var smileHeight = 25;

//colors
var R1 = 232;
var R2 = 64;
var B1 = 33;
var B2 = 91;
var B3 = 237;
var Ye1 = 323;
var Ye2 = 204;
var Ye3 = 74;

var RW = 4 //weight of any red line


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

function draw() {
    background (B1, B2, B3);
    
    //face
    noStroke();
    fill(Ye1, Ye2, Ye3);
    ellipse (width/2, height/2 - 10, faceWidth, faceHeight)
   
    //eyes
    stroke(R1, R2, R2);
    strokeWeight(RW);
    noFill();
    var eyeLX = width / 2 - faceWidth * 0.25;
    var eyeRX = width / 2 + faceWidth * 0.25;
    ellipse(eyeLX, height / 2, eyeLxSize, eyeLxSize);
    ellipse(eyeRX, height / 2, eyeRxSize, eyeRxSize);
    
    //triangle nose
    noStroke();
    fill(R1, R2, R2);
    triangle(nose1x, nose1y, nose2x, nose1y, nose3x, nose3y);

    //ears
    //left ear
    fill(Ye1, Ye2, Ye3);
    triangle(220, 190, 225, earpoint, 310, 150);


    //right ear
    triangle(420, 190, 420, earpoint, 340, 150);

    //mouth
    stroke(R1, R2, R2);
    strokeWeight(RW);
    noFill();
    arc(width / 2, height / 2 + faceWidth * 0.20, smileWidth, smileHeight, 0, 180);
}

function mousePressed() {
    faceWidth = random(200, 300);
    faceHeight = random(200, 275);
    eyeLxSize = random(20, 80);
    eyeRxSize = random(30, 60);
    R1 = random(200, 250);
    R2 = random(50, 100);
    B1 = random(20, 70);
    B2 = random(90 ,140);
    B3 = random(200, 250);
    Ye1 = random(300, 350);
    Ye2 = random(180, 230);
    Ye3 = random(50, 100);
    RW = random(7, 15);
    smileWidth = random(40, 80);
    smileHeight = random(20, 50);
    nose1x = random(270, 300);
    nose1y = random(240, 260);
    nose2x = random(320, 350);
    nose3x = random(300, 325);
    nose3y = random(270, 285); 
    earpoint = random(50, 120);
}

 

Much like the first project, I felt that this project required a lot of playing around and trial and error. I wanted to use primary colors in order to range the different color values to evict a childish type of project. In order to experiment with different shapes, I decided to go with a cat face. I like how each image generates a new combination/a new cat face upon each click.

yoonyouk-LookingOutwards-02

http://www.memo.tv/pattern-recognition/

This project is Memo Akten’s “Pattern Recognition,” created in collaboration with choreographer Alexander Whitley.

This generative art project involves a series of lights learning and observing how two dancers move and interact. The lights thus move accordingly to the dancers’ movements and placement within the space.

I appreciated how much the light is fully integrated with the dance art form. Rather than merely being a light show that would provide an aesthetic value to the performance, the lights serves a cognitive purpose for it assists dancers with recognition and learning with routines and dance. This project made me realize that generative art is not limited to media art but also performance art and music. Like most generative art, the outcome depends on the interactions and so the outcomes always seem to be unique.

The algorithm of Pattern Recognition relies heavily upon the movement and the space of the subjects: the dancers. The artist made the decision to use strong, harsh strobe lights that would beam lights across a stage. I thought this artistic decision was appropriate as a generative component since the light would be empathetic to the dancer’s form and movements.

yoonyouk-project01-face


yoonyouk-project01-face

//Yoon Young Kim 
//Section E
//Yoonyouk@andrew.cmu.edu
//Project-01

function setup() {
    createCanvas(500, 500);
    background(255, 204, 204);
    angleMode(DEGREES);


    //background strip
    noStroke();
    fill(153, 204, 255);
    rect(0, 125, 600, 225);

    //shoulder
    noStroke();
    fill(255, 153, 153);
    ellipseMode(CENTER);
    arc(230, 500, 150, 325, 180, 0);


   //headshape
    noStroke();
    fill(255, 229, 204);
    ellipseMode(CENTER);
    ellipse(200, 250, 200, 210);
    

    //nose
    noStroke();
    fill(255, 229, 204);
    triangle(110, 230, 115, 300, 85, 300);

    //eye
    noStroke();
    fill(256);
    ellipseMode(CENTER);
    ellipse(135, 248, 25, 25);

    //pupil
    noStroke();
    fill(102, 51, 0);
    ellipseMode(CENTER);
    ellipse(128, 253, 10, 10);

    //hair
    noStroke();
    fill(153, 76, 0);
    ellipseMode(CENTER);
    arc(210, 235, 220, 230, 200, 60, PIE);

    //ponytail
    noStroke();
    fill(153, 76, 0);
    ellipseMode(CENTER);
    arc(320, 235, 100, 230, 195, 90, PIE);    

    //eyebrow
    stroke(153, 76, 0);
    strokeWeight(3);
    noFill();
    arc(135, 228, 40, 25, 270, 360);

    //smile
    stroke(255, 153, 153);
    strokeWeight(5);
    noFill();
    arc(127, 300, 50, 50, 15, 90);


    //glasses
    stroke(120);
    strokeWeight(6);
    noFill();
    ellipseMode(CENTER);
    ellipse(125, 250, 25, 40);


    stroke(120);
    strokeWeight(6);
    noFill();
    arc(138, 263, 190, 30, 270, 360);

    stroke(120);
    strokeWeight(6);
    noFill();
    arc(100, 250, 30, 13, 270, 360);

    //ear
    noStroke();
    fill(255, 204, 153);
    arc(220, 265, 30, 40, 250, 90, CHORD);




}

function draw() {
}

 

yoonyouk-LookingOutwards-01

Official BMO200 Fountain site

Blog post about the work

Example of one of the BMO200 fountains. 

This project is the BMO200 Fountain, a creation that celebrates the 200th anniversary of BMO, a bank in Montreal.

The creative director of this project is Jess Willis of Mosaic. This project involved not only people of the design firm and the production company, but also members and employees under BMO. BMO’s CMO, Connie Stefankiewicz. Jennifer Marman and Daniel Borins were also artists involved with the project.

In order to celebrate BMO’s bicentennial anniversary, the company wanted to grant wishes to their customers through an interactive installation. Thus, the idea for the BMO200 Fountain came to be. The project is a sculpture that depicts water pouring into a pond. The image of water is created through mosaic tiles that flip between white and blue in order to form the appropriate imagery and icons. Users can type in a “wish” with their mobile device and then toss the coin into the fountain. This piece particularly caught my eye because I enjoy how the project is a successful combination of art, interaction and software.

I believe this project required the development of custom scripts because the artists and developers of the project wanted to created an interactive interaction that didn’t involve the cliche projections or screens. They thus created a software involving a “flip side” where many discs along the fountain water form would easily flip between white and blue in order to create the appropriate images. The project designers had to configure different ways that the coin would fall into the fountain waters.

The BMO200 Fountain demonstrates that interaction design is not limited to screens. Although today we see a lot of interactions involving these components, I think it is endearing to see the mosaic tiles moving to create different shapes. However, when not with the fountain, the experience is definitely not has sublime.