Author: SooA Kim

SooA Kim: Project-05-Wallpaper

sookim_wallpaper

/* SOOA KIM
SECTION C
sookim@andrew.cmu.edu
project-05
*/

function setup() {
    createCanvas(600, 600);
    noStroke();
}
 
function draw() {
    background("pink");

    //white rectangle
    for (var px = 0; px < height; px += 300) {
        for (var py = 0; py < height; py += 200) {
            fill (255);
            rect(px + 100, py, 200, 100);
        }
    }
//lavender square
    for (var rx = 0; rx < height; rx+= 200) {
        for (var ry = 100; ry < height; ry += 200) {
            fill(184, 186, 215); 
            rect(rx, ry, 100, 100);
        }
    }

    for (var ty = 50; ty < height + 50; ty += 200) {
        for (var tx = 50; tx < height + 50; tx += 200) {
            fill(45, 44, 119); //blue circle
            arc(tx, ty, 100, 100, HALF_PI, PI + HALF_PI);
            fill(225, 99, 58); //oraange circle
            arc(tx, ty + 100, 100, 100, PI + HALF_PI, HALF_PI);
            fill(255); //white circle
            arc(tx + 100, ty + 50, 100, 100, TWO_PI, PI);
        }
    }
   
    //two squares
    for (var ox = 50; ox < height; ox += 400) {
        for (var oy = 50; oy < height; oy += 200) {
            fill(0); 
            rect(ox + 50, oy, 50, 50);
            rect(ox + 100,oy - 50, 50, 50);
        }
    }

    noLoop(); 
}

For this project, I tried to make a wallpaper based on this minimalist pattern from the Bauhaus movement.

SooA Kim: Looking Outwards-05

The computer-generated Gollum (above, seen in 2012’s The Hobbit: An Unexpected Journey)
CG Gollum is based on performances by actor Andy Serkis (below). Image: NEW LINE PRODUCTIONS

I chose Joe Letteri who is the senior visual effects supervisor at Weta Digital in New Zealand and the Oscar-winning co-creator of Gollum on screen The Hobbit. I admire films where actors interact with CG characters because the process incorporates using motion capture on the actor, that will be playing the computer generated character, and uses VFX techniques to bring the character into life. Since the Lord of the Rings trilogy in 2002, the CG looks of Gollum’s character has been constantly analyzed and applied with more technical progression on CG tools, as in the Hobbit, 2012, Gollum looks more realistic in terms of his skin texture and muscle movement. To achieve more realistic CG character that is no different to a real actor, Joe Letteri and Weta Digital focused in depth on how muscles and skeleton joints work in an actual human body. One of the techniques that they developed was a tissue simulation and subsurface-scattering technique to render Gollum’s skin texture to give more translucency.

SooA Kim – 04 – String-Art


sketch

For this assignment, I tried to create this abstract wave forms.  Then, I ended up also attempting to make some symmetrical lines to understand better how line coordinates work using loop functions. It was very confusing, I would need more practice to get used to it.

/* SooA Kim
Section D
sookim@andrew.cmu.edu
Assignment 04 -String Art */


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

function draw() {
    background(0);

    for (var i = 0; i < 200; i+= 2) {
        stroke("gold");
        strokeWeight(1);
        line(i, height, 0, 5*i);
        stroke("red");
        line(4*i, height, 0, 4*i);
        stroke("pink");
        line(7*i, height, 0, 3*i);
        stroke("blue")
        line(10*i, height, 0, 2*i);
        stroke("purple");
        line(13*i, height, 0, 1.5*i);
    }
    
    for (var i = 0; i < 100; i+= 10) {
        stroke(255, 109, 0);
        strokeWeight(1);
        line(i/4, i, i*4, height/2);
        line(i/4, height - i, i*4, height/2);
        stroke(mouseX, 255, mouseY);
        strokeWeight(mouseX);
        line(width - (i*2), 0, i * 2, height);
        line(width - (i*2), height, (i*2), 0);

    }

}

SooA Kim – Looking Outwards – 04

EXPERIMENT IN F# MINOR| 2013

Janet Cardiff and George Bures Miller are artists known for making sound art in sculptural form and bringing an aural experience to the audience in the space. I have been inspired by Cardiff & Bures Miller’s work in my art practice and realized that their works have been progressed into creating generative sound art installation work. Experiment in F# minor is one of the works where sound is triggered from the viewer’s shadows. By using the light sensors, the shadows cause instrumental tracks coming from the speakers to fade up, overlapping and mingling into various soundscape. As more audience fill in the room, it crates a cacophony of musical compositions and, with less audience in the room, the installation table remains in silence.

Experiment in F# Minor; Janet Cardiff & George Bures Miller from Cardiff & Miller on Vimeo.

SooA Kim: Project-03-Dynamic-Drawing


sketch_1

The assignment was pretty challenging for me this week. I wish that I had more time to understand and be comfortable using min()/max ()and constraint(). I mainly focused on understanding how each shape is made by different application of motion functions.

/* 
   SooA Kim
   Section D
   sookim
   Project 3 - Dynamic Drawing 
*/

var c1 = 100;
var c2 = 120;
var c3 = 210;
var angle = 0;

function setup() {
    createCanvas(640, 460);
    rectMode(CENTER);
}

function draw() {
    background(c1, c2, c3);
    noStroke();

    //background color
    if (mouseX > width/3) {
        background(0);
    }
    
    //pink circles and rectangles with symmetry
    fill(255, 100, 100);
    var m = max(min(mouseX, 640),0);
    var size = m * 320.0 / 640.0;
    rect(10 + m * 100.0 / 640.0, 230, size, size);
    rect(width - m * 100.0 / 640.0, 230, size, size);
    ellipse(10 + m * 320.0 / 640.0, 100, size + 50, size);
    ellipse(width - m * 320.0 / 640.0, 100, size + 50, size);

    //blue rectangle with rotation in the middle
    fill(0, 0, 255);
    var x1 = max(min(mouseX, 100), 0);
    push();
    translate (340, 230);
    rotate(radians(angle));
    rect(x1, m , 100, 100);
    pop();
    angle = angle + 1

    //circle green
    fill(100, 255, c3);
    var y = min(100, mouseY); 
    ellipse (mouseX, y + 100, 50, 200);
}

SooA Kim: Looking Outwards-03

Hypnosis, fw runway 2019.

Iris van Herpen is one of the most avant garde designers known in the industry of fashion design. She has been innovating new methods in both design and garment construction techniques to fuse the past and future of couture craftsmanship. In her Hypnosis 2019 collection, collaborating with the architect Anthony Howe, she applies her design in using parametric patterns to the fabric that’s generated through 3D printing. The Hypnosis collection can be called as “kinetic couture,” since the garments move as models walk the runway. I believe the algorithms on generating these patterns were inspired by the complexity forms that is in nature, such as wind and fluidity of water. The kinetic movement and form was also adapted from the mechanisms of Howe’s sculptures. Howe’s design uses computational aid in creating parametric installation work.  I admired this collection and collaboration between fashion designer and an architect, where they applied architectural form using computational distortion to experiment on bringing into creation of haute couture.

behind the scene photo of Hypnosis collection


SooA Kim– Project 02 – Variable Face


sketch

I had fun sketching this Ghibli character called Kaonashi or “no face”. It was a good exercise for me to learn how mouthPressed function and random() work by changing the size and color using different variables. 

Reference photos:

 

 

/*
SooA Kim
Section D
sookim@andrew.cmu.edu
Project-02-Variable-Face
*/

var eye = 40;
var eyeH = 300;
var faceW = 240;
var mouthH = 10;
var color1 = 255;
var tri1 = 150;
var tri2 = 148;
var tri3 = 184;
var mouthOpen = 1;


function setup() {
    createCanvas(480, 640);
    background (25, 170, 180);
}

function draw() {
    //blackcoat
    strokeWeight(3); 
    fill("black");
    beginShape();
    curveVertex(25, 640);
    curveVertex(25, 640);
    curveVertex(30, 500);
    curveVertex(100, 220);
    curveVertex(240, 120);
    curveVertex(380, 220);
    curveVertex(450, 500);
    curveVertex(455, 640);
    curveVertex(455, 640);
    endShape();

    //face 
    noStroke();
    fill(color1);
    ellipse(240, 330, faceW, 340); 
  
    //eyes
    fill(0);
    ellipse (180, eyeH, eye, eye/2);
    ellipse (300, eyeH, eye, eye/2);
    //shadow?
    ellipse (180, 330, 35, 8);
    ellipse (300, 330, 35, 8);

     //mouth
     ellipse (240, 450, mouthH * 5, mouthH);
  
    //top triangles
    fill(tri1, tri2, tri3);
    triangle (160, 270, 175, 230, 190, 270);
    triangle (290, 270, 300, 230, 320, 270);
    //bottom triangles
    triangle(160, 350, 175, 420, 190, 350);
    triangle(290, 350, 300, 420, 320, 350);  
    ellipse(240, 475, 30, 10);
  
    //mouth2 open
    if (mouthOpen >= 1) {
        fill(0); //black
    }
    else {
        fill(255);   
        ellipse(240, 560, 250, 100);
        fill("red");
        ellipse(240, 560, 250, 55);
        stroke(1);
        line(130, 510, 130, 547);
        line(150, 510, 150, 540);
        line(180, 510, 180, 537); 
        line(210, 510, 210, 533);
        line(240, 510, 240, 533);
        line(270, 510, 270, 533);
        line(300, 510, 300, 535);
        line(330, 525, 330, 540);
        line(350, 525, 350, 547);
        line(130, 573, 130, 620);
        line(150, 580, 150, 620);
        line(180, 585, 180, 620);
        line(210, 587, 210, 620);
        line(240, 587, 240, 620);
        line(270, 586, 270, 620);
        line(300, 585, 300, 620);
        line(330, 580, 330, 620);
        line(350, 573, 350, 620);
    }
}
  
function mousePressed(){
    eye = random(5, 40);
    faceW = random (180, 300);
    mouthH = random(5, 25);
    eyeH = random(305, 320);
    tri1 = random(150, 255);
    tri2 = random(0, 255);
    tri3 = random(0, 255);
    mouthOpen = random(0, 4);
    color1 = random(0, 255);
}

SooA Kim: Looking Outwards – 02

Google PAIR’s project, Waterfall of Meaning

I saw this installation by Google PAIR’s project in the AI: More than Human exhibition at the Barbican Centre in UK over the summer. Waterfall of Meaning is based on generative machine learning system that translates sentences to create a “map” of word meanings. It shows how a machine absorbs human associations between words and analyze them into categories by using the algorithms. I remember putting a word “theater” into the machine and the word travelled from the top of the installation in a style of word embedding where you can also see all the other words that associates with “theater.” As the word travelled down, it went through different level of categories in certain direction where the machine identifies which category the word belongs in. (i.e. good vs bad, human vs machine, female vs male)

SooA Kim – Project 01

project1

//15-104, Section C
//SooA Kim
//sookim@andrew.cmu.edu

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

function draw() {
    background(100, 100, 150);

    //hair
    fill(0);
    ellipse(400, 330, 200, 250);
    ellipse(420, 450, 250, 250);
    ellipse(200, 350, 180, 220);
    ellipse(190, 460, 180, 180);
    ellipse(180, 570, 200, 200);
    ellipse(500, 560, 150, 150);

    //ears
    fill('#F5E0CD');
    ellipse(300, 320, 280, 150);

    //neck
    rect(255, 350, 100, 200);

    //face
    stroke(255, 255, 255);
    strokeWeight(3);
    ellipse(300, 300, 230, 300);

    //eyes
    noStroke();
    fill(0);
    ellipse (252, 280, 35, 35);
    ellipse (357, 280, 35, 35);

    //dot
    ellipse(357, 301, 5, 5);

    //eyelid
    noFill();
    stroke(0);
    strokeWeight(8);
    arc(245, 283, 57, 50, PI, TWO_PI);
    arc(350, 283, 57, 50, PI, TWO_PI);

   //mouth
    stroke('#C69C6D');
    strokeWeight(5);
    arc(300, 320, 50, 50, HALF_PI, PI - QUARTER_PI);

    //lips
    fill('#E55F55');
    noStroke();
    ellipse(310, 400, 40, 20);

    //hair bang
    fill(0);
    push();
    rotate(PI / 5.0);
    ellipse(385, -80, 250, 120);
    pop();
    push();
    rotate(PI / 3.5);
    ellipse(280, -45, 120, 230);
    pop();
    
    //body
    fill(50, 50, 50); 
    rect(150, 480, 320, 200, 50);

    //hair bang2
    push(); 
    fill(0);
    rotate(PI / 3.5);
    ellipse(610, -35, 150, 250);
    ellipse(670, 0, 250, 250);
    pop();
    fill(0);
    ellipse(170, 550, 150, 180);

     //earring
    fill(255)
    ellipse (180, 360, 12, 12);
    fill(255)
    triangle(165, 400, 180, 365, 200, 400); 
}

This was my first time generating an image by writing code. It helped me get familiar with coordinates in my canvas and realize the hierarchy/or lines to identify layers when you code in your text editor.

SooA Kim: Looking Outwards-1

Light Barrier Third Edition, 2016 by Kimchi and Chips

“Light Barrier Third Edition” is a multimedia light installation work from Kimchi and Chips, a studio based in Seoul founded by artists, Mimi Son (KR) and Elliot Woods (EN). This installation is an ongoing developmental series since 2014, the latest edition has been presented in Asian Cultural Centre, Gwangju, South Korea in 2016. 

The work consists of projection beams, concave mirrors, haze, and some scanning/interactive coding work to animate lights. This work requires precise calculation between the projection beams and the structure of concave mirrors to create a volumetric images or “light sculpture” through haze. They use materialized physical objects to create a non-materialistic object, light. It is interesting because we normally see and use light as a source of material to support our physical objects within space, however; Kimchi and Chips used it the other way around – having light as the object of imagery, shown as a geometric floating objects in this installation. 

Their art practices have been inspired by the values from the Impressionist movement in the 19th century and the first introduction to photography. Presenting their work as “viewerless images” as they focus on the visible brush strokes and emphasize on the depiction of light, rather than the contextual subjectivity of the work. I have been fascinated by their works and the use of their mediums, which consists of video projection, light, and coding in 3d softwares to create digital light installation art.

Light Barrier Third Edition [2016] (4K) from Mimi Son on Vimeo.