Week 3 Generative Art by DG

let head;
let leftEar;
let rightEar;
let hat;

class BearObject{

  constructor(type, x, y, stopY, size){
    this.type = type;
    this.x = x;
    this.y = y;
    this.stopY = stopY;
    this.size = size;
    this.speed = 3;
    
  }

  update(){

    if (this.y < this.stopY){
       this.y = this.y + this.speed;
    } 
    
  }

  drawSelf(){

    // Head of Bear
    if (this.type == "head"){
      fill(255, 200, 0);
      circle(this.x, this.y, this.size);
    }

    // Bear Ear
    if (this.type == "ear"){
      fill(255, 200, 0);
      circle(this.x, this.y, this.size);

    }

    // Bear Hat
    if (this.type == "hat"){
      fill(0);
      rect(this.x, this.y, 80, 110);
    }
    
  }
  
}

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

  // positioning of each object =
  
  head = new BearObject("head", 300, 0, 300, 250);

  leftEar = new BearObject("ear", 200, 0, 210, 70);

  rightEar = new BearObject("ear", 400, 0, 210, 70);

  hat = new BearObject("hat", 260, 0, 70, 100)
  
}

function draw() {
  
  background(220);

  console.log(head.type);
  console.log(head.size);

  head.update();
  head.drawSelf();

  leftEar.update();
  leftEar.drawSelf();

  rightEar.update();
  rightEar.drawSelf();

  hat.update();
  hat.drawSelf();

  
}

My goodness, this assignment was an absolute festival of stressful thinking. Firstly it requires not only looking back into some of our class notes, but as well as the example that was posted on the course website! It is simply because of the fact that generative digital art is not really my tempo and/or within my league. Nevertheless, I had to use the examples to the best of my ability to create this artwork inspired by this video-game franchise that I had always adored with all my heart. The franchise, in question, goes by the name of Five Nights at Freddy’s.

 

This franchise is a video-game series that I remember from my elementary school times, which has also resurfaced back into the present time period of my life! Since it has often brought a smile to my face upon interacting with it, i figured that i could maybe try generating a simple yet lovely art sketch based on the main Bear Mascot of the series; however, I went with the choice of coloring the sketch yellow as a way to pretend that it’s golden, because my memories with the series can be described as.. Golden.

 

Now, I was able to kind of familiarize with the concept of setting up the “class” of the objects in relation to the bear sketch and setting the rules within the class; however, my problem was figuring out how to get the circles actually moving down the sketch, which will almost make it look as if it is generating itself to life via visual movement from top to bottom. After some looking back into the reference sheet, as well as proofreading my mistakes with Ai, I realized that what I had to do was connect each object of the bear to the draw function; equivalent to connecting some cables together so that they would get a TV up and running without issue. In addition, I had to learn to connect the class to the draw function in a way that also required me to install an update command in my sketch, where it was responsible for making sure that the movement of the objects into their respective spots was possible. Right up there with the command of “drawSelf” that would assist in helping keep track of how the objects traveled down the X and Y coordinates until reaching the designated spot that the “setup” has advised them to stop at. It has been about setting the transitions up at the right time and right spots in order to ensure smooth transitions of the sketch coming into place to form the sketch of the bear mascot (but yellow) from Five Nights at Freddy’s. All in all, this still made me hope that I can look back into this sketch for reference if I ever need to work with more artworks that deal with transitional elements that when combined, will be able to form the artwork into one whole picture for all to see.

Leave a Reply