Week 1 – Self Portrait

Concept

My main objective was to create an accurate self-portrait of myself. To achieve this, I started by taking a photo of myself at the beginning of the assignment and then attempted to capture all the details I saw in the photo using p5.js. The challenge arose when it came to my wavy (almost curly) hair, as I needed to accurately depict its shape. Additionally, I spent a considerable amount of time figuring out what kind of facial expression to depict, I ended up doing “closed eyes” look since it looked better than the “open eyes” to me. I also focused on maintaining the correct proportions of my body in the portrait. In the end, I was pleased with the minimalistic aesthetic that emerged, as it seemed to align well with my personality.

Demo

Code Highlight (Hair area):

So this part is the part of the code that I am most proud of, maybe due to the fact that I spent so much time on it 🙂

It was the most challenging part of the code due to various reasons like lack of p5.js knowledge (I had to look a lot of stuff up), trying to make different shapes work in harmony and perfectionism stalling the productivity.

At the end, I tried to imitate a middle-part hairstyle using arcs and triangles (might not be the best way but I am fine with the end result).

Here’s the code snippet of the Hair class:

// Hair class 
class Hair {
  draw() {
    fill(0, 0, 0); // Hair color
    noStroke();
    arc(300, 205, 197, 170, PI, 0); // Top hair arc
    fill(228, 177, 171); // Skin color
    arc(300, 210, 50, 50, PI, 0); // Forehead section (mid-part separation)
    fill(1, 1, 1); // Hair color
    triangle(201, 205, 275, 205, 175, 230); // Left side bangs
    rect(200, 205, 15, 45); // Left side hair sideburn
    rect(385, 205, 15, 45); // Right side hair sideburn
    triangle(326, 205, 400, 205, 430, 230); // Right side bangs
  }
}

Reflection & Improvements for Future Work

The experience was quite enjoyable for me because, I was exposed to p5.js before, but it never went beyond some simple sketches, just messing around with the software, nothing serious.  Additionally, it felt like I was opening a new realm of coding. After completing handful of courses in Computer Science curriculum, coding started to associate with efficiency and work, not necessarily artistic vision/creativity, so I was delighted to work on something creative using code.

I always wanted to try to do digital portraits, previously I only did pencil portraits, but I never had the time or reason to do it until now. Discovering that I could make art with code was a delightful surprise. It made me realize I had missed out on a great way to express myself creatively. This experience has sparked a new interest in combining technology and art in my work, and I’m eager to explore this intersection more in the future.

Leave a Reply