sp17 – Page 2 – [OLD FALL 2020] 15-104 • Introduction to Computing for Creative Practice

Project-05- Wallpaper


//Shruti Prasanth
//Section C
//Project 5- Wallpaper

function setup() {
    createCanvas(500, 500);
    background (243,239,201);
}

function draw() {
    rectMode(CENTER);
    //flower starts at canvas top left corner, and translates from the previous position:
    flower(0, 0);
    flower(150,0);
    flower(150,0);
    flower(150,0);
    flower(-75,150);
    flower(-150,0);
    flower(-150,0);
    flower(-150,0);
    flower(-75,150);
    flower(150,0);
    flower(150,0);
    flower(150,0);
    flower(150,0);
    flower(75,150);
    flower(-150,0);
    flower(-150,0);
    flower(-150,0);
    flower(-150,0);

}

function flower(x,y) {
    push();
    translate(x,y);

    noStroke();
    fill(215,210,143);
    //diam= 50
    circle(width/10, height/10, 50); 
    fill(255);
    circle(width/10, height/10, 10);
    push();
    translate(width/10, height/10);
    fill(255);

    //inbetween big circle and ellipse dots
    circle(-55,-100,10);
    circle(55,-100,10);
    circle(55,100,10);
    circle(-55,100,10);
    circle(-100,-18,10);
    circle(100,-18,10);
    circle(-100,18,10);
    circle(100,18,10);


    circle(0,-30,20);//inner white circles
    circle(0,30,20);
    circle(30,0,20);
    circle(-30,0,20);
    circle(-20,20,20);
    circle(20,20,20);
    circle(20,-20,20);
    circle(-20,-20,20);
    ellipse(0,70,20,50);
    ellipse(0,-70,20,50);
    ellipse(70,0,50,20); //right long petal
    ellipse(-70,0,50,20);
    circle(45,45,30); //bigger outer circle
    circle(45,-45,30);
    circle(-45,-45,30);
    circle(-45,45,30);
    pop();

}

For my coded wallpaper, I was inspired by the queen annes lace flower, and I decided to abstract the petals into a vector design version. I used a lot of ellipses and circles of varying sizes, and based it off a light green + white color scheme. This wallpaper might be something I would wear possibly on a printed dress.

Project-04- String Art

sketch Download


//Project 4 - String Art Mail Envelope Drawing
//sp17
//Section C

var dx1;
var dy1;
var dx2;
var dy2;
var numLines = 50;

var dx3;
var dy3;
var dx4;
var dy4;

var dx5;
var dy5;
var dx6;
var dy6;


function setup() {
    createCanvas(400, 300);
    background(200);

//envelope flap
    line(40, 40, 150, 200);
    line(360, 40, 250, 200);
    dx1 = (150-40)/numLines;
    dy1 = (200-40)/numLines;
    dx2 = (250-360)/numLines;
    dy2 = (200-40)/numLines;

//horizontal body
    fill(255,0,0);
    line(40,40,40,250);
    line(360,40, 360,250);
    dx3 = (40-40)/numLines;
    dy3 = (250-40)/numLines;
    dx4 = (360-360)/numLines;
    dy4 = (250-40)/numLines;


//black bottom triangle set
    line(40,250, 200, 200);
    line(360,250, 200, 200);
    dx5 = (200-40)/numLines;
    dy5 = (200-250)/numLines;
    dx6 = (200-360)/numLines;
    dy6 = (200-250)/numLines;


}

function draw() {

//flap
    var x1 = 40;
    var y1 = 40;
    var x2 = 360;
    var y2 = 40;
    for (var i = 0; i <= numLines; i += 1) {
        line(x1, y1, x2, y2);
        x1 += dx1;
        y1 += dy1;
        x2 += dx2;
        y2 += dy2;
    }
    noLoop();


//body
    var x3 = 40;
    var y3 = 40;
    var x4 = 360;
    var y4 = 40;
    for (var i = 0; i<= numLines; i+= 1) {
        line(x3,y3, x4,y4);
        x3 += dx3;
        y3 += dy3;
        x4 += dy4;
        y4 += dy4;
    }
    noLoop();


//black bottom triangle set
    var x5 = 40;
    var y5 = 250;
    var x6 = 360;
    var y6 = 250;
    for (var i = 0; i <= numLines; i += 1) {
        line(x5, y5, x6, y6);
        x5 += dx5;
        y5 += dy5;
        x6 += dx6;
        y6 += dy6;
    }
    noLoop();


}

LookingOutwards- 04

One work of computational sound art that I found interesting while researching was the Shore Scene Soundtrack, (https://www.artsy.net/artwork/cevdet-erek-sss-shore-scene-soundtrack), by artist Cevdet Erek. It is an interactive project that simulates the sounds and waves of the ocean when hands move across a carpeted material. I found this work of art inspiring because it taps into people’s memories and brings back their experiences of hearing the sea, while directly interacting with a physical material. In terms of the algorithms that generated the work, I think that the artist would have used loops and repetitions to simulate the ripples of the sounds of the sea. A cascading effect also would have been created through the use of gradual or incremental decreasing and increasing the aspect of the volume variable. The way that the artist envisioned the ocean and was inspired from it reflects in the final work because of the realness of the feeling of the sound, which to many people is nostalgic. This work was installed in Sydney Biennal, and also won the Nam June Paik award in 2012.

Project-03- Dynamic Drawing

sp17 03 project


//Project 3 - Dynamic Drawing
//sp17
//Section C


function setup() {
    createCanvas(450, 600);
    
}

function draw() {
    background(215, 195, 215);

    if (mouseY < height/2) {
        background(0); 
    } else {
        background (215, 195, 215);
    }

    //SUN 
    fill(235,206,117); // yellow
    stroke(235,206,117); // yellow
    var y = min(mouseY, 620);
    var diam= 230; // diameter


    // if mouse moves towards the center of the sun, the sun shrinks
    // if mouse moves away from the sun it is big

    if (dist (mouseX, mouseY, width/2, y) < diam/4) {
        diam = 50;
    } 
    ellipse(width/2, y, diam, diam); // sun


    //if the mouse Y is above the middle, the sun turns white moon:
    if (mouseY < height/2) {
        fill(255);
        stroke(255);
        ellipse(width/2, y, diam, diam); 
    }


    // if mouse around the centerpoint of the canvas, the sun/moon has rays show up
    if (dist(width/2, height/2, mouseX, mouseY) < 10) {
        strokeWeight(10);
        line(width/2, height/2- 50, width/2, height/2 - 70); 
        line (width/2, height/2 + 50, width/2, height/2 + 70);
        line (width/2 - 50, height/2, width/2 - 70, height/2);
        line (width/2 + 50, height/2, width/2 + 70, height/2);
    }

    //CLOUDS
    // if mouse moves to the right, clouds move right

    fill(137,183,172); // light teal
    stroke(137,183,172) // light teal

    var x = min (mouseX, 500);
     // left cloud 
    ellipse(x, height/4*3, 230, 170);
    ellipse(x - 100, height/4*3, 150, 100);
    ellipse(x + 100, height/4*3, 150, 100); 

    //right cloud
    ellipse(x+ 200, height/4, 230, 170); // middle
    ellipse(x + 100, height/4, 150, 100); // left bump
    ellipse(x + 300, height/4, 150, 100); // right cloud, right bump 


}

Looking Outwards 03- Computational Fabrication

Kinematics Petal Dress by Nervous System.

A project that I found to be an inspiration under the topic of generic artwork is the Kinematics Petal Dress (https://n-e-r-v-o-u-s.com/projects/albums/kinematic-petals-dress/), designed by the company Nervous System, a generative design studio that takes ideas from natural phenomenons and implements them into their work. This particular dress which is 3D printed, is created to be a continuous textile with interlocking parts and components. I find this piece of work interesting because it represents how the worlds of technology and fashion can combine to create customizable clothing. In terms of the algorithms that generated the work, I think that the aspect of variability makes it so that the length, width and shape of each component can be altered and have dynamic aspects that change with the changing data about the body type of specific person. This makes the work customizable, and designed to suit the needs of a variety of people. Additionally, this design firm believes in reflecting natural properties in their fashion pieces, and in this dress, that vision is manifested because the 1600+ overlapping pieces and hinges create the effect of flower petals layering and blooming. This dress is also compressible and foldable, which takes into consideration efficiency, and I find this really unique.

Project 2- Variable Face

sketch

var eyeSize = 20;
var faceWidth = 300;
var faceHeight = 400;
var eyecolor = 0;
var colorRed= 0;
var colorGreen = 0;
var colorBlue = 0;

var hairWidth= 400;
var hairHeight= 600;
 
function setup() {
    createCanvas(640, 480);
}
 
function draw() {
    background(180);

    fill(0);
    stroke(0);
    rect(width/6, height/20, hairWidth, hairHeight); // black hair rect. behind



    fill(246,215,196); // head color
    stroke(246,215,196) 
    ellipse(width / 2, height / 2, faceWidth,  faceHeight);

    fill(0);
    stroke(0);
    triangle(120,25, 500,220,500,25); // side bang


    //EYES VARIABLES
    var eyeLX = width / 2 - faceWidth * 0.25;
    var eyeRX = width / 2 + faceWidth * 0.25;

    //2 eye dots
    fill(eyecolor);
    stroke(eyecolor);
    ellipse(eyeLX, height / 2.3, eyeSize, eyeSize);
    ellipse(eyeRX, height / 2.3, eyeSize, eyeSize);

    //eye highlight
    fill (255);
    stroke(255);
    strokeWeight(10);
    ellipse(eyeLX, height/2.35, 1, 1);
    ellipse(eyeRX, height/2.35, 1,1);

    fill(colorRed, colorGreen, colorBlue);
    stroke(colorRed, colorGreen, colorBlue);
    line(eyeLX, height/1.6, eyeRX, height/1.6);

    noFill();
    beginShape();


    curveVertex(eyeLX, height/1.6);
    curveVertex(eyeLX, height/1.6);
    curveVertex(eyeLX+ 40, height/1.35);
    curveVertex(width/2, height/1.3);
    curveVertex(eyeRX- 40, height/1.35);
    curveVertex(eyeRX, height/1.6);
    curveVertex(eyeRX, height/1.6);

    endShape();


}
 
function mousePressed() {
    faceWidth = random(250, 300);
    faceHeight = random(350, 400);
    eyeSize = random(10, 30);
    hairWidth = random (400,450);
    hairHeight = random (600,650);
    eyecolor = random (0,200);
    colorRed = random (0,255);
    colorGreen = random (0,255);
    colorBlue = random (0,255);
}

Looking Outwards 2- Generative Art

SV15 @ QUE US Bank Tower, Los Angeles

The work of generative art I chose to analyze is called SV15 by Lia, an Australian artist . Her main concept is being fluid with what her machine generates, and not relying strictly on hard rules for her code. Her work has a minimalist quality, and turns her inspirations into abstract colors and forms. In her project SV15, I admire the aspect of fluidity in her work. This work is installed at Que US Bank Tower in Los Angeles, and it has an interactive component of movement that engages viewers when they enter the lobby. Additionally, there are layered shapes and varying opacities that ripple and overlap, and almost appear to be “blooming” when in motion, which creates a calming and relaxed feel.

In terms of the algorithm itself, Lia probably used in her code a varying component or a random feature. She also must have used some loop functions that repeat and run the code so that the movement of the artwork continues to repeat itself. Additionally, her algorithm must have consisted of several values, highlights, and shadows of different blues. Opacity must have also been considered because her shapes overlap and create new overlays of color in her artwork when they move.

Lia’s work is really unique and I enjoy her abstract qualities. Her work sets a professional, modern, and sophisticated tone for the environment that it is installed, and the pace of the movement in the artwork reflects the natural pace at which people and workers walk through the lobby of the bank. As an artist, her sensibilities were to make people feel at ease instead of stressed, and her generative artwork nicely creates that for people through her intentional use of color, and soft radiating movement of shapes.

Project 01- Self Portrait

sketch

function setup() {
    createCanvas(400, 500);
    background(197,180,198);
    
}

function draw() {
    fill(223,225,229); //grey
    stroke(223,225,229); // grey
	rect(20,360,300,140); // grey top

    fill(247,219,184); // cream skin
    stroke(247,219,184);
    triangle(20,360,200,200,250,360); // neck
    fill(247,219,184); // cream skin
    stroke(247,219,184);
    rect(200,280,85,80); // neck 
   
    fill(232,198,156); // head color
    ellipse(185,200,150,200); // head
    fill(0);
    stroke(0);
    quad(100,180,20,360,140,360,120,180); // hair
    triangle(20,360,60,450,140,360); // hair
    quad(180,90,70,150,60,330,180,90); // hair
    point(180,90);
    point(70,200);
    triangle(30,200,50,350,90,170);
    triangle(180,90,275,160,250,300);
    quad(260,150,330,350,260,400,240,200);
    quad(130,89,70,200,245,140,215,89); 
    triangle(330,250,310,330,250,170);

    line(90,250,180,330); //necklace
    line(180,330,230,280); //necklace
    fill(250); //necklace
    stroke(250);
    circle(180,330,12); //necklace

    fill(215,117,148);
    stroke(215,117,148);
    ellipse(180,260,50,30); //smile

    fill(232,198,156);
    stroke(232,198,156);
    rect(140,220,75,40); // cut half smile ellipse

    fill(0);
    stroke(0);
    triangle(50,250,20,280,40,370); //more hair

    circle(150,230,12); //black eye
    circle(208,230,12); // black eye

    fill(250);
    circle(153,230,5); // eye highlight 
    circle(210,230,5); // eye highlight
}

LO1- My inspiration

The piece I chose to analyze for my Looking Outwards is called Untitled by Skip Dolphin Hursh (https://www.skiphursh.com/Dolby-Art-Series). It is a work part of the Dolby Art gallery. This example of computational art is really unique and I admire it because I really like the vibrancy and the variety of colors used. There is almost every color of the rainbow, and the way that the colors are organized into this grid-like layout makes the colors appear in sections or rows of color swatches. Together, when the viewer looks at the piece, the colors transition easily but also compliment each other through the surrounding shapes next to it.

Untitled was created with the help of people from the Dolby team, famous for surround sound technology. This work and the others part of the Dolby Art gallery is a part of a collection of commissioned work by 32 artists from around the world. This piece of work was most likely created by custom software and scripts. A unique fact is that the Dolby team had few individuals listen to music and decide to use the sounds as inspiration to compose their pieces of work. Some prior works the team as well as the primary artist must have been inspired by are the other commissions that look inspired from radio waves, cosmic energies, sound frequencies, and rippling water. Opportunities that this project points to are other works of art based on colors people envision from music, and the sharp spikes created by sound waves.