## John Legelis Project 02 Variable Face

``````//John Legelis
//Section D 3:00-4:30
//jlegelis@andrew.cmu.edu
//Project-02 Variable Faces; Face Variables

function setup() {
createCanvas(480, 640);
background(0);

}
var centerX
centerX = 480/2

var centerY
centerY = 640/2

function mousePressed() {
loop();
noLoop();
}

function draw() {

var BcolorR
BcolorR = random(126,240)
var BcolorG
BcolorG = random(126,240)
var BcolorB
BcolorB = random(126,240)

background(BcolorR,BcolorG,BcolorB);

// randomize face dimensions
var faceW;
faceW = random(0+100,480-100);

var faceH;
faceH = random(0+50,640-50);

var max_nose_gap
max_nose_gap = faceW/7
var max_eye_size
max_eye_size = faceW/2 - (max_nose_gap)

ellipseMode(CENTER);
var FcolorR
FcolorR = random(126,240)
var FcolorG
FcolorG = random(126,240)
var FcolorB
FcolorB = random(126,240)
fill(FcolorR,FcolorG,FcolorB);

//Draw Face
ellipse(centerX, centerY, faceW, faceH);

// randomize eye width in relation to face dimensions and not larger than largest possible
var eyeW;
eyeW = min((random(faceW / 6, faceW/2)),(max_eye_size));

// randomize eye height in relation to face dimensions
var eyeH;
eyeH = random(faceH/5, faceH/9);

// randomize eye placement within left side of place and not overlapping eye width with nose or edge of face
var pY;
pY = centerY;

//calculate leftmost left pupil X value
var lpXmin
lpXmin = centerX - faceW/2 + eyeW/2

//calulate rightmost left pupil X value
var lpXmax
lpXmax = centerX - eyeW/2 - (max_nose_gap/2)

var lpX;
lpX = random(lpXmin, lpXmax)

// draw left eye
fill(255)
ellipse(lpX, pY, eyeW, eyeH)

// draw left pupil
ellipseMode(CENTER);
fill(0);
ellipse(lpX, pY, eyeW/3, eyeH);

//figure out coordinate of right pupil

var centerX_to_lpX
centerX_to_lpX = centerX - lpX

var rpX
rpX = centerX + centerX_to_lpX

//draw right eye
fill(255)
ellipse(rpX, pY, eyeW, eyeH)

//draw right pupil
fill(0)
ellipse(rpX, pY, eyeW/3, eyeH)

//NOSE----------------------------------------------------------------------

//nose bridge -----------

// nose bridge top y
var nbtY
nbtY = centerY

// random nose bottom y
var nbY
nbY = random(centerY+faceH/6, centerY+faceH/3)

//random nose bridge width
var nbW
nbW = min(max_nose_gap, faceW/10)
print("noseWidth =" + nbW)

//nose bridge left x
var nblX
nblX = centerX - nbW/2

//nose bridge right x
var nbrX
nbrX = nblX + nbW

//draw nose bridge rectangle
fill(FcolorR,FcolorG,FcolorB)
rectMode(CORNERS)
rect(nblX,nbtY, nbrX,nbY)

//nose bulb------------
var bulbW
bulbW = random(faceW/6,faceW/8)

var bulbH
bulbH = random(faceH/10, faceH/15)

var bulbtX
bulbtX = centerX - bulbW/2

var bulbtY
bulbtY = nbY - bulbH

var bulbbX
bulbbX = centerX + bulbW/2

var bulbbY
bulbbY = nbY

rect(bulbtX, bulbtY, bulbbX, bulbbY)

//MOUTH------------------------------------------------------------------
var mW
mW = random(faceW/3, faceW/4)

var mH
mH = random(faceH/7, faceH/10)

var mcX
mcX = centerX

var mcY
mcY = ((nbY+ (centerY+faceH/2))/2)

rectMode(CENTER)
fill(FcolorR+40, FcolorG+40, FcolorB+40)
rect(mcX, mcY, mW, mH)

line(mcX-mW/2, mcY, mcX+mW/2, mcY)

noLoop();

}

``````

This project demanded the use of variables because all of the facial variants were based on ratios involving the facial dimensions. These dimensions change with every click so the values for many dimensions of the face are derived from there.

# MECHANICAL PLOTTER DRAWINGS  MACHINE ZEN

BY LIA

Machine Zen by LIA is a generative art project that implements the precision a robotic arm, and the infinite variability a paint brush. This project beautifully combines the deterministic nature of computer generated art and the individual personality of a brushstroke to create art that looks human, a rarity amongst computer generated art. The algorithm that created this series of works likely involved a simple program that instructs the robotic arm (in this case an AxiDraw mechanical plotter) to move in a circle while slowly raising the brush upwards. Many of LIA’s works, similar to this one, are not inherently complex in their synthesis. Instead the mark of her work comes from the highly polished final product whose elegance is derived from the simplicity of the design. I believe LIA could build upon the minimal style she’s already perfected to create more complex pieces that extend beyond “proof of concept” or first-word art.

Demonstration of Mechanical Zen Created by Robotic Arm Holding Brush

## John Legelis p5.js Self Portrait

``````function setup() {
createCanvas(600, 600);
background(70,150,0);
}

function draw() {
ellipseMode(CENTER);
noStroke();
//face ellipse
fill(198,156,109);
ellipse(300,300,360,480);

//cover bottom half of face in green
fill(70,150,0);

//jaw trapazoid
fill(198,156,109);

//ears left the right
ellipse(110,300, 40,120);
ellipse(490,300, 40,120);

//eye whites left then right
fill(255,255,255);
arc(210,300, 70,50, PI, 0, OPEN);
arc(390,300, 70,50, PI, 0, OPEN);

//irises left then right
fill(0,118,163);
ellipse(210,288,24,24);
ellipse(390,288,24,24);

//pupils left then rigt
fill(0,0,0);
ellipse(210,288,12,12);
ellipse(390,288,12,12);

//lips
fill(212,62,92)
beginShape();
vertex(290,450);
vertex(300,455);
vertex(310,450);
vertex(345,460);
vertex(315,470);
vertex(285,470);
vertex(255,460);

endShape(CLOSE);

//nosebridge lines left then right
stroke(0);
strokeWeight(1)
line(290,300,288,400);
line(310,300,312,400);
//nose bubbles
noFill()
ellipse(285,412,24,24);
ellipse(315,412,24,24);
ellipse(300,416,15,15);
//blockthecircles
fill(198,156,109);
noStroke();
beginShape();
vertex(288,400);
vertex(312,400);
vertex(312,420);
vertex(288,420);
endShape(CLOSE);

//eyebrows left then right
fill(208,181,55);
rectMode(CORNERS);
rect(245,270,175,255);
rect(355,270,425,255);

//hair
beginShape()
vertex(120,200);
vertex(130,100);
vertex(160,60);
vertex(400,60);
vertex(420,120);
vertex(430,70);
vertex(440,120);
vertex(455,80);
vertex(454,120);
vertex(470,200);
endShape(CLOSE);
}
``````

As I created this portrait, I felt my intuition increasing with p5.js.  The p5.js.org website was very helpful for discovering new tools that would help with novel shapes. The hair was especially difficult to create.

## John Legelis Looking Outwards 1

### Topic: Some Technological Art or Design that has Inspired You

is one of the most powerful tools made possible by modern technology and with the internet has been made accessible to all. In order to complete this process an enormous amount of data needed to be processed and organized which required a team of nearly 500 people to implement at the scale it functions today. Because Google Earth is a relatively small part of the enormous Google enterprise, the organizational structure for this project was corporate and hierarchical. The Google Earth project was the first of its kind/scale and required novel software ideas to implement effectively. The idea for this project likely developed as an extension of one of the oldest visual data systems, physical maps. Google Earth is the current state of the art in cartography especially when it comes to coverage, as nearly nowhere is left unmapped. This project has been the foundation for many offshoots such as 3D photo spheres, street view, virtual reality voyages, and artists who use the natural beauty of the earth captured by satellites as part of their work.

I admire this project because it is a wonderfully useful and powerful tool that capitalizes on opportunities only made possible with computers. I admire Google Earth because it is an example of a seamless transfer from paper maps to technology without a barrier of entry and it creates the epitome of what maps can be.

Video demonstrating Google Earth being used in conjunction with virtual reality

Written by: JJ Legelis