Author: GyuEun

gyueunp – Project-03: Dynamic Drawing

Dynamic Drawing

//GyuEun Park
//15-104 B
//gyueunp@andrew.cmu.edu
//Project-03-Dynamic-Drawing

var x1;
var backgroundColor;
var spot = {
  x: 100,
  y: 50
}
var size = {
  w: 10,
  h: 10
}
var col = {
  r: 162,
  g: 174,
  b: 185
}
var angle = 0;

function setup() {
  createCanvas (480,640);
  backgroundColor = 0;
}
 
function draw() {
  background(backgroundColor);
  backgroundColor = map(mouseX,0,width,0,200);

//set points for ellipse
  spot.x = x1
	spot.y = 530
	size.w = 70
	size.h = 70

	x1 = map(mouseY,0,height,width/2,mouseX);
  
  fill(255,100);
 	stroke(255,50);
 	strokeWeight(4);
//black center ellipse
  ellipse(x1,spot.y,size.w,size.h);
  push();
  fill(0,2)
  ellipse(x1,spot.y,size.w-20,size.h-20);
  pop();
//ellipse with ring
  ellipse(x1-100,spot.y-100,size.w-10,size.h-10)
 	ellipse(x1-100,spot.y-100,size.w-0,size.h-60);

//ellipse near center of canvas
  ellipse(x1-20,spot.y-150,size.w-40,size.h-40);
 	ellipse(x1-20,spot.y-150,size.w-90,size.h-90);

//white center ellipse
  ellipse(x1+100,spot.y-370,size.w-30,size.h-30);
  ellipse(x1+100,spot.y-370,size.w-90,size.h-90);
  ellipse(x1+100,spot.y-370,size.w-110,size.h-110);

//top right simple ellipse
  ellipse(x1+160,spot.y-290,size.w-50,size.h-50);
  
//cursor 
 	angleMode(DEGREES);
 	angle = angle + 20;
 	translate(mouseX,mouseY);
 	rotate(angle);
 	rectMode(CENTER);
 	rect(0, 0, 20, 30);
 	rotate(angle);
 	rect(0, 0, 20, 30);
 	rotate(angle);
 	rect(0, 0, 20, 30);
 
//set points for function a
  	a(30,260);
  	a(10,130);
  	a(70,15);
  
//ellipses if cursor on the upper left corner
  if (mouseY < height/2){
    fill(255);
    stroke(255,10);
    strokeWeight(150);
    ellipse(width/4,height/4,50,50);
    noStroke(0);
    fill(255,40);
    ellipse(width*3/4,height*3/4,50,50);
  }
//thin lines if cursor on the lower right corner
  else if (mouseY > height/2){
    fill(col.r, col.g, col.b);
    stroke(255,5);
    strokeWeight(150);
    ellipse(width*3/4,width*3/6,2,10);
    ellipse(width/4,width/4,4,15);
}

function a(x,y) {
  	push();
  	translate(mouseX,y);
  	ellipse(40,70,20,20);
  	pop();
}
}

I decided to use a limited set of colors in order to draw further attention to the dynamic quality of the work. I focused on making factors such as shapes, sizes, transparencies, positions, and colors vary subtly, while maintaining a sense of unity.

gyueunp – Looking Outwards 03

Woven Composites was a speculative research that was carried out from 2010 to 2012 by the design director Roland Snooks and the project team of Adrian Cortez, Michael Ferreyra, and Michael Murdock. The research consisted of experiments that provided insight into woven tectonics, which were generated through agentBody algorithms. Woven Composites is an ongoing research that attempts to study “the behavior of components or bodies which have architectural behavior encoded at a sub-agent level.” As the title of the research suggests, the works are composed of what seems to be a complex structure of interwoven elements. The creation of such intricate, plant-like structures that was possible through the process of computational digital fabrication is the most intriguing aspect of this research.

Roland Snooks’ website

 

gyueunp – Looking Outwards 02

 

Bubble Chamber (2003) is a generative painting system created by Jared Tarbell for an exhibition in the Processing gallery. The system’s imaginary particles are created by collisions that contain 216 random calculations and over 1 billion pixels of information that are unique to each one. Just as impressive as the broad range of possible outcomes are the visual elements of the final products. The randomness of the scattered patterns create fascinating visuals that are simply absorbing. The limited usage of colors contrasts with the detailed patterns, creating an excellent balance. Even with only four possible types of particles, the overlapping designs are almost stomach-turning. However, I would love to see more variations, as some final products in the series resemble one another.

More:

Jared Tarbell’s website

gyueunp – Project-02: Variable Faces

variable face

// GyuEun Park
// 15-104 E
// gyueunp@andrew.cmu.edu
// Project-02

var eyeSize = 14;
var blushTransp = 0;
var colorR = 112;
var colorG = 104;
var colorB = 104;
var eyebrowTransp = 0;

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

function draw() {
	background(colorR,colorG,colorB);

	// ears
	fill(0);
	noStroke();
	ellipse(175,125,20,30);
	ellipse(305,125,20,30);

	// head and neck
	fill(252,252,248);
	ellipse(width/2,320,280,440);
	
	// face
	fill(240,234,227);
	ellipse(width/2,230,170,200);

	// eyes
	fill(70);
	ellipse(200,230,eyeSize,eyeSize);
	ellipse(280,230,eyeSize,eyeSize);

	//blush
	fill(246,179,167,blushTransp);
	ellipse(190,245,15,6);
	ellipse(290,245,15,6);

	// nose
	stroke(100);
	strokeWeight(2);
	line(235,255,240,260);
	line(245,255,240,260);

	//philtrum
	stroke(100);
	strokeWeight(2);
	line(width/2,260,width/2,275);

	//eyebrows
	stroke(100,eyebrowTransp)
	line(200,215,210,218);
	line(280,215,270,218);

	fill(178,191,199);
	noStroke(0);
	ellipse(230,282,4,4);

	fill(255);
	noStroke(0);
	ellipse(229,281.4,1.5,1.5);
}

function mousePressed() {
	// when the user clicks, these variables are reassigned to random values within specified ranges.
	eyeSize = random(10,20);
	blushTransp = random(0,100);
	colorR = random(100,112);
	colorG = random(100,104);
	colorB = random(100,104);
	eyebrowTransp = random(0,100);
}

I made a face of my new stuffed alpaca. Although the random changes were interesting, I wanted to avoid drastic alterations. Therefore, I focused on creating subtle color and transparency changes in the background and its facial features.

gyueunp – Looking Outwards 01

Paint With Your Feet (2011) is a project that was produced for the Nike Free Run+ 2 Pack series by YesYesNo Team in collaboration with DualForces. By developing a custom software with openFrameworks v007b, the team allowed participating runners to create paintings with their Nike + GPS run data. Using the software, they imported the metrics from the run and created visuals based on various factors such as the speed and consistency.
This project is noteworthy in that it is not only visually and conceptually intriguing, but is also successful in providing the participants with a valuable opportunity; they were allowed to create and alter their compositions and to keep them as high resolution prints. Additionally, the team successfully advertised the new Nike products and their merits through their creation.

YesYesNo Interactive projects website

Process photos:

gyueunp – Project-01: Self-Portrait

gyueun_selfportrait

// GyuEun Park
// 15-104 E
// gyueunp@andrew.cmu.edu
// Project-01

function setup() {
	createCanvas(600, 600);
	background(93,129,182);
}

function draw() {
	// head
	fill(0);
	noStroke();
	ellipse(270,220.7,261,290);

	// right hair
	smooth(0);
	fill(0);
	quad(214,190,419,550,400.9,220,213,190);

	// left hair
	fill(0);
	quad(142,250,190,150,420,550,190,550);

	// face
	fill(255);
	noStroke();
	quad(175,300,210,150,330,396,230,396);
	fill(0);
	triangle(303,400,335,400,317,370);

	// eye
	fill(237,240,251);
	stroke(178,188,195);
	strokeWeight(0.6);
	arc(218,275,55,50,0,PI, CHORD);

	//eye details
	fill(108,125,140);
	arc(218,275,35,30,0,PI, CHORD);

	fill(0);
	strokeWeight(0.4);
	arc(218,275,17.5,15,0,PI, CHORD);

	fill(0);
	stroke(0);
	strokeWeight(3);
	line(186,272.5,245,274);

	//mouth
	fill(0);
	stroke(0);
	strokeWeight(2);
	line(254,346,275,346);

	//lip piercing
	fill(178,191,199);
	noStroke(0);
	ellipse(256,352,5,5);

	fill(255);
	noStroke(0);
	ellipse(255,351.4,2,2);
}

I created a simple self-portrait by using minimal details that accentuate my unique features. Although I went through a long trial-and-error process to find the most suitable shapes and angles, I enjoyed this project.