## Eliza Pratt – Looking Outwards 07

Refik Anadol is a Turkish media artist who specializes in “parametric data sculptures.” As demonstrated in his computational paintings, “Wind of Boston,” Anadol uses Processing.js to visualize site-specific data in the form of abstract art and installation. In this specific project, he analyzed the wind patterns around Boston by collecting data from the Boston Logan Airport. By taking factors like wind direction, speed, temperature, and noise fields into account, Anadol created a set of moving, coded displays to reflect these numbers. In his own words, he was motivated to find a “poetic way” to visualize the invisible. I admire this type of work as it finds a method of displaying data that is primarily expressive rather than informative. By embodying large quantities of ever-changing data in the form of an abstract painting, the audience is able to connect with the feeling of the wind patterns rather than the numbers behind it.

## Eliza Pratt – Butterfly Curve

sketch

``````/*
Eliza Pratt
Section E
elpratt@andrew.cmu.edu
Project 07
*/

//butterfly curve
//http://mathworld.wolfram.com/ButterflyCurve.html

var mX;
var mY;
var dis;
var wing = 4;
var size;
var col = 255;

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

}

function draw() {
background(0);
stroke("deeppink");

//draws pink circle
ellipse(width/2, height/2, width/2, height/2);

textFont("futura");
textAlign(CENTER);
textSize(18);
text("Click and Drag", width/2, 430);

//constrains mouse position to canvas size
mX = constrain(mouseX, 0, width);
mY = constrain(mouseY, 0, height);

//measures distance between curve center and mouse position
dis = dist(mX, mY, width/2, height/2);

//assigns distance to correspond with curve amplitude
size = map(dis, 0, width/2, 0, 50);

//draws butterflys
butterfly(wing/2, size/2, col/4);
butterfly(wing - 1, 0.75 * size, col/2);
butterfly(wing, size, col);

}

//draws butterfly with parameters to change
//frequency, amplitude, and color
function butterfly(b, a, c) {
var x;
var y;
stroke(c);
var points = 400; //number of points on curve
noFill();

beginShape();
//calculates many x and y coordinates using curve function
//plots vertices at coordinate points
for (var i = 0; i < points; i++) {
var t = map(i, 0, points, 0, TWO_PI);

//written notation: x = sin(t)[e^cos(t) - 2cos(4t) + sin^5 (t/12)]
x = width/2 + sin(t) *  a * (Math.pow(Math.E, cos(t)) - 2 * cos(b * t) + Math.pow(sin(t/12), 5));
y = height/2 + cos(t) * -a * (Math.pow(Math.E, cos(t)) - 2 * cos(b * t) + Math.pow(sin(t/12), 5));

vertex(x, y);
}
endShape(CLOSE);

}

function mouseDragged() {
//changes frequency of function based on mouse position
wing = map(dis, 0, width/2, 2, 6);
}

``````

Looking through all these curve functions has made me realize how much math I’ve forgotten in the past year! Nevertheless, I wanted to play around with some of the more complex curves from the website. I saw some pretty cool spirals with integrals but I couldn’t figure out the notation for javascript. The curve I made here is called a “butterfly curve”, but I overlapped a few of them with altered frequencies to explore some of the other cool shapes this function can produce. Drag your mouse around the canvas to check out the other curves! Dragging the mouse to any point on the circle will return it to a butterfly shape.

## Eliza Pratt – Looking Outwards – 06

Robbie Barrat is an AI researcher who works with generative adversarial networks (GANs) to create randomly computed works of art. By feeding a GAN pictures of a specific subject matter, the AI takes in random numbers to generate images that reflect similar features. Not only am I fascinated by this algorithm’s ability to create these portraits, but I admire the distinctive style that the AI has adopted. The random generation of colors, textures, and shapes produces a Dali-like surrealism in these images. While I’ve seen random computer generated art before, I had never considered that it could be programmed to capture the aesthetics of traditional painting. Discovering work as expressive and “human” as this project leads me to believe that AI will be a promising asset to modern artists.

## Eliza Pratt – abstract clock

``````/*
Eliza Pratt
Section E
elpratt@andrew.cmu.edu
Project-06
*/

var fluffX = []; // x position of fixed seeds
var fluffY = []; // y position of fixed seeds
var angle = 0; //angle of fixed seeds

var looseX = []; //x position of floating seeds
var looseY = []; //y position of floating seeds
var dir = []; //direction of floating seeds
var w = 3; //width of fluff

var centerX = []; //x center of each hour stem
var centerY = []; // y center of each hour stem

function setup() {
createCanvas(480, 380);

//fills arrays for fixed and floating
//seed positions with random numbers
for (var i = 0; i < 60; i++) {

//converts angle to distribute fixed seeds around the stem
var min = 270 + map(angle, 0, 60, 0, 360);
angle++;

//positions for fixed seeds

//positions for floating seeds
looseX[i] = random(0, width);
looseY[i] = random(0, height);

//direction of floating seeds
dir[i] = random(-0.5, 0.5);

}

var x = 28; //starting position for first stem

//fills array for stem position
for (var i = 0; i < 12; i++) {
centerX[i] = x;
x+= 38
if (i % 2) {
centerY[i] = random(80, 170);
}
else {
centerY[i] = random(180, 260);
}

}

}

function draw() {
background("lightBlue");
drawSeed(); //draws fixed seeds
drawFloat(); //draws floating seeds
drawStem(); //draws stems

}

//draws fixed and minute-based seeds
function drawSeed() {
stroke(255);
if (hour() == 12 || hour() == 0) {
var flowerX = 12;
}
else {
var flowerX = hour() % 12;
}

//draws seeds around hours that have not passed
for (var j = 12; j >= flowerX; j--) {
for (var i = 0; i < 60; i++) {
stroke(240);
line(centerX[j] + fluffX[i], centerY[j] + fluffY[i], centerX[j], centerY[j]);
noStroke();
ellipse(centerX[j] + fluffX[i], centerY[j] + fluffY[i], w, w);
}
}

//draws seeds around hour stem corresponding to the current minute
//depletes one seed for every minute passed
for (var i = 60; i > minute(); i--) {
stroke(240);
line(centerX[flowerX - 1] + fluffX[i], centerY[flowerX - 1] + fluffY[i], centerX[flowerX - 1], centerY[flowerX - 1]);
noStroke();
ellipse(centerX[flowerX - 1] + fluffX[i], centerY[j] + fluffY[i], w, w);

}
}

//draws floating seeds corresponding to current second
function drawFloat() {
noStroke();

//adds floating seed at random position for each second passed
for (var i = 0; i < second(); i++) {
ellipse(looseX[i], looseY[i], w, w);

//assigns each seed a direction
looseX[i] += dir[i];
looseY[i] += dir[i + 1];

//resets seed position if it floats off the canvas
if (looseX[i] > width) looseX[i] = 0;
else if (looseX[i] < 0) looseX[i] = width;
if (looseY[i] > height) looseY[i] = 0;
else if (looseY[i] < 0) looseY[i] = height;
}
}

//draws stems and centers
function drawStem() {
stroke(255);
for (var i = 0; i < 12; i++) {
line(centerX[i], centerY[i], centerX[i], centerY[i] + height);
ellipse(centerX[i], centerY[i], 8, 8);
}

}

``````

How to read: The 12 stems represent hours, and the seeds that are positioned around them are the minutes. The seeds deplete each minute around the stem corresponding to the current hour. The loose bits of fluff appear each second and float aimlessly until they reset each minute.

This has been my favorite assignment so far! Learning about arrays has made many of my ideas more tangible. I knew for this assignment that I wanted to do something pictorial, and I originally considered using balloons or planets. Nevertheless, I’m very happy with how this clock turned out.
Early sketches:

## Eliza Pratt – Looking Outwards 05

Zacharias Reinhardt is a German 3D artist who uses Blender 3D software to create conceptual digital illustrations. Many of his works, such as Final Takeoff (shown above), convey a strong sense of storytelling that is heightened by the realism of fully rendered models. Unlike 2D illustrations, these graphics allow you to view the artwork from many angles and fully immerse yourself within the 3D space created.

A 3D rendering of the car in Reinhardt’s Final Takeoff allows you to experience his work from any angle (zoom in to see the interior).

While I’ve always been loyal to the art of traditional illustration, seeing works such as these truly heighten visual storytelling without losing any sense of the artist’s expressiveness. By using Blender software to create these otherworldly graphics, Reinhardt brings fantasy a little closer to reality.

## Eliza Pratt – Project 05

``````/*
Eliza Pratt
Section E
elpratt@andrew.cmu.edu
Project 05
*/

function setup() {
createCanvas(600, 500);
background(103, 196, 92);

for (y = -5; y < height; y+=35) {
//even rows
if (y%2 == 0) {
for (x = 15; x < width; x+=30) {
}
}
//odd rows
else {
for (x = 15; x < width; x+=30) {
}
}
}
noLoop();
}

push();
translate(x, y);

var bodyY = y + 20; //body origin
var bodyW = 50; //size of body

noFill();
strokeWeight(2);
fill(0);

//body
noStroke();
fill(255, 0, 0);
ellipse(x, bodyY, bodyW, bodyW);

//wing line
stroke(0);
strokeWeight(2);
line(x, bodyY - bodyW/2, x, bodyY + bodyW/2);

//spots
fill(0);
ellipse(x - 15, bodyY, 8, 8);
ellipse(x - 10, bodyY - 15, 8, 8);
ellipse(x - 8, bodyY + 15, 8, 8);
ellipse(x + 15, bodyY, 8, 8);
ellipse(x + 10, bodyY - 15, 8, 8);
ellipse(x + 8, bodyY + 15, 8, 8);

pop();

}
``````

This was the first time I’ve created a function to help with my code! I was trying to find a way to have the individual ladybugs rotate at random angles, but I got too confused. I probably wouldn’t put this wallpaper in my house, but maybe it would make a nice paper napkin print?

Early sketches:

## Eliza Pratt – Looking Outwards 04 – Section E

Robert Henke’s audiovisual installation, Spline, uses lasers and computer generated sound to evoke a dreamlike experience.

Robert Henke is an engineer and audiovisual artist from Germany. Using a complex system of physics, lights, and synthesizers, Henke creates surreal installations that feel both futuristic and otherworldly. In his 2017 installation, Spline, he couples lasers with computer generated sounds to emulate patterns reminiscent of astronomical phenomena. Using the Max programming language, Henke has developed his own synthesizers, such as the Granulator II. Operating through “quasi-synchronous granular synthesis,” these instruments allow the user to modify the pitch and volume of grains to create unique sounds. I admire Henke for his ability to transform light, sound, and space using both scientific and artistic methods. The sound he incorporates in his installations are in perfect harmony with the mesmerizing visuals, working together to create an ethereal, omnipresent experience.

## Eliza Pratt – Project 04

``````/*
Eliza Pratt
Section E
elpratt@andrew.cmu.edu
Project-04
*/

function setup() {
createCanvas(400, 300);
}

function draw() {
background(0);

var y = 0;
var x = 0;
var y1 = height/2;
var x1 = width/2
var y2 = height/4;
var x2 = width/4;

//dark gray curves
for (var z = 0; z < 35; z++) {
stroke(180 - x2/2);
//bottom left curve
line(width - x2, height, 0, height - y2);
//top right curve
line(x2, 0, width, y2);

x2 += 6;
y2 += 6;

}

//gray center curves
for (var i = 0; i < 44; i++) {
stroke(x/2);
//bottom center curve
line(width - x, height - y, x, height);
//top center curve
line(x, y, width - x, 0);

x += 7;
y += 7;
}

//white curves
for (var w = 0; w < 20; w++) {

stroke(255);
//bottom right curve
line(x1, height, width, height - y1);
//top left curve
line(width - x1, 0, 0, y1);

x1 = x1*1.04;
y1 = y1*1.04;

}

}

``````

Although confusing at first, I had a lot of fun with this assignment! While it’s frustrating when the lines don’t map out the way you want them to, it was always a surprise when I refreshed my browser. I also played around with adjusting the stroke color in my for loops, which led to some pretty cool gradients!

## Eliza Pratt – Project-03

``````/*
Eliza Pratt
Section E
elpratt@andrew.cmu.edu
Project-03
*/

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

function draw() {

noStroke();

//creates color variables for background based on mouse position
var bG = (mouseX/width) * 255;
var bB = (mouseY/height) * 255;
background(100, bG, bB);

//block of color that moves with mouseX
fill(200, bG, bB);
rect(0, 0, mouseX, 480);

//starting positions for vertical and horizontal lines
var y1 = 45;
var x1 = 0;

//variables for line weight and angle based on mouse position
var hWidth = (mouseY/width) * 45
var angle = (mouseX/width) * 360
fill(255);

////////ROTATING LINES///////
push();
//transforms vertical lines to rotate about the center
translate(width/2, height/2);
//draws vertical lines
for(var i = 0; i < 20; i++) {
fill(0);
rect(x1 -50 - width/2, 0, hWidth, 800);
x1+=50;
}
pop();

/////////HORIZONTAL LINES////////
for(var i = 0; i < 9; i++) {
rect(width/2, y1, width, hWidth);
y1+=50;
}

}
``````

Compared to the last two weeks, I found this project to be the most challenging since it was so open ended. While this sketch was originally intended to be a grid with fixed horizontal and rotating vertical lines, I ended up with this just by commenting out the “recMode(CENTER) and letting the black lines do as they please! This turned out way cooler than I expected and I was pleasantly surprised with how the colors go together.

## Eliza Pratt – Looking Outwards 03

Elona Van Gent’s 3D printed sculpture, Wheelclawsteeth, demonstrates how digital fabrication can be used to create works that replicate naturally occurring or handmade forms. With the use of a Laminated Object Manufacturing machine (or LOM), Elona crafts “alluring and discomforting creatures” with laser-cut paper. Not only do I find her work captivating in a Guillermo-del-Toro-like fashion, but I deeply admire Van Gent’s ability to push the boundaries of computer generated sculptures to create work that could not exist in an art world void of technological advancements. By developing sculptures that appear naturally grotesque with the use of machinery, Elona challenges the existing polarity between digital fabrication and traditional sculpture. I find this to be a commendable objective in a climate where computer generative art is regarded as separate and distinctive from hand-crafted sculptures and installations.