Self-Portrait: Introduction to Shapes

– Concept:

In this assignment, since I am not someone used to making portraits and descriptions of real objects/people, I wanted to make a simple, cartoon-style approach to how I perceive myself.
With basic shapes, I intended to rely on the noStroke() function to give a feeling similar to the characters seen in the art style of the “South Park” series. In the portrait, I tried to highlight subtly characteristics of my face that most people recognize from me: A middle part hairstyle, glasses, slightly closed eyes, and a thick lower lip side.

– Highlights of my code:

In my code, I wanted to experiment with the moving animations we could produce with the draw() function. To do so, instead of making an element of my face move, I decided to add a cloud to try and move it around the portrait.

//Cloud
  fill(255);
  ellipse(x, 40, size, size);
  ellipse(x+10,50,size,size);
  ellipse(x+30,50,size,size);
  ellipse(x+30,30,size,size);
  ellipse(x+15,30,size,size);
  ellipse(x+40,40,size,size);
  
  //Movement of cloud
  x = x += 0.2 ;
  if(x >= width){
    x = 0;
  }

Here, I used various circles with a modifiable size to make a cloud that would move thanks to sharing a common x-axis that I would change dynamically. At the end, I also added a condition that returns the cloud to the start if it reaches the max width.

As a personal preference, I am also proud of how I managed to utilize the arc() function to generate the mouth. Having experimented (and failed) with ellipses before the use of this, I am happy that I found a way to improve the drawing of my mouth.

//Mouth
  //Half a circle painted red.
  fill(170,51,0);
  arc(250, 450, 75, 40, 0, 180);

 

– Sketch:

– Reflection and ideas for future work or improvements:

In future projects, I would like to experiment and explore a more realistic art style, a style that could reward the use of more specific shapes and figures. In addition to that, having tried the movement of the cloud, I would like to generate more varied movement (other than just lateral movement) all around my drawings and possibly include interactive components. However, I am aware now of the time it takes to animate even easy movements like the cloud just going from side to side.

In addition to all this, I would plan my code in a different way next time. I would possibly create functions that can improve the legibility and reusability of the code (maybe creating the eyes, the glasses, and the hair, being such symmetric drawings, would have been easier with a proper structure of the code).

Leave a Reply