Author: Theresa

Project 02

For my project, I wanted to create a face who’s expression of shock varies every time the mouse is pressed.

sketch
var faceWidth = 300;
var faceHeight = 500;
var eyeSize = 30;
var faceColour = 196
var mouthWidth = 30
var mouthHeight = 50
var background1 = 227
var background2 = 181
var background3 = 189

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

function draw() {
    background(background1, background2, background3)
    noStroke();
    fill(faceColour,89,114);
    beginShape(); // face
    curveVertex(width/2, (height/2) - (faceHeight/2));
    curveVertex(width/2, (height/2) - (faceHeight/2));
    curveVertex((width/2) - (faceWidth/4), (height/2) - (3*faceHeight/8));
    curveVertex((width/2) - (3*faceWidth/8), (height/2) - (faceHeight/8));
    curveVertex((width/2) - (faceWidth/2), (height/2) + (faceHeight/8));
    curveVertex((width/2), (height/2) + (faceHeight/4));
    curveVertex((width/2) + (faceWidth/2), (height/2) + (faceHeight/8));
    curveVertex((width/2) + (3*faceWidth/8), (height/2) - (faceHeight/8));
    curveVertex((width/2) + (faceWidth/4), (height/2) - (3*faceHeight/8));
    curveVertex(width/2, (height/2) - (faceHeight/2));
    curveVertex(width/2, (height/2) - (faceHeight/2));
    endShape();
    fill(255, 228, 218)
    circle((width/2) - (faceWidth/8), (height/2) - (faceHeight/8), eyeSize); // left eye
    circle((width/2) + (faceWidth/8), (height/2) - (faceHeight/8), eyeSize); // right eye
    ellipse((width)/2, (height/2) + (faceHeight/8), mouthWidth, mouthHeight)
}

function mousePressed() {
    faceWidth = random(225, 400)
    faceHeight = random(350, 600)
    eyeSize = random(10,35)
    mouthWidth = random(20, 50)
    mouthHeight = random (20, 50)
    faceColour = random(100, 250)
    background1 = random(1, 255)
    background2 = random(1, 255)
    background3 = random(1, 255)
}

LO2-Generative Art

Meander – Robert Hodgin

“Meander is a procedural system for generating historical maps of rivers that never existed”

I find this project especially interesting and inspiring because it is a representation of art that transcends time. Hodgin not only uses animations of rivers on a map, but also 3d representations that depict the effect of these rivers on the surrounding terrain, as well as the overall topography of the area. As an architecture student i find this super unique because it combines animation and art with useful information that can make predictions based on the condition of the earth.

The algorithm of this piece seems to involve the usage of vectors to produce bends that form the curves of the appearing rivers. Hodgin was inspired by the artist Harold Fisk, who first created these maps that visualize time along with engineers in the US Army Coup. in 1944. It’s fascinating that now, with more evolved technology, idealizations of many artists in the past can be produced by later generations.

Meander

Project 1: My Self Portrait

ty.sketch
function setup() {
    createCanvas(300, 500);
    background(255,255,255);
    text("p5.js vers 0.9.0 test.", 10, 15);
}

function draw() {
    fill(255,255,255)
    circle(width/2,height/2,150);
    circle(120,250,40)
    circle(180,250,40)
    fill(238,202,179)
    circle(150,260,10)
    fill(0)
    ellipse(123,250,8,8)
    ellipse(177,250,8,8)
    line(140,250,160,250)
    line(100,250,75,240)
    line(200,250,225,240)
    fill(255,192,203)
    ellipse(95,275,25,15)
    ellipse(205,275,25,15)
    noFill()
    bezier(150,190,110,180,145,260,75,240);
    bezier(150,190,190,180,155,260,225,240)
    ellipse(67,250,16,26)   //ear
    curve(58,235,68,245,68,255,58,265)
    curve(242,235,232,245,232,255,242,265)
    ellipse(233,250,16,26)
    bezier(67,237,85,130,215,130,233,237)
    bezier(140,280,145,288,155,288,160,280)
    bezier(67,263,60,288,56,290,40,320)
    line(40,320,143,337)
    bezier(233,263,240,288,244,290,260,320)
    line(260,320,157,337)
    line(143,325,143,337)
    line(157,325,157,337)
    fill(162,228,184)
    quad(143,337,120,355,180,355,157,337)
    fill(255)
    triangle(143,337,150,350,157,337)
    fill(185,38,54)
    square(146,171,8)
    quad(146,171,130,166,130,184,146,179)
    quad(154,171,170,166,170,184,154,179)
}

LO1: My Inspiration

During my entire high school, I was extremely interested in illustration and design and had been searching for art school vlogs when I came across a software tech program in the Rhode Island School of Design. The specific Youtube video I was watching was of Tiffany Weng, an illustration major student in the school and had been developing a project dealing with baby heart monitors. I had always admired her work since her illustrations had her unique and cohesive style and she often incorporated product design into her illustrations. 

This was the first time I was exposed to computational aspects in the field of design. The prompt of the project was to design and make a project that had to deal with some sort of computer programming. Tiffany had programmed and built a baby heart monitor so that if a baby’s heart rate passes a certain frequency, the lights will light the monitor up. Even though it was created in an introductory course to software technology during wintersession and dealt mostly with basic programming, I was intrigued by the completion of the project and the final results. 

After the programming portion of the project was completed, she then moved on to designing the execution, which were first harnesses that later evolved into adjustable anklets for babies to wear. She designed several variations of the anklets in cute animal packaging and integrated the monitor in a way that allowed the animal ears to light up then the heart beat became a dangerous frequency. 

I think that overall, to high school me who knew nothing about computers and programming, this shifted my view of art and design from purely aesthetics and narrative to production and invention, and ultimately steered me into the path of architecture.