Week 1: Self – Portrait

Concept
For this project, I decided to create a more abstract, cartoonish self-portrait. The simplified shapes give the drawing a cute and playful look, which fits well with the style I am aiming for. The strawberry-shaped hat I featured in the portrait is an item I gave to my little sister for her birthday, which adds a personal touch to the project. (She made me wear this hat for days) The background is inspired by Astana, which has the most beautiful sky I’ve seen, which makes this project even more meaningful to me.

Code snippet
A piece of code that I’m particularly proud of is the implementation of eye blinking on the character. The eyes alternately open and close, creating a simple but effective animation. Here’s the relevant code snippet:

if (millis() - lastBlink > interval) {
  push()
  fill(0);
  stroke(0);
  strokeWeight(3);
  line(295, 400, 335, 400);
  line(355, 400, 405, 400);
  pop()

  if(millis() - lastBlink > interval + blinkDuration) {
    lastBlink = millis();
  }
  
} else {
    fill(0);
    circle(315, 400, 25)
    circle(385, 400, 25)
}

This block of code is responsible for the blinking logic, checking the elapsed time and switching between drawing closed eyes (lines) and open eyes (circles).

Sketch

Reflection and ideas for future improvements
Creating this project helped me get more familiar with p5.js, especially in terms of working with different forms and layers. The biggest challenge was figuring out how to draw curves correctly and how to handle time intervals in p5js. However, this project gave me the confidence to experiment further with p5.js and possibly add more complex animations or interactive elements in the future.

In the future I would like to add interactivity to the sketch, such as making the eyes follow the cursor, or adding background changes depending on the time of day. I also plan to refine the background, adding more details that more accurately convey the atmosphere of Astana.