## Yingying Yan Project-02-Variable-Face

I was just trying things out. Every time I run the code, something funny pops up, so I decided to do weird, ugly, and funny faces. I had a lot of fun playing with this.

``````//variables layout
var eyeSize = 20;
var faceWidth = 100;
var faceHeight = 150;
var num = 4;
var num2 = 6;
var numNose = 8;
var mouthX = 30;
var mouthY = 50;
var Red = 100;
var earX = 10;
var earY = 20;
var color = 254

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

function draw() {
background(223,240,230);

//ears
fill (6,167,181);
var earLX = width / 2 - faceWidth / 2;
var earRX = width / 2 + faceWidth / 2;
ellipse(earLX, height / 2, earX, earY);
ellipse(earRX, height / 2, earX, earY);

//face, changes shape
fill (color,192,79);

if (faceWidth > 250) {
faceShape = ellipse (width / 2, height / 2, faceWidth, faceHeight);
} else {
faceShape = rect(width / 2 - faceWidth / 2 , height / 2 - faceHeight / 2, faceWidth,  faceHeight);
}

//eyes, changes size
var eyeLX = width / 2 - faceWidth * 0.25;
var eyeRX = width / 2 + faceWidth * 0.25;
var eyeY = height / 2 - faceWidth * 0.12;
ellipse(eyeLX, eyeY, eyeSize, eyeSize + num);
ellipse(eyeRX, eyeY, eyeSize, eyeSize + num);

//pupils, always inside the eyes
fill(0);
ellipse(eyeLX + num, eyeY, eyeSize / 2, eyeSize / 3+ num);
ellipse(eyeRX + num, eyeY, eyeSize / 2, eyeSize / 3+ num);

//mouth
fill(233,111,41);
var RectX = width / 2 - mouthX / 2;
rect(RectX + num2, height/2 + 15, mouthX, mouthY);

//tongue, changes color and move in relationship to the mouth
fill (Red, 20, 40);
rect(RectX + num2, height/2 + 15 + 2 * mouthY / 3, mouthX, mouthY / 3);

//teeth changes x according to the mouth
fill(250);
rect(RectX + num2 +10, height/2 + 15, 5, 10);
rect(RectX + num2 +20, height/2 + 15, 5, 10);

//nose, changes how long the nose is
fill (19,71,125);
triangle(width / 2 - 4, height / 2 + 4, width / 2 + 4, height / 2 + 4, width / 2, height / 2 - numNose);

}

function mousePressed() {
// when the user clicks, these variables are reassigned
// to random values within specified ranges. For example,
// 'faceWidth' gets a random value between 75 and 150.
faceWidth = random(100, 350);
faceHeight = random(200, 350);
eyeSize = random(10, 50);
num = random(-5, 5);
num2 = random(0,5);
numNose = random(10, 60);
mouthX = random(40, 60);
mouthY = random(30, 60);
Red = random(90, 250);
earX = random(15, 100);
earY = random(40, 80);
color = random(200,250);
}``````

## Yingying Yan LookingOutwards-02

On Eiffel Tower’s 120th anniversary, its operator Société d’Exploitation de la Tour Eiffel held a remodeling competition to create more viewing space on the tower. Serero Architects, who proposed Eiffel DNA has won the competition. They proposed putting a carbon Kevlar structure made out of metal panels to the top of the tower and doubling the amount of viewing space.

It is called Eiffel DNA because it uses a generative computer script to copy the pattern from the old structure, and then “grow” new branches from the primary structure of the tower. This redundancy, non-repetition of pattern, and complex woven form are three interconnected structural weaves generated by the computer script. It also has curvatures unfold alone the tower.

As an architecture student, this project has introduced a new design method to me. I always like new technology and how technology can combine with art to create something unique. Eiffel DNA proved that the computer can be used to create architecture that better people’ life and the society. The new structure, although is not built, fits in the big idea of growing out of the tower and adds a new life to Eiffel. The generative design really gives designers the ability and flexibility to create something crazy. I do not know much about the algorithm, but I suppose they used some software similar to ph python in Grasshopper. No doubt, this is a project requires a lot of computational thinking.

## Yingying Yan LookingOutwards-01

The Moment We Meet is a piece of kinetic installation art by Taiwanese artist Hsin-Chien Huang. It is installed in a subway station in Taipei. This project is a panel system of 10×10 matrix of faces, controlled by PLC. The faces are printed on PVC panels. Each panel can be controlled by the computer to create different combinations of faces. In term of the main idea, this project aimed to express that when we meet, our emotions will spread out to others. This project took about two years to complete.

I visited Taip a few summers ago, and as soon as I walked out of the subway station, this piece caught my attention — I was astonished. I stood there for few minutes staring at the installation. I felt like I was making eye contact with different people as the panels flipped through. It was just so fascinating. The fact that they made so many variations using just 10 panels is magical. The panels also flipped in various ways! As I was a tourist, this piece made me feel like everyone in Taipei was greeting me. This project can also be used for advertisements since it captures people’s attention.

## Yingying Yan Project-01-Face

``````/*
Yingying Yan
Waitlist
yingyiny@andrew.cmu.edu
Project 01 Face
*/

function setup() {
createCanvas(500, 500);
background(198,204,201);
}

function draw() {
//hair or hair tie
fill(63,60,60);
rect(width/2-128,length/2.5-270,260,51);
fill(135,163,165);
ellipse(width/2,height/2.5-123,47,32);
fill(63,60,60);
ellipse(width/2,height/2.5-33,185,189);

//ears
fill(240,208,197);
ellipse(width/2-90,height/2.5-5,16,25);
ellipse(width/2+90,height/2.5-5,16,25);

//body parts
fill(240,208,197);
rect(width/2-13,height/2+40,26,18);
line(237,308,250,330);
line(237+26,308,250,330);
line(237,308,250-50,450);
line(237+26,308,250+50,450)

//face
fill(240,208,197);
ellipse(width/2,height/2.5,184,187);

//eyebrows
arc(width/2-45,height/2.5-25,40,20,PI,0);
arc(width/2+45,height/2.5-25,40,20,PI,0);

//mouth
fill(212,118,118);
ellipse(width/2,height/2.5+50,40,40);

//nose
fill(240,208,197);
ellipse(width/2,height/2.5+10,11,11);

//dot
fill(0);
ellipse(width/2+70,height/2.5+2,4.5,4.5);

//eyes
fill(146,129,115);
ellipse(width/2-45,height/2.5-8,26,26);
ellipse(width/2+45,height/2.5-8,26,26);

}
``````

This is my first time coding, so I used as many circles as possible. But it works out because my face always looks surprised. I think I should make another portrait after I finish this class (if I get off the waitlist). It will be fun to compare the before and after.