Author: enicklas@andrew.cmu.edu

Emma N-M LO-02

Generative Knitting Design Tools by Dr. Woohoo (2016)

Dr. Woohoo created a generative work where it captured color palettes and turned them into patterns and applied it to a knitted design, such as sneakers. I enjoy the fun color palettes that are created and the patterns the come about from those colors. The patterns are typically wavy lines intersecting to create an interesting visual. I think it is really cool how the pattern that is created gets interpreted another way when it is knitted into a shoe. You can see the colors are the same, but the knitted pattern is not clearly the same as the generative pattern. The color palettes are captured through colors in the world, and then an algorithm is used to generate a pattern from those colors to knit onto a design. I think Dr. Woohoo’s artistic sensibilities comes from knowing how to create interesting color palettes and know when he has an eye-catching pattern.

Emma Nicklas-Morris Project-02 (Variable Face)

Emma’s Variable Faces

/* 
Emma Nicklas-Morris
Section B
enicklas@andrew.cmu.edu
Variable Faces
*/

var faceShapeX = 280;
var faceShapeY = 330;
var hairLen = 300;
var mouthW = 120;
var mouthH = 80;
var noseX1 = 215;
var noseY1 = 255;
var noseX2 = 240;
var noseY2 = 205;
var noseX3 = 265;
var noseY3 = 255;
let colors = ['blue', 'black', 'green', 'brown', 'grey'];
let color = 'black';
var bodyX = 200;
var bodyY = 400;
let bodColor = "red";
let bodColors = ['orange', 'yellow', 'navy', 'purple', 'pink'];

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

function draw() {
    background("lightblue");

    // Body
	fill(bodColor);
	ellipse(width/2, height - 50, bodyX, bodyY);

	// Face shape
	strokeWeight(0);
	fill('#E0AC69');
	ellipse(width / 2, width / 2, faceShapeX, faceShapeY);
	var eyeLX = width / 2 - faceShapeX * 0.25;
    var eyeRX = width / 2 + faceShapeX * 0.25;

	// Mouth
	fill('#E77471');
	strokeWeight(1);
	arc(width / 2, height/2, mouthW, mouthH, 0, PI); 

	// Nose 
	fill('#C58917');
	strokeWeight(0);
	triangle(noseX1, noseY1, noseX2, noseY2, noseX3, noseY1); 

	// White of eyes
	strokeWeight(2);
	fill('white');
	ellipse(eyeLX, height/4, 50, 25);  
	ellipse(eyeRX, height/4, 50, 25);

	// Pupils
	fill(color);
	ellipse(eyeLX, height/4, 20, 20);  
	ellipse(eyeRX, height/4, 20, 20);

	// Hair
	strokeWeight(0);
	arc(300, 155, 250, 230, PI + QUARTER_PI, TWO_PI + QUARTER_PI); 
	arc(260, 200, 340, 290, PI, PI + HALF_PI, OPEN);
	rect(360, 180, 65, hairLen);
	rect(80, 140, 45, hairLen + 40);

}

function mousePressed() {
	faceShapeX = random(230, 300);
	faceShapeY = random(320, 370);
	hairLen = random(100, 500);
	mouthW = random(10, 100);
	mouthH = random(10, 50);
	noseX1 = random(210, 220);
    noseY1 = random(250,260);
    noseX2 = random(235, 245);
    noseY2 = random(200, 210);
    noseX3 = random(260, 270);
    color = random(colors);
    bodColor = random(bodColors);
    bodyX = random(200, 300);
}

My process was to start with a hard coded face and then define variables and change them slightly. I think my final product is pretty good for someone who struggles with making illustrations AND faces. I struggled with trying to figure out how to change the hair more drastically as the facial shape changes than just changing the hair length.

Emma Nicklas-Morris Project-01 Face

Emma’s self portrait

/* 
Emma Nicklas-Morris
Section B
enicklas@andrew.cmu.edu
Self-portrait
*/

function setup() {
	createCanvas(600,600);
	background('#ADD8E6');
	// Face shape
	strokeWeight(0);
	fill('#E0AC69');
	ellipse(300, 300, 280, 330); 
	// Mouth
	fill('#E77471');
	arc(300, 365, 120, 80, 0, PI); 
	// Nose 
	fill('#C58917');
	triangle(275, 325, 300, 275, 325, 325); 
	// White of eyes
	strokeWeight(2);
	fill('white');
	ellipse(240, 240, 50, 25);  
	ellipse(360, 240, 50, 25);
	// Pupils
	fill('black');
	ellipse(240, 240, 20, 20);  
	ellipse(360, 240, 20, 20);
	// Hair
	strokeWeight(0);
	arc(363, 225, 250, 230, PI + QUARTER_PI, TWO_PI + QUARTER_PI); 
	arc(320, 270, 340, 290, PI, PI + HALF_PI, OPEN);
	rect(420, 250, 65, 300);
	rect(140, 210, 45, 340);

}

The hardest challenge for me besides not being able to get a more accurate depiction of myself with only using about 10 shapes was figuring out how to use arc. Specifically the parameters start and end.

Emma N-M LO-01


A Day in the Life of Americans is a data visualization project that tracks how 1,000 Americans spend their time throughout the day. This visualization runs for 24 hours starting at 4AM and uses moving dots to show how people move from different activities. I was liked this project because it is a simple but informative way to present how Americans race from one thing to the next. This project was created by Nathan Yau and he used the American Time Use Survey to collect his data before creating a model of time-varying Markov chain visual. It is unknown whether Yau created the data visual from scratch or with the help of commercial software. Yau also researched how American spends their time compared to you, the viewer, and what people spend their time on depending on sex and age. From a marketing and advertisment stand point, this data provides insights into possible consumers’ likes, dislikes and interests. Marketing materials have the potential to be targeted to specific groups of people. 

A Day in the Life of Americans by Nathan Yau

Emma N-M LO-1 (test)

Hello world.

sketchMaybe

function setup() {
    createCanvas(320, 240);
    background(220);
}

function draw() {
    rect(10, 10, 40, 50);
}

sketch

function setup() {
    createCanvas(200, 202);
    background(220);
    text("p5.js vers 0.9.0 test.", 10, 15);
}

function draw() {
	rect(50,50, 30, 20);
	fill("blue");
	text("Hello world!", 70, 30);
	ellipse(100, 100, 50, 30);
}