Author: jooheek@andrew.cmu.edu

LookingOutwards02-jooheek

Generative Knitting Design Tools

Site: http://blog.drwoohoo.com/generative-knitting-design-tools/

Dr. Woohoo is a generative artist who combines color palettes, patterns and designs with computer algorithms to create unique artwork. In this particular artwork, Woohoo takes color palettes and creates patterns with those colors through computer algorithms and translates them to knit design. In this particular case, he puts them into shoes. This allows people to have their own unique, custom designed shoes through computer generation.

An example of how color palettes are translated into patterns for shoes.

I chose this particular artwork because I found it interesting how art and computation can be combined to create something as antique and old like knitting. Knitting is usually associated with more older types of fabric art, something that is hand made. But by combining it with computer algorithms, it is made into a novel type of fashion design, creating a unique experience.

jooheek-Project02-Variable-Face

sketch

//Joo Hee Kim
//Section E
//jooheek@andrew.cmu.edu
//Project-02

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

var faceSize = 200;
var cheekSize = 230;
var earsSize = 50;
var eyeHeight = 50;
var eyeWidth = 30;
var hippoR = 149;
var hippoG = 186;
var hippoB = 198;
var backgroundR = 0;
var backgroundG = 77;
var backgroundB = 104;

function draw() {
	background(backgroundR, backgroundG, backgroundB);

	noStroke();
	//hippo ears
	var earsRX = width/2 - faceSize*0.25;
	var earsLX = width/2 + faceSize*0.25;
	var earsY = height/2 - faceSize*0.25;

	fill(hippoR, hippoG, hippoB);
	ellipse(earsRX, earsY, earsSize, earsSize);//outer ear right

	fill(hippoR, hippoG, hippoB);
	ellipse(earsLX, earsY, earsSize, earsSize);//outer ear left

	fill(hippoR-20, hippoG-20, hippoB-20);
	ellipse(earsRX, earsY, earsSize*0.8, earsSize*0.8);//inner ear right

	fill(hippoR-20, hippoG-20, hippoB-20);
	ellipse(earsLX, earsY, earsSize*0.8, earsSize*0.8);//inner ear left


	//hippo face
	fill(hippoR, hippoG, hippoB);
	ellipse(width/2, height/2, faceSize, faceSize*0.75);

	//hippo Eye
	var eyeRX = width/2 + faceSize*0.25;
	var eyeLX = width/2 - faceSize*0.25;
	
	fill(255, 255, 255);
	ellipse(eyeLX, height/2, eyeWidth, eyeHeight);//left eye white

	fill(255, 255, 255);
	ellipse(eyeRX, height/2, eyeWidth, eyeHeight);//right eye white

	fill(0, 0, 0);
	ellipse(eyeLX, height/2, eyeWidth/2, eyeHeight/2);//left eye black

	fill(0, 0, 0);
	ellipse(eyeRX, height/2, eyeWidth/2, eyeHeight/2);//right eye black
	
	//hippo cheek
	fill(hippoR+20, hippoG+20, hippoB+20);
	ellipse(width/2, 325, cheekSize, cheekSize*0.75);

	//hippo nose
	var noseRX = width/2 - cheekSize*0.25;
	var noseLX = width/2 + cheekSize*0.25;
	var noseY = height/2 + cheekSize*0.25;
	
	fill(hippoR+40, hippoG+40, hippoB+40);
	ellipse(noseRX, noseY, earsSize, earsSize);//hippo noseright light

	fill(hippoR+40, hippoG+40, hippoB+40);
	ellipse(noseLX, noseY, earsSize, earsSize);//hippo noseleft light

	fill(hippoR-10, hippoG-10, hippoB-10);
	ellipse(noseRX, noseY, earsSize*0.6, earsSize*0.6);//hippo noseright dark

	fill(hippoR-10, hippoG-10, hippoB-10);
	ellipse(noseLX, noseY, earsSize*0.6, earsSize*0.6);//hippo noseleft dark

}

function mousePressed() {
	faceSize = random(70, 270);
	cheekSize = random(100, 300);
	earsSize = random(50, 100);
	eyeHeight = random(50, 150);
	eyeWidth = random(30, 130);
	hippoR = random(0, 255);
	hippoG = random(0, 255);
	hippoB = random(0, 255);
	backgroundR = random(0, 255);
	backgroundG = random(0, 255);
	backgroundB = random(0, 255);
	clear();

}

For this project, I wanted to do something simple yet fun to do, which is why I chose to do an animal, specifically a hippo. I think this assignment really let me understand how and why variables are used.

LookingOutwards01-jooheek

‘A Night of Spiritual Jazz’ Installation – The Mill X Red Bull Music Academy

Article: http://www.themill.com/millchannel/731/red-bull-music-academy-%E2%80%98a-night-of-spiritual-jazz%E2%80%99-installation

Visuals from the Cosmograph and Bloom were projected on a display of strings.

Music is a magnificent part of all of our lives. Wherever you go, you can hear music. But what if you could see the music, instead of listening? The Mill created an experimental installation that combined a live liquid paint show with generative art software, called Cosmograph and Bloom, led by multiple jazz band’s audio. As jazz bands played, a live painter was behind the scenes creating a color palette for the software by using different kinds of liquid media. The software would then capture this visual and generate it into visuals alongside the audio inputs from the jazz bands.

Example of a visual created by Cosmograph.

I especially admired this installation because of how it combines different types of art with technical software to produce a more unique and possibly beautiful visual. Both music and fine art can be intertwined thanks to the technical software. It also made me think about how possibly deaf people who have never heard music or any kind of sound can be given the chance to experience the beauty of music through visuals. Just like the creator, Rama Allen, states, the visuals represent the “puffy eruptions of the caterpillar from Alice in Wonderland”, which he claims was part of his inspiration.

Behind the scenes of the visual creations.

 

jooheek_Portrait-01-face

jooheek_portrait

//Joo Hee Kim
//Section E
//jooheek@andrew.cmu.edu
//Project-01

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

function draw() {

	background(49, 45, 142);

	strokeWeight(0);

	//HAIR
	fill(202, 165, 145);
	ellipse(280, 250, 350, 300);

	fill(202, 165, 145);
	arc(150, 325, 115, 320, 900, 100);

	fill(202, 165, 145);
	quad(93, 290, 130, 325, 200, 475, 60, 475);

	fill(49, 45, 142);
	arc(24, 275, 140, 450, 10, 90);

	fill(202, 165, 145);
	arc(160, 473, 200, 100, 0, 130);

	fill(202, 165, 145);
	ellipse(440, 250, 50, 100);

	fill(202, 165, 145);
	quad(400, 250, 465, 245, 505, 475, 380, 475);

	fill(49, 45, 142);
	arc(515, 250, 100, 450, 70, 80);

	fill(202, 165, 145);
	arc(405, 473, 200, 100, 350, 130);

	//EARS
	fill(250, 220, 200);
	ellipse(145, 340, 20, 50);

	fill(250, 220, 200);
	ellipse(455, 340, 20, 50);

	fill(239, 207, 186);
	ellipse(145, 340, 10, 30);

	fill(239, 207, 186);
	ellipse(455, 340, 10, 30);

	//FACE
	strokeWeight(0);
	fill(250, 220, 200);
	ellipse(300, 300, 310, 330);

	fill(250, 220, 200);
	rect(145, 300, 310, 40);

	fill(250, 220, 200);
	ellipse(300, 370, 320, 280);

	fill(244, 212, 191);
	ellipse(200, 400, 100, 100);

	fill(244, 212, 191);
	ellipse(395, 400, 100, 100);

	fill(249, 235, 228);
	ellipse(200, 380, 50, 40);

	fill(249, 235, 228);
	ellipse(395, 380, 50, 40);

	fill(249, 235, 228);
	ellipse(370, 200, 50, 40);

	//EYEBROWS
	fill(144, 119, 105)
	rect(200, 280, 70, 20);

	fill(144 ,119, 105);
	triangle(200, 280, 220, 300, 170, 300);

	fill(144, 119, 105);
	rect(325, 280, 70, 20);

	fill(144, 119, 105);
	triangle(395, 280, 420, 300, 385, 300);

	//NOSE
	fill(249, 235, 228);
	rect(270, 280, 55, 20);

	fill(249, 235, 228);
	triangle(270, 300, 325, 300, 300, 330);

	fill(239, 207, 186);
	rect(280, 380, 40, 30);

	fill(249, 235, 228);
	rect(288, 320, 20, 70);

	fill(249, 235, 228);
	rect(280, 370, 40, 20);

	fill(250, 220, 200);
	ellipse(272, 350, 40, 100);

	fill(250, 220, 200);
	ellipse(325, 350, 40, 100);



	//LIPS
	fill(255, 100, 100);
	ellipse(300, 430, 60, 40);

	fill(250, 220, 200);
	rect(270, 400, 60, 30);

	fill(220, 100, 100);
	triangle(290, 415, 310, 430, 270, 430);

	fill(220, 100, 100);
	triangle(310, 415, 330, 430, 290, 430);


	//EYES
	fill(50, 50, 50);
	ellipse(225, 327, 60, 10);

	fill(255, 255, 255);
	ellipse(225, 330, 60, 10);

	fill(0, 0, 0);
	ellipse(225, 330, 10, 10);

	fill(50, 50, 50);
	ellipse(370, 327, 60, 10);

	fill(255, 255, 255);
	ellipse(370, 330, 60, 10);

	fill(0, 0, 0);
	ellipse(370, 330, 10, 10);






	






}

While I wanted to make my portrait simple, I wanted to give emphasis to the features that are the most unique and prominent on my face. I sketched the way that I wanted to make if first then made my code as similar to it as possible.