assignment 1 – self portrait

Concept

My main focus for this assignment was the aesthetics of it. Because I wanted to focus more on making something visually pleasing, I started off ambitious – I had made a cartoonish sketch of myself and was hoping to recreate it in Processing. It seemed possible if I broke down the drawing into small curves.

While it most certainly was possible, I underestimated the difficulty of doing so. However, as we discussed in class, even the way things fail can be inspirational in itself. As I was trying (and failing) to construct the initial sketch, I noticed that what I had looked very similar to minimalist line art. I realized a line art representation of myself was not only much more feasible but also more indicative of the features I see most representative of myself, like my glasses, my mole, and my often-worn heart-shaped earrings.

I also really love pastel color palettes, so I wanted to incorporate them into my portrait. I decided to make the background(s) of the portrait some of my favorite palettes. Every time the canvas is clicked, it changes the color palette. There are five in total.

Implementation

Like I said, because I focused mostly on the aesthetics of it the technical implementation isn’t the most out-of-this-world. I, however, like the idea of having different sized blobs in the background (which I believe makes the whole portrait visually appealing). The mathematics of implementing the blob I learnt from this article, which I then modified a bit to have animated.

  for (let k = 0; k < blobs.length; k++) { 
    let blobPoints = []
    push();
    noStroke();
    fill(blobs[k].colors[currentPalette])
    beginShape();
    translate(blobs[k].x, blobs[k].y); 
    for(let i = 0; i < res; i++) {
      //make sure circle isn'getting too big or too small
      rad += random(-20,20);
      rad = constrain(rad, blobs[k].minRad, blobs[k].maxRad); 
      let x = rad * cos(angle * i);
      let y = rad * sin(angle * i);
      blobPoints.push([x, y])
      curveVertex(x,y);
   }
    for (let j = 0; j < 3; j++) {
      curveVertex(blobPoints[j][0], blobPoints[j][1])
    }
    endShape();
    pop();
}

Reflections and Improvements

While I’m happy with the way my self-portrait turned out, I don’t like the way the curves were made. It was a lot drawing of lines with hard-coded coordinates, so it is not adjustable in anyway, so making the line art itself interactive in any capacity feels very difficult. For my next project, I want to focus more on using symmetry and geometry in the location of elements.