Author: alcai@andrew.cmu.edu

Alice Cai Project 02

sketch-50.js

var eyeSize = 50;
var faceWidth = 250;
var faceHeight = 300;
var mouthWidth = 100
var mouthHeight = 50
var flufF = 50

function setup() {
    createCanvas(640,480);
}
 
function draw() {
    background(252, 136, 3);

    //body
    fill(234, 255, 0);
    strokeWeight(5);
    ellipse(width / 2, height, faceWidth,  faceHeight);


//face
    fill(234, 255, 0);
    strokeWeight(5);
    ellipse(width / 2, height / 2, faceWidth,  faceHeight);
    

//eyes
    fill(255);
    stroke(0);
    strokeWeight(0);
    var eyeLX = width / 2 - faceWidth * 0.2;
    var eyeRX = width / 2 + faceWidth * 0.2;
    ellipse(eyeLX + 10, height / 2, eyeSize + 10, eyeSize);
    ellipse(eyeRX + 10 , height / 2, eyeSize + 10, eyeSize);
   
    fill(0);
    stroke(0);
    strokeWeight(0);
    var eyeLX = width / 2 - faceWidth * 0.2;
    var eyeRX = width / 2 + faceWidth * 0.2;
    ellipse(eyeLX, height / 2, eyeSize, eyeSize);
    ellipse(eyeRX, height / 2, eyeSize, eyeSize);
   

//mouth
    fill(194, 66, 66);
    strokeWeight(0);
    ellipse(width / 2, height / 1.5, mouthWidth,  mouthHeight);

//fluff
    stroke(234, 255, 0);
    strokeWeight(30);
    line(width / 2.05, 80, width /2.1 , 120);

    stroke(234, 255, 0);
    strokeWeight(20);
    line(width / 2.5, 80, width /2.1 , 120);

     stroke(234, 255, 0);
    strokeWeight(10);
    line(width / 2.3, 50, width /2.1 , 120);

}


    
 
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(200, 250);
    faceHeight = random(250, 350);
    eyeSize = random(30, 60);
    mouthHeight = random(40, 60);
    mouthWidth = random(75, 100);
}

This is my chick! I first made variables for the values that I wanted to change. Then made a canvas and shapes. I used canvas width/height variable to control a lot of shape positioning. Finally, I set some values to random when click, and also set restraints so shapes don’t come out of the face.

Alice Cai LookingOutwards 02

Holger Lippman is a generative artist with a traditional visual art background. He was inspired by the motive to make art the same way that music was made. However, he wanted to stick with his painting roots but compares his creations to compositions and harmonies. ow, he paints with generative code.

corrosive landscape II

Corrosive Landscape II is a project by Holger Lippmann. It is a continuation of his project Corrosive Landscape. The generative work is based on landscape photography in Berlin. He used code to read color maps and image structures and the algorithm generated endless ellipses that overlap with each other to create horizontal patterns. The ellipses vary in opacity, thus creating a fading gradient around every central ellipse. The gradient also allows for color blending even though each shape is essentially its own color (no mixing gradients). I really like this work because from afar it doesn’t look like coded art and takes on an impressionist or abstract style. but up close you can see the ellipses and the more digital aspect of it. The colors in each piece are gorgeous and create a beautiful color palette. Although pieces are all very abstract, the ellipses and horizontal lines create the essence of a landscape. 

Published on July 11, 2012 10:22 am.

Corrosive Landscape II is a project by Holger Lippmann. It is a continuation of his project Corrosive Landscape. The generative work is based on landscape photography in Berlin. He used code to read color maps and image structures and the algorithm generated endless ellipses that overlap with each other to create horizontal patterns. The ellipses vary in opacity, thus creating a fading gradient around every central ellipse. The gradient also allows for color blending even though each shape is essentially its own color (no mixing gradients). I really like this work because from afar it doesn’t look like coded art and takes on an impressionist or abstract style. but up close you can see the ellipses and the more digital aspect of it. The colors in each piece are gorgeous and create a beautiful color palette. Although pieces are all very abstract, the ellipses and horizontal lines create the essence of a landscape. 

Alice Cai- Looking Outwards

Flow

Flow is a project by artist Tim Roden Broeker. Tim does “creative coding”, what he defines as the arts and experimental software development. He believes code is a powerful skill; Tim aims to explore the world of art and technology. He works with Processing and p5.js.

His project flow is an abstract, experimental short-film written with Processing. It was created for the PSD-Medienfassade, a large LED display mounted on the PSD- bank in Munster. The piece shows a flowing snake-like configuration floating in a three-dimensional space. The head of the figure twists and turns on the screen like a long, infinitely growing rope. The subject also rotates on an axis in space. Along with the visual, Tim has composed music to accompany the piece. The music is meant to be streamed from a special application from a smartphone. Tim decided to push the project to the next step and made it interactive. To do this, he had to switch from Processing to Javascript.

Alice Cai_Project01_Face


sketch

function setup() {
 createCanvas(600, 600);
 background("white");

}

function draw() {
	fill("tan");
	ellipse(300,300,280,350);

	fill("black");
	arc(300, 230, 283, 280, PI, TWO_PI);

	fill("black");
	rect(160,200,30,300);

	fill("black");
	rect(410,200,30,300);
	
	fill("black");
	rect(225,250,40,10);

	fill("black");
	rect(330,250,40,10);

	fill("black");
	ellipse(250,300,30,20);

	fill("black");
	ellipse(350,300,30,20);

	fill("white");
	ellipse(255,295,10,10);

	fill("white");
	ellipse(355,295,10,10);
	

	//fill("pink");
	//rect(250,400,100,10);

	fill("black");
	ellipse(300,80,100,100);

	fill("pink");
	ellipse(300,405,100,40);

	fill("tan");
	strokeWeight(0);
	ellipse(300,395,140,35);

	fill("pink");
	ellipse(240,335,50,20);

	fill("pink");
	ellipse(360,335,50,20);
	//arc(300, 400, 283, 280, -PI, TWO_PI);

	fill("tan");
	strokeWeight(1);
	triangle(300, 380, 300, 270, 330, 380);


	fill("black");
	arc(300, 620, 283, 280, PI, TWO_PI);



}