Author: kdlee@andrew.cmu.edu

Kyle Lee Variable Face

The biggest challenge for me was properly sorting the local variables, global variables, and mouse pressed function. I felt good about the lines of code that I wrote, but it took me a long time of moving the lines to different locations in the code to finally get the result I wanted.

kdlee-project-02

var faceWidth = 100;
var faceHeight = 150;
var mouthWidth = 50;
var mouthHeight = 20;
var eyeSize = 20;
var eyeLidWidth = 10;
var eyeLidHeight = 2;
var irisColor = '#A46861';
var colors = ['#A46861', '#8CAEDC', '#A9BD8C'];

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

function draw() {
    background('#5D8FA4');
    noStroke();

//HEAD
    fill('#F2C4A2');//SKIN TONE
    ellipse(width / 2, height / 2, faceWidth,  faceHeight);//HEAD
//MOUTH
    fill(0);//BLACK
    ellipse(width / 2, height / 2 + faceHeight / 4, mouthWidth, mouthHeight);//MOUTH

//EYE WHITES
    var eyeLX = width / 2 - faceWidth * 0.25;
    var eyeRX = width / 2 + faceWidth * 0.25;
    fill(250);//WHITE
    ellipse(eyeLX, height / 2, eyeSize, eyeSize);//LEFT EYE
    ellipse(eyeRX, height / 2, eyeSize, eyeSize);//RIGHT EYE
//EYE IRIS
    var eyeIris = 9;
    fill(irisColor);//IRIS COLOR
    ellipse(eyeLX, height / 2, eyeIris, eyeIris);//LEFT IRIS
    ellipse(eyeRX, height / 2, eyeIris, eyeIris);//RIGHT IRIS
//EYE PUPIL
    var eyeP = 5;
    fill(0);//BLACK
    ellipse(eyeLX, height / 2, eyeP, eyeP);//LEFT PUPIL
    ellipse(eyeRX, height / 2, eyeP, eyeP);//RIGHT PUPIL
//EYELIDS
    var eyeLidY = height / 2 - eyeSize
    noFill();
    stroke(1);
    strokeWeight(2);
    arc(eyeLX, eyeLidY, eyeLidWidth, eyeLidHeight, PI, 0);//LEFT EYELID
    arc(eyeRX, eyeLidY, eyeLidWidth, eyeLidHeight, PI, 0);//RIGHT EYELID
}

function mousePressed() {
    faceWidth = random(75, 150);
    faceHeight = random(100, 200);
    mouthWidth = random(50, 30);
    mouthHeight = random(30, 5);
    eyeSize = random(10, 30);
    eyeP = random (5, eyeSize - 10);// Pupil
    eyeIris = (eyeSize - eyeP) / 2; //Iris size
    eyeLidWidth = random(12, 7);
    eyeLidHeight = random(7, 0);
    irisColor = random(colors);
}

Kyle Lee Looking Onward 02

Kung Fu Motion Visualization – Tobias Gremmler (2016)

What initially drew my into this project was the innovative expression of motion. Although it is certainly not the literal visual version of martial arts, I do feel like I get a strong understanding of the movement and the feeling of the activity. If I had just seen a video recording of the live motion capture, I doubt that I would have the same understanding of the movement.

I know from movies that motion capture generates data that can then be used as building blocks for new synthesis. I suppose that in its simplest form, it is similar to what we have been doing in class, drawing objects, but using motion capture data as the dynamic variables for placement, speed, and direction.

I think that the creator has done a terrific job of stripping down a complex phenomenon and representing it in a way that brings something new to the picture. I like how many of the physical distractions like the human form and the environment are minimized. I particularly like how I have to infer where the human form exists solely based on the represented motion. The way in which Gremmler identified these underlying motions and properly expressed them is impressive.

Kyle Lee Self Portrait

kdlee-project01

function setup() {
    createCanvas(600, 600);
    text("p5.js vers 0.5.2 test.", 10, 15);
    background(255)
}

function draw() {

    noStroke();
//CIRCLE
//    fill('#BCE8F9'); TEST BLUE
//    fill('#A5C8F1'); TEST BLUE
    fill('#CDE9F3'); //BLUE VIGNETTE
    ellipseMode(CENTER);
    ellipse(300,300,300,300);

//HAIR
    fill(0);
    ellipseMode(CORNER);
    ellipse(270,200,80,70);
    ellipse(250,240,30,30);
//HAIR STRAND
    noFill();
    stroke(0);
    strokeWeight(1.5);
    arc(267, 200, 10, 40, HALF_PI, 0+PI);
    arc(250, 234, 20, 20,HALF_PI+PI,0);


    noStroke();
//NECK
    fill('#D1A773');//DARK SKIN TONE
    rect(285,350,30,50);

//FACE
    fill('#F0C084');//SKIN TONE
    ellipseMode(CENTER);
    ellipse(width / 2,height / 2,100,150);

//EARS
    fill('#F0C084');//SKIN TONE
    ellipseMode(CENTER);
    ellipse(250,300,10,30);
    ellipse(350,300,10,30);

//SHIRT
    fill('#354053');//BLUE
    arc(300, 405, 75, 50, PI, 0);
//BUTTONS
    fill(240);
    ellipse(300,385,3,3);
    ellipse(300,395,3,3);

//MOUTH
    noFill();
    stroke(1);
    strokeWeight(4);
    arc(300, 335, 25, 12, 0, PI);

//EYES
    noFill();
    stroke(1);
    strokeWeight(4);
    arc(315, 285, 10, 2, PI, 0);
    arc(285, 285, 10, 2, PI, 0);

    noloop()
}

Since I currently only have a basic vocabulary of code to create shapes and draw, I spent a lot of time abstracting the form of the face to be as simple as possible. I tried to look at what basic features of the face (and mine in particular) make the drawing recognizable as a human face belonging to me.

KyleLee-LookingOutwards-1

http://www.commarts.com/column/reformulating-ux-norms

This article, written by Brian Burke, discusses the role of UX agencies to transform norms of business, education, social interaction, and large societal transitions. The CEO of Smashing Ideas, a UX agency, Burke discusses changing trends to onboard digital, the affect of big data, as well as the balance of art and science. One of their projects includes aiding Penguin Random House Publishing’s digital transformation to deeply broaden and diversify audiences.

For me, my greatest fear as a designer is that people see my role as shallow; all I do is make things simple and look “pretty.” The most admirable points in this article was the discussion of using design to lead some of these big trends towards a more cohesive future. In particular, the aiding of design to effect education and development of children significantly resonated with me.

One critique I have is on the results of some of Smashing Ideas projects. Given their success and reputation I am not too critical, but I would have liked to see some hard evidence on the fruits of their design work, namely how their aiding of Penguin Random House Publishing has actually changed peoples lives.

UX is huge now. Nearly every tech company and start up is in need of a UX/UI role. A lot of the time, UX can be coupled with Engineer. At Google, these UX Engineers are obviously prominent and have less of a presence in the vastness of Google. I like how even in the design of the company’s small 70 person employee roster seems to focus on the experience of their workers. In a more intimate workspace, there is greater opportunity to acknowledge and appreciate the work itself.