Author: cath

Project 06: abstract clock



function setup() {
    wd = 600
    ht = 600
    createCanvas(wd, ht);
    background(60,80,140);
}

function draw() {
    background(60,80,140)
    s = second();
    m = minute();
    h = hour();
   
    
    noStroke();
    
    xPos = 10*s
    yPos = 10*s
    
    
    //the minute bar
    fill(238,229,169)
    rect(0, 29, wd, 79);
    rect(0, ht-109, wd, 79);
    fill(105,160,225)
    rect(0, 49, wd*(m/60), 60)
    rect(0, ht-100, wd*(m/60), 60)
        
    //Hour Circle
    fill(255);
    circle(wd/2, ht/2, 199)
    fill(255,81,13)
    arc(wd/2, ht/2, 199, 199, -PI/2, -PI/2+h*(2*PI/12));
    
    //Seconds cirlcles
    fill(230,120,12)
    
    if (s <= 30) {
        circle(xPos, ht/2, 60);
    } else {
        circle(wd/2, yPos, 60);
    }
    
    if (s <= 30) {
        circle(wd-xPos, ht/2, 60);
    } else {
        circle(wd/2, ht-yPos, 60);
    }
        
}

LO #6

randomness

Zach Lieberman is a media artist who creates art with code. He uses Openframeworks for most of his creation, which is constantly updated on his instagram. In his recent works, he explored using a variety of random colors along with the wave effect and named the piece :color meditation. The slowly delayed motion of the colors moving towards the viewers’ perspective as it becomes thinner as it approaches the viewers’ eye, somehow gives the sense of relaxation. Another piece that he created recently is called “Grid push color”. I was intrigued by the combinations of random color he uses, and even though they are all unintentionally selected, they blend together very well. This piece consists of gradient squares which continuously changes color. This way, he successfully illustrates the movement of colors during the transitions of squares. This piece made me reach back my childhood memory of playing with a crystal prism.

https://www.instagram.com/zach.lieberman/ (more works)

https://www.instagram.com/zach.lieberman/

Project 5: Wallpaper

var s = 50;
function hexagon(xCenter,yCenter,color,col) {

    var canvas = document.getElementById('hexagons');
    var ctx = canvas.getContext('2d');
    
    ctx.beginPath();

    ctx.moveTo(xCenter - s, yCenter);
    ctx.lineTo(xCenter - (s/2), yCenter - s*Math.sqrt(3)/2);
    ctx.lineTo(xCenter + (s/2), yCenter - s*Math.sqrt(3)/2);
    ctx.lineTo(xCenter + s, yCenter);
    ctx.lineTo(xCenter + (s/2), yCenter + s*Math.sqrt(3)/2);
    ctx.lineTo(xCenter - (s/2), yCenter + s*Math.sqrt(3)/2);
    ctx.lineTo(xCenter - s, yCenter);

    ctx.closePath();
    ctx.stroke();
    if (col) {
        if (color % 3 == 1) {
            ctx.fillStyle = '#f00';
        } else if (color % 3 == 2) {
            ctx.fillStyle = '#0f0';
        } else {
            ctx.fillStyle = '#00f';
        }
    } else {
        if (color % 3 == 1) {
            ctx.fillStyle = '#00f';
        } else if (color % 3 == 2) {
            ctx.fillStyle = '#f00';
        } else {
            ctx.fillStyle = '#0f0';
        }
    }
    
    ctx.fill();
}

function draw() {

    var above = true;
    for (var i = 1; i <= 6; i++) {

        for (var j = 1; j <= 5; j++) {
            hexagon(150 * j - 100, (25 * Math.sqrt(3) * 2 * i),i,true);
        }
        
    }

    for (var i = 1; i <= 5; i++) {

        for (var j = 1; j <= 4; j++) {

        hexagon(150 * j - 25,(25 * Math.sqrt(3) * 2 * i) + 25 * Math.sqrt(3),i,false);
        }
    }

}
draw();

LO #5

“Unexpected Growth” is an augmented reality installation by Tamiko Thiel in 2018 and part of Whitney Museum’s exhibition “Programmed: Rules, Codes, and Choreographies in Art, 1965-2018.” Viewers were able to experience the installation directly through their smartphones on the Whitney Museum’s terrace. After opening the video, viewers can walk through the balcony and see it crawling with unchartered growths and plants that create an oceanic alternative to the New York high rise. I find most interesting how the futuristic, fictional visuals essentially occupies and invades the viewer’s very physical location, which to some degree closes the typical perception gap between such type of futuristic art and the viewer. Personally this digital installation epitomizes the title of the class for it is enabled by technology to bridge reality and another space, in this case the artist’s creation of a submerged New York in some undated future, into coexisting as one dimension. It allows a degree of inclusion and interaction for viewers that is not usually provided by more traditional art mediums.

Project 4: String Art

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

function draw() {
  background(140);

  
  for (var i = 0; i < 590; i++) {

 
  var x1 = 0;
  var x2 = i*width/30;
  var y1 = i*height/59;
  var y2 = height;

  strokeWeight(0.7); 

  
  stroke(200, 103, 98);
  line(x1, y1, x2+100, y2);


  stroke(155,109,90);
  line(x2, 0, x1*2, height-y1);

  
  stroke(147,55,91);
  line(width, height-y1, x2*2, y2);


  stroke(46,56,64);
  line(x2, 4, width, y1);

  stroke(65,50,123);
  line(width+200, height-190, x2-999, height);

  
  stroke(200,85,45);
  line(width/2,height/2, x2, y1);
  }
}

Looking Outwards: 04

Sound Art

The project that caught my attention was The Product – Soundmachines, Creative Sound Production Device 2011. This video shows three units, which resembles a standard record player, translate concentric visual patterns into control signals for further processing in any music software. Each rotation of the record discs holds three tracks, and they can be synced into a sequencer. This project was created by a producer/sound designer Yannick Labbé. I was fascinated by the sounds produced by the record discs, it had a techno feel to it, and it was interesting watching the visual/sound elements come together to create this ensemble.

Looking Outwards-03

Looking at Parametric world, I found myself particularly intrigued by a post by A Fractured Reality: this was a cross section of a mouse intestine has been stained with fluorescent dyes. With the dyes in place, it is easy to see how different parts of the cross section manipulates and comes together to form this complex geometry, creating this sense of parametric design. it was very interesting for me to see how life imitates art, even at the molecular scale. The individual who made this post is a physician who spent 3 years doing research in ophthalmology and 1 year working as a patient care technician.

https://afracturedreality.tumblr.com/post/175618541273/mouse-intestine-cross-section

Project 3: Dynamic Drawing

var maxHue = 70;
var currentHue = maxHue;


function setup() {
  createCanvas(800,400);
  background(100);

  colorMode(HSB, 350, 110, 110);
  var skyHue = currentHue;
  background(22, 0, 20);
}

function draw() {


  var c = width / 2;
  background(255);
  noStroke();
  var skyHue = currentHue;
  skyHue = map(mouseX, 0, width, 0, 270);
  for (var rectY = 0; rectY < 700; rectY += 10) {
    fill(skyHue, 50, map(mouseX, 0, width, 100, 0));
    rect(0, rectY, width, 250);
    skyHue++;
    fill(212, 0, 79, 0.08);
    rect(0, 400, width, 300);


  }

  sun();    

    fill(192,192,192);
    triangle(-200, 475, 170, 180, 700, 475);
    fill(160, 160, 160);
    triangle(80, 400, 680, 230, 900, 400);
    
}

function sun() {
  var diameter = height + 100;
  S = map(mouseX, 0, width, 45, 10);
  var mouseangle = map(mouseX, 0, width, PI, TWO_PI+ QUARTER_PI);
  var d1 = 10 + (sin(mouseangle) * diameter / 2) + diameter / 2;
  fill(50, 100, 175);
  ellipse(mouseX, d1 - 90, 90, 90);
  fill(0, 0, 0,);
  
}

Project 2: Variable Faces



//shape variables 
var faceWidth = random(250, 450);
var faceHeight = random(320, 450);
var eyeSize = random(20, 40);
var noseWidth = random(20, 40);
var noseHeight = random(30, 50); 
var eyebrowShape = random(20, 30);
var mouth = 1 

//color variables 
var faceRed = random(0, 255);
var faceGreen = random(0, 255);
var faceBlue = random(0, 255); 
var noseRed = random(0, 255);
var noseGreen = random(0, 255);
var noseBlue = random(0, 255);
var eyebrowRed = random(0, 255);
var eyebrowGreen = random(0, 255);
var eyebrowBlue = random (0, 255); 

function setup() {
  createCanvas(640, 480);
  background(220);

}

function draw() {
  noStroke();
  background(220);
  fill(red,green,blue);

  // face and eyes 
  ellipse(width / 2, height / 2, faceWidth,  faceHeight);
  fill(0, 0, 0);
  var eyeLX = width / 2 - faceWidth * 0.25;
  var eyeRX = width / 2 + faceWidth * 0.25;
  ellipse(eyeLX, height / 2, eyeSize, eyeSize);
  ellipse(eyeRX, height / 2, eyeSize, eyeSize);

  //nose 
  fill(noseRed, noseGreen, noseBlue);
  rect(310, 230, 20, 40);
  
  //mouth 
  if (mouth <= 1) { 
    stroke(1);
    noFill();
    line(275,325,325,325);
  } else if (mouth < 2 ) {
    stroke(1); 
    noFill();
    arc(320,230,230,230,.31,2.83);
  } else if (mouth < 3) {
    stroke(1); 
    noFill();
    arc(320,370,140,170,3.46,5.97);
    
  }

  // eyebrows 
  noStroke();
  fill(eyebrowRed, eyebrowGreen, eyebrowBlue);
  rect(eyeLX - 20, height / 2 - 50, 50, eyebrowShape);
  rect(eyeRX - 20, height / 2 - 50, 50, eyebrowShape);
}
  

function mousePressed() {
  red = random(0, 255);
  green = random(0, 255);
  blue = random(0, 255); 

  noseRed = random(0, 255);
  noseGreen = random(0, 255);
  noseBlue = random(0, 255);

  faceWidth = random(250, 450);
  faceHeight = random(320, 450);
  eyeSize = random(20, 40);

  noseWidth = random(20, 40);
  noseHeight = random(30, 50);

  eyebrowShape = random(20, 30); 

  eyebrowRed = random(0, 255);
  eyebrowGreen = random(0, 255);
  eyebrowBlue = random (0, 255); 

  mouth = random(1,3); 



  

 




}

LO: Generatie Art

“In Real Life” caught my attention because the inspiration behind the installation is something that concerns my current and future career aspirations. I personally feel that freelance work for an artist is often romanticized for its flexibility and convenience. However, this piece really attempts to elucidate the negative components that encompass freelance labor: difficulties in setting wages, correspondence and efficacy and a lack of insurance and benefits. For example, there have been several instances where patrons have asked me to create intricate works of art with no regard for the time or feasibility required of me to create it. The work and process of creating work must always prioritize the consumer.

Link to In Real Life: “https://player.vimeo.com/video/371276301?h=48e35c9655”