Category: SectionD

Second Project

here is my silly little thing $$

sketch/a>

My favorite part was randomizing colors and being surprised when the program generated nice color pallets.

//Evette LaComb
//Section D

var chin = 120;
var nose = 1;
var shirt = 150;
var hairR = 0;
var hairG = 0;
var hairB = 0;
var skinR = 0;
var skinG = 0;
var skinB = 0;
var mouthY = 130;
var mouthW = 30;
var mouthH = 5;
var eyeD = 20;

function setup() {
    createCanvas(200, 200);
}

function draw() {
    noStroke(); //apply to all bellow 
    background(195, 216, 212);

    fill(hairR -70, hairG -70, hairB -70); //HAIR COLOR  
        rect(35, 50, 130, 150); //background hair 
    fill(skinR +70, skinG -70, skinB -70); //SHIRT SHADE 
        ellipse(100, 200, shirt, 150)//shirt
    fill(skinR -70, skinG -70, skinB -70); //SKIN SHADOW
        triangle(60, 125, 140, 125, 100, 175); //neck
        ellipse(50, 93, 45, 45); //ear left
        ellipse(150, 93, 45, 45); //right ear

    fill(skinR, skinG, skinB); //FACE 
        ellipse(100, 90, 100, chin);//face
    fill(195, 216, 212); //forhead cover (hide top of head poking out of bangs)
        ellipse(100, 25, 100, 100)

    fill(hairR, hairG, hairB);
        ellipse(70, 64, 85, 55); //left hair Bang
        ellipse(130, 64, 85, 55); //right hair Bang

    fill(hairR -70, hairG -70, hairB -70); //Mouth and back hair shade 
        ellipse(100, mouthY, mouthW, mouthH); //mouth
    fill(skinR +70, skinG -70, skinB -70); //same shade as shirt 
        ellipse(100, 115, 20, 20); //nose

    fill(skinR -70, skinG -70, skinB -70); //EYE BAG 
        ellipse(75, 106, eyeD +5); //left eye
        ellipse(125, 106, eyeD +5); //right eye
    fill(195, 216, 212); //WHITES
        ellipse(75, 103, eyeD); //left eye
        ellipse(125, 103, eyeD); //right eye
    fill(hairR -120, hairG -120, hairB -120); //PUPIL
        ellipse(75, 102, eyeD -7); //left eye
        ellipse(125, 102, eyeD -7); //right eye
}

function mousePressed() {
    chin = random(120, 150);
    shirt = random(150, 200);
    hairR = random(0, 255);
    hairG = random(0, 255);
    hairB = random(0, 255);
    skinR = random(0, 255);
    skinG = random(0, 255);
    skinB = random(0, 255);
    mouthY = random(130, 145);
    mouthW = random(10, 35);
    mouthH = random(5, 10);
    eyeD = random(10, 30);
}

lo: generative art

One computational art project I admire is actually from a previous design professor of mine, Kyuha (Q) Shim. Much of his work operates in the realm between art, design, and technology, but I am really drawn to his experiments with typographic algorithms. What I find admiring is how Q approaches iterations and experimentation. He says the benefit to using computational systems is the themes you can see across a series of iterations that would otherwise take a long time. The ability to find these motifs then allows designers to create more solutions and observe broader systems than we can without technology. I’m not sure of the specifics of how he generated these designs, but I would assume it incorporates some image recognition based on type and qr codes. These experiments reflect the practical nature of Q and have a lot of potential both in technology and artistic aspects.

More info here

Looking Outwards 02

LIA’s work draws me in because it is outstandingly compelling, and every piece has thought behind it. Her “Four Seasons” series is most interesting personally because of the shapes and colors she uses, as well as the details in movement for each season; slow, sharp, and downward movement for a snowy Winter, as opposed to the bright, warm, and growing/spiraling motion for spring, etc. The artistic sense is undeniable in LIA’s projects as her eye for color and composition as stated above is incredible.

In terms of the algorithm that generates her work, LIA’s animations are generated randomly as stated in the beginning of her videos, so there is no repetition. Moreover, it seems that she uses many variables for color, shapes, and motion because the website states that she codes with a fluidity. This implies that she may not have a specific picture in mind before coding, and declaring her own variables would allow for her to make changes to the entire piece in a convenient manner. I suppose this is especially useful in deciding colors, since I know from experience that even the slightest change in value or hue can enhance or mar the product.

“Winter” by LIA, the second part of a four-part series on seasons that showcases her ability to code and eye for shape, color, and motion
“Spring” by LIA, the third edition to the “Four Seasons” series that showcases her ability to code and eye for shape, color, and motion

project 2: variable faces

I had a fun time planning out all the changing parts of these animal faces and figuring out how to use color type variables for fur tone was interesting!

Planning each variable feature
variable animal faces
// isis berymon section D

function setup() {
    createCanvas(640, 480);
    frameRate(10);
    background(245, 232, 215); //biege
}

function draw() {
}

function mousePressed() {
    background(245, 232, 215); //biege
    var face;

    //face color generator
    if(random(3) <= 1){
        face = color(145, 191, 217); //blue
    } else if(random(3) <= 2) {
        face = color(181, 145, 217); //purple
    } else {
        face = color(232, 149, 201); //pink
    }
    
     //face
    fill(face);
    noStroke();
    ellipse(width/2, height/2, 270, 250);
    //nose
    fill(30);
    ellipse(290, 270, 60, 50);
    ellipse(350, 270, 60, 50);
    fill(face);
    ellipse(287, 265, 60, 50);
    ellipse(353, 265, 60, 50);
    fill(43, 34, 40);
    triangle(320, 270, 310, 250, 330, 250);

    //ear generator
    if(random(3) <= 1){
        //cat ears
        fill(face);
        triangle(200, 190, 230, 80, 330, 200);
        triangle(350, 190, 410, 80, 440, 200);
    } else if(random(3) <=2) {
        //dog ears
        fill(face);
        ellipse(250, 150, 80, 120);
        ellipse(390, 150, 80, 120);
    } else {
        //bunny ears
        fill(face);
        ellipse(250, 150, 60, 200);
        ellipse(390, 150, 60, 200);
    }

    //neutral eyes
        fill(30);
        ellipse(260, 220, 60, 80);
        ellipse(380, 220, 60, 80);
        fill(200);
        circle(250, 210, 30);
        circle(370, 210, 30);

    //eye expression generator
    if(random(3) <= 1) {
        //happy eyes
        fill(face);
        ellipse(260, 260, 60, 30);
        ellipse(380, 260, 60, 30);
    } else if(random(3) <=2) {
        //smug eyes
        fill(face);
        rect(230, 180, 60, 30);
        rect(350, 180, 60, 30);
    }
}

Project 1: My Self Portrait

The most challenging part was figuring out the math for the arc shapes and matching them up to the rest of my face.

sketch
/*
    Joan Lee
    Section D
*/

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

function draw() {
    background(200);

    //hair behind face
    noStroke();
    fill(53, 25, 15);
    rect(65, 100, 170, 300);
    ellipse(70, 260, 70, 350);
    ellipse(230, 260, 70, 350);     //background hair
    ellipse(115, 120, 120, 130);
    ellipse(185, 120, 120, 130);
  
     //body
    fill(223, 205, 230);
    triangle(150, 200, 230, 400, 70, 400);

    //face
    fill(250, 230, 180);
    noStroke();
    quad(75, 100, 225, 100, 230, 230, 70, 230);     //head
    quad(70, 230, 230, 230, 165, 285, 135, 285);    //jaw

    //eyebrows
    stroke(73, 45, 35);
    strokeWeight(5);
    line(171, 150, 206, 152);
    line(94, 152, 129, 150);

    //eyes
    fill(245, 245, 245);
    stroke(0);
    strokeWeight(3);
    arc(110, 180, 35, 25, PI, TWO_PI);
    arc(185, 180, 35, 25, PI, TWO_PI);  //eyeballs and lash line
    fill(63, 35, 11);
    stroke(0);
    strokeWeight(2);
    circle(111, 177, 17);
    circle(184, 177, 17);   //pupils and irises
    fill(255, 225, 215);
    stroke(205, 179, 156);
    strokeWeight(1);
    ellipse(110, 183, 35, 7);
    ellipse(185, 183, 35, 7);   //undereye silkworms

    //nose
    triangle(148, 180, 165, 220, 132, 220);

    //mouth
    stroke(255, 210, 200);  //lips
    strokeWeight(5);
    fill(255);
    arc(148, 233, 70, 50, 0, PI, CHORD);

    //front hair
    stroke(53, 25, 15);
    strokeWeight(1);
    noFill();
    arc(70, 100, 70, 200, TWO_PI, PI - HALF_PI);
    arc(230, 100, 80, 240, PI - HALF_PI, PI);
    arc(240, 100, 150, 190, PI - HALF_PI, PI);
    arc(100, 100, 100, 80, TWO_PI, PI - HALF_PI);
    arc(200, 100, 100, 80, PI - HALF_PI, PI);   //lil baby hairs
    noStroke();
    fill(53, 25, 15);
    arc(60, 95, 110, 170, TWO_PI, PI - HALF_PI);
    arc(230, 100, 80, 170, PI - HALF_PI, PI);   //side bangs
}

Lo My Inspiration

Just Dance is a party game staple that has reached millions of users worldwide with just one instruction: just dance! I admire the intention of the game, which is to allow users to have fun gaming without having to slouch on the couch for hours. As someone who plays various games with friends, I appreciate when they don’t cause me back and shoulder pain. Additionally, I remember being absolutely amazed by the movement tracking my first time playing, and wondering how the game knew when I was lifting the wrong arm or kicking too
late (I’m not the greatest dancer). Just Dance was created by Ubisoft Paris in six months using Perforce Helix Core, a commercial software they have been using since 2001. The creators were inspired by Dance Dance Revolution, another popular dancing game that had players stepping on arrows to the beat of music. The body tracking in this game points to the potential of technology that extends to a variety of fields, including games, animation, health, and education.
https://justdancenow.com/
Ubisoft 2009
Reference: Parkin, S. (2013, October 27). The science of just dance. Eurogamer.net. Retrieved September 2, 2022, from https://www.eurogamer.net/the-science-of-just-dance-article

blog 02

Screen shot from n-e-r-v-o-u-s.com

Section D 

Evette LaComb

Nervous System – Jessica Rosenkrantz

  • Regarding the project, what do you admire about it, and why do you admire these aspects of it?
    • The company states they are, “a generative design studio that works at the intersection of science, art and technology”. They have several concepts highlighted on their site, but many utilize an interactive program to create one of a kind jewelry pieces for the customers. The first item I looked at was a custom earring made out of a honeycomb structure. The program allowed me to choose the outline of the cells, divide the cells, as well as apply “forces” that swirled and manipulated the cells further. What I admire most is how they allow the customer to have a creative hand in the final product they are receiving. The concept not only spreads the work of the creator, Jessica Rosenkrantz, or that of  the program alone, but the interaction between the three.
  • What do you know (or what do you suppose) about the algorithm that generated the work?
    • I would guess the program I interacted with used a visual generation system. The forces probably manipulated the arks and positions of the visual features to some mathematical formula. The Interface interacted with the human to change variables in the code that displayed the final product generated on the side display.  
  • In what ways are the creator’s artistic sensibilities manifest in their algorithm?
    • Jessica Rosenkrantz, is credited as the founder. From looking at the work on the site, I think there’s a clear inspiration from the interaction of computational and organic creation. The designs are based on grid systems that end up looking almost like a ptree dish, or growing plant. In particular one of their projects was originally developed to simulate the generation of veins in leaves, and later became a tool for art.

https://n-e-r-v-o-u-s.com/projects/sets/networks/

project 1: my self portrait

self portrait (minecraft inspired :D)
function setup() {
    createCanvas(500, 400);
}

function draw() {
    //skin (all fills are shades of beige)
    background(217, 193, 174);
    noStroke();
    fill(217, 198, 182);
    ellipse(250, 250, 500, 594);
    fill(230, 210, 193);
    ellipse(250,250, 472, 547);
    fill(245, 219, 198);
    ellipse(250, 250, 446, 492);
    fill(255, 233, 214);
    ellipse(250, 250, 428, 466);
    //nose
    fill(207, 188, 173);
    circle(226, 356, 38);
    circle(266, 356, 38);
    fill(255, 233, 214);
    ellipse(246, 354, 74, 61);
    //freckles
    fill(120, 105, 80);
    circle(415, 339, 3);
    circle(367, 366, 3);
    circle(357, 335, 3);
    circle(302, 324, 3);
    circle(261, 341, 3);
    circle(234, 384, 3);
    circle(232, 295, 3);
    circle(177, 327, 3);
    circle(155, 355, 3);
    circle(114, 327, 3);
    circle(93, 366, 3);
    circle(51, 288, 3);
    circle(357, 226, 3);
    //right eye
    fill(77, 69, 65); //dark grey
    rect(351, 246, 63, 29);
    ellipse(351, 275, 126, 59);
    fill(235, 226, 219); //off white
    rect(347, 250, 63, 29);
    ellipse(347, 279, 126, 59);
    fill(110, 115, 93); //various shades of green-brown
    circle(356, 277, 54);
    fill(92, 87, 58);
    circle(356, 277, 48);
    fill(59, 55, 37);
    circle(356, 277, 34);
    fill(222, 216, 189);
    circle(351, 269, 12);
    //left eye
    fill(77, 69, 65); //dark grey
    rect(83, 246, 63, 29);
    ellipse(146, 275, 126, 59);
    fill(235, 226, 219); //off white
    rect(87, 250, 63, 29);
    ellipse(150, 279, 126, 59);
    fill(110, 115, 93); //various shades of green-brown
    circle(151, 277, 54);
    fill(92, 87, 58);
    circle(151, 277, 48);
    fill(59, 55, 37);
    circle(151, 277, 34);
    fill(222, 216, 189);
    circle(146, 269, 12);
    //right eyebrow
    fill(56, 41, 28); //dark brown
    rect(281, 217, 52, 8);
    rect(307, 203, 64, 14);
    rect(353, 218, 63, 3);
    rect(286, 210, 21, 7);
    fill(82, 60, 41); //mid brown
    rect(401, 221, 21, 4);
    rect(371, 209, 36, 9);
    //left eyebrow
    rect(77, 221, 21, 4);
    rect(83, 218, 63, 3);
    fill(56, 41, 28); //dark brown
    rect(92, 210, 36, 8);
    rect(128, 206, 64, 12);
    rect(166, 218, 52, 7);
    rect(192, 212, 21,6);
    //hair layer 1 - light brown
    fill(102, 79, 59);
    rect(0, 187, 24, 180);
    rect(17, 99, 44, 99);
    rect(71, 35, 54, 133);
    rect(195, 63, 36, 102);
    rect(270, 39, 63, 61);
    rect(405, 100, 42, 47);
    rect(434, 147, 38, 87);
    rect(486, 252, 14, 91);
    //hair layer 2 - mid brown
    fill(82, 60, 41);
    rect(0, 187, 17, 99);
    rect(0, 99, 53, 88);
    rect(17, 55, 56, 44);
    rect(73, 99, 36, 66);
    rect(73, 40, 48, 59);
    rect(0, 0, 500, 46);
    rect(147, 39, 56, 24);
    rect(203, 39, 23, 120);
    rect(226, 87, 44, 44);
    rect(225, 39, 83, 48);
    rect(333, 39, 87, 63);
    rect(333, 101, 46, 62);
    rect(419, 38, 81, 105);
    rect(447, 143, 53, 83);
    rect(472, 224, 28, 28);
    //hair layer 3 - dark brown
    fill(56, 41, 28);
    rect(0, 55, 17, 101);
    rect(0, 0, 73, 59);
    rect(73, 0, 362, 28);
    rect(213, 24, 49, 28);
    rect(435, 0, 65, 103);
    rect(472, 103, 28, 71);
}

Project 1: My Self Portrait

The most interesting about the project is using simple elements to create a meaningful drawing.

sketch
//Elmy Chen Section D

function setup() {
    createCanvas(500, 500);
    background(220);
}

function draw() {
    fill (255,160,122);
    ellipse(250,250,350,410);

    fill(0,0,0);
    ellipse(150,200,40,40);
    ellipse(320,200,40,40);

    fill(255,0,0);
    triangle(220,400,280,400,250,420);

    fill(139,69,19);
    rect(50,45,90,400);
    rect(350,45,90,400);
    rect(140,45,110,100);
    rect(250,45,110,100);

}

LO: My Inspiration

Soungwen Chung is a multidisciplinary artist and in the artwork Gestures of Becoming-With, she explored a future with the communication between humans and machines. This project is super interesting for me because the author was brave enough to use groundbreaking technologies in a different field such as art. She used a robot hand to create the artwork which took her about 3 months. The artwork was created during the COVID-19 quarantine lockdown. The robot imitated her brush/marker strokes while she was painting with her hand, which interests me the most. To my knowledge, the author did not develop any custom software. Instead, she used some commercial software that was available in the market.

Reference
Chung, Soungwen. Gestures of Becoming-With. 2021, Brooklyn.