rpai@andrew.cmu.edu – Page 2 – [OLD FALL 2019] 15-104 • Introduction to Computing for Creative Practice

Raymond Pai-Looking Outwards-07

Artificial Arcadia is an installation by Swiss-based art collective Fragmentin. The installation visualizes the Swiss mountain range using moving poles and a white cloth. They appear as mountain peaks to visitors, who’s movement appears as a heat map on a screen behind the mountain range. This is an interesting use of live user data and data regarding how much human-made construction is impacting the environment of Sweden. As people move around the exhibit, they generate ‘heat’, which is visualized as a red cloud on the mostly blue screen. This, in turn, lowers the peaks of the ‘mountains’, which represents melting icecaps in the Swiss mountains.

There are many sensors and computers working to achieve this exhibit. There must be at least motion sensors, live data collection on construction sites, and perhaps even carbon footprints. This data is also computed as vertical heights of the poles that create the mountain peaks. I admire the simplicity and multilayered nature of this installation. Every part is a metaphor, and Fragementin‘s work all tend to have many layers of meanings.

The piece:

Artificial Arcadia – Measured and adjustable landscapes

Raymond Pai-Project 06 – Abstract Clock

sketch

///RAYMOND PAI
///SECTION D
///RPAI@ANDREW.CMU.EDU
///PROJECT 06

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

}

function draw() {
    strokeWeight(0);
    background(255);

    //time variables
    var s = second();
    var m = minute();
    var h = hour();

    //diameter variables
    var sd = 200;
    var md = 400;
    var hd = 550;

    //angles of arcs
    c = 2 * PI;
    var sa = s * c;
    var ma = m * c;
    var ha = h * c;

    //seconds
    angleMode(DEGREES);
    noFill();
    stroke(255, 0, 0);
    strokeWeight(50);
    arc(width/2, height/2, sd, sd, 0, sa);

    //minutes
    angleMode(DEGREES);
    noFill();
    stroke(0, 255, 0);
    strokeWeight(50);
    arc(width/2, height/2, md, md, 0, ma);

    //hours
    angleMode(DEGREES);
    noFill();
    stroke(0, 0, 255);
    strokeWeight(49);
    arc(width/2, height/2, hd, hd, 0, ha);
}

Inspired by Apple Watch rings:

Each ring represents a different aspect of time. Red is seconds, Green is minutes, and blue is hours.

Raymond Pai-Looking Outwards-06

Nick Cave, <em>Amass</eM>. Image courtesy of Apple.

Amass is an augmented reality experience created by artist Nick Cave. Nick Cave creates sculptures and fashion which aim to show diversity and beauty while confronting the darkest parts of humanity. He is known for his garments and events, which are a collection of many fabricator’s textiles created in collaboration with Cave. It consists of randomly generated wind spinners, usually found in gardens reflecting sunlight. Amass can be experienced through a phone’s AR camera. I admire the use of AR to create an artistic experience. The randomly generated positions of the spinners in space feels very relevant to pseudorandom numbers, as the spinners are all about the same distance from each other and do not go beyond the walls, floor, or roof of the room. The colors of the spinners are also randomly generated, creating aesthetic gradients of shimmering light. Users can walk around and look at them from many angles.

Image result for nick cave project amass

More about the artist:

https://art21.org/artist/nick-cave/

More about Amass:

Why Apple’s New Augmented-Reality Collaboration With Famous Artists Won’t Help Us Reach the Next Stage of [AR]T

Raymond Pai-Looking Outwards-05

Henry Vargas is a 3D illustrator based in Vancouver. He makes 3D computer models of characters from popular shows and adjusts to lighting and background to render a final, 2D print. His style is clear with a matte plastic finish on all of his models. The lighting is often soft, with sharp reflections on certain body parts of the renders to show different materials.

Reflection in eyes communicate a different texture or material

Many of his illustrations are based on characters from video games, but they are only illustrations. His work is likely created in Cinema 4D, as they aren’t created for interaction, which might be done in Unity software instead. Cinema 4D allows for precise textures and lighting, which Vargas uses to express his artistic style.

More of his work can be found here:

https://www.artstation.com/henryvargas

Raymond Pai-Project-05

sketch

//Raymond Pai
//Section D
//rpai@andrew.cmu.edu
//Project-05

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

function draw() {
    background(200, 150, 160);
    fill('yellow');
    for (var y = 7; y < height - 5; y += 30) {
        drawRow(y, 30);
    }
}


function drawRow(y, spacing) {
    spacing = max(2, spacing);
    for (var x = 7; x < width - 5; x += spacing) {
        strokeWeight(0);
        fill(y, x + 50, x + 100);
        rect(x, y, 25, 25);
    }
}

I wanted to make a tile wallpaper that resembled the walls of a shower from the 90’s, with more contemporary colors.

Image result for gradient tiles — Example of gradient tiles

Raymond Pai-Project-04

sketch

//Raymond Pai
//Section D
//rpai@andrew.cmu.edu
//Project 04

var rx1;
var ry1;
var rx2;
var ry2;

var lx1;
var ly1;
var lx2;
var ly2;

var bx1;
var by1;
var bx2;
var by2;

var tx1;
var ty1;
var tx2;
var ty2;

function setup() {
    createCanvas(400, 300);
    //initiate r curve
    rx1 = 0;
    ry1 = -150;
    rx2 = 0;
    ry2 = height;

    //initiate l curve
    lx1 = 20;
    ly1 = -150;
    lx2 = 20;
    ly2 = height;

    //initiate b curve
    bx1 = -20;
    by1 = -150;
    bx2 = -20;
    by2 = height;

    //initiate l curve
    tx1 = -50;
    ty1 = -150;
    tx2 = -50;
    ty2 = height;
}

function draw() {
    background(220, 220, 150);

    //triangle
    fill(100);
    triangle(width/2, height, width/2 + width/4, height/2, width, height);
    fill(255);
    triangle(width/2 + 35, height - 50, width/2 + width/4, height/2, width - 35, height - 50);

    //r curve
    for (var a = 0; a < 1000; a += 10) {
        stroke(50, 50, 255);
        line(rx1, ry1 + a, rx2 + a, ry2);
    }
    //l curve
    for (var a = 0; a < 1000; a += 10) {
        stroke(255);
        line(lx1, ly1 + a, lx2 + a, ly2);

    }
    //b curve
    for (var a = 0; a < 1000; a += 10) {
        stroke(100, 100, 255);
        line(bx1, by1 + a, bx2 + a, by2);
    }
    //t curve
    for (var a = 0; a < 1000; a += 10) {
        stroke(0, 0, 255);
        line(tx1, ty1 + a, tx2 + a, ty2);
    }
}

Drawing of a wave. The white foam and the dark blue are shown using a gradient of 4 ‘curves’.

Raymond Pai-Looking Outwards-04

Listens to audio and makes fortunes. By Shanghai based design studio: automato.farm

BIY Believe it Yourself is a fascinating project that allows machine learning to create subjective outputs using inputs from the environment. Created by Shanghai based design studio automato.farm, tt is interesting in that the project uses the logic boards as part of the physical artistic representation of the concept. Superstitions and fortune telling from different cultural folktales are programed into Rasberry Pi in order to compute random results to audio. For example, if a person’s name is spoken aloud, the computer interprets the name and outputs a lucky number and destiny based on Indian Numerology and Astrology. The studio, automato. farm, is known for their work regarding social commentary. This is a very fitting design, because it shows that people live with superstitions but computers seem to be objective. The subjectivity of these computers gives humanity to computing in a new way.

Link to project: https://www.creativeapplications.net/scripts/biy-believe-it-yourself-real-fictional-belief-based-computing-kits-by-automato/

Raymond Pai-Project-03

Random shapes and colors in each quadrant. Center circle shows the color pallet of the shapes.

sketch

//Raymond Pai
//Section D
//rpai@andrew.cmu.edu
//Project-03
var angle = 0;
var r = 200
var g = 200
var b = 200

function setup() {
    createCanvas(600, 600);
    background(0);
}

function draw() {
      //Q1
      if (mouseX > 300 & mouseY < 300){
        r = random(100, 200);
        g = random(200, 300);
        b = random(0, 105);
        fill(r, g, b); // control rect color explicitly
        stroke(0);
        strokeWeight(6);
        push();
        translate(mouseX, mouseY);
        rotate(radians(angle));
        ellipseMode(CENTER); // center rect around 0,0
        ellipse(0, 0, 1000, 200);
        pop();
        angle = angle + 5;
      }
      //Q2
      if (mouseX < 300 & mouseY < 300){
        r = random(200, 255);
        g = random(10, 25);
        b = random(200, 255);
        fill(r, g, b); // control rect color explicitly
        stroke(0);
        strokeWeight(6);
        push();
        translate(mouseX, mouseY);
        rotate(radians(angle));
        ellipseMode(CENTER); // center rect around 0,0
        ellipse(0, 0, 40, 200);
        pop();
        angle = angle + 5;
      }
      //Q3
      if (mouseX < 300 & mouseY > 300){
        r = random(100, 255);
        g = random(200, 255);
        b = random(200, 255);
        fill(r, g, b); // control rect color explicitly
        stroke(0);
        strokeWeight(6);
        push();
        translate(mouseX, mouseY);
        rotate(radians(angle));
        ellipseMode(CENTER); // center rect around 0,0
        ellipse(0, 0, 300, 20);
        pop();
        angle = angle + 5;
      }
      //Q4
      if (mouseX > 300 & mouseY > 300){
        r = random(10, 25);
        g = random(10, 250);
        b = random(200, 255);
        fill(r, g, b); // control rect color explicitly
        stroke(0);
        strokeWeight(6);
        push();
        translate(mouseX, mouseY);
        rotate(radians(angle));
        ellipseMode(CENTER); // center rect around 0,0
        ellipse(0, 0, 10, 2000);
        pop();
        angle = angle + 5;
      }
      //Secret Center
      if (mouseX < 600){
        ellipse(300, 300, 200, 200);
      }
    }

Raymond Pai-Looking Outwards-03

Marius Watz is a New York-based artist who works with visual abstraction fabrication with software. This piece is called ‘Probability Lattice’ which is appealing to me because it randomly creates interesting geometric forms. I don’t know the process, but there is probably 3D printing and randomization of the lengths of the sides of polygons involved. The artist’s style of sharp and jagged forms is clearly present in this example of his work. The name ‘Probability Lattice’ gave me the impression that the forms could visualize some form of probability data, but the artist does not elaborate on this explicitly. I’m curious about how this could be used to reflect ourselves, such as shapes based on how many steps we take through the day or how much we sleep through the week.

Link to the page:

http://mariuswatz.com/2012/05/09/probability-lattice/

Raymond Pai-Looking Outwards-02

LIA created a generative application which expresses feelings of summer. Slow-moving zigzag lines are generated as bands going across the screen. These colors and textures are sampled from images of beaches and ocean waves. LIA herself is based in Australia. She is considered a pioneer in the medium of generative art on the internet. Although the work is created with code, many traditional drawing and painting concepts are employed to create an artwork. The ‘Summer’ series should give the audience feelings of calmness and heat. The lines simulate ocean waves as they roll into the shore where you sit watching. Lines cross in these bands, which appear like reflections in the water and waves. It is important to note that perspective is considered in the widths of the bands in order to convey the depth and distance of the ‘waves.’ LIA also created 3 other versions: Spring, Fall, and Winter, which employ their own pallets to express their respective season. Together, the series is called Four Seasons, which all use live generative art to create a moving image. Below is a random still from ‘Summer’.