When tasked about developing a self portrait through basic shapes in .p5js, I was a bit confused as to how to start. I first spent a long time playing arround with shapes to choose a body figure fitting to my vision. However, this body was not a self portrait in any way. It was not me. So, I asked my suit mates which physical elements characterize me. To this, I was told my glasses, my curly hair, my bee necklace and my white T-shirts mark my style. So I decided to focus on these elements as I built an image of myself. Here are some of them: (My hair and clothes you’ll see in class)
I designed my portrait from top down using the following elements:
- Hair: My hair was composed of a multitude of circles with “noStroke();” that would illustrate my curly hair. I made three different hair colors to give this element depth and importance in the image.
- Face: My face was composed of ellipses for the shape, eyes, and ears; and arcs for the nose, eyebrows and the smile.
- Neck: My neck was built with rectangles and an ellipsis.
- Body: The body is made with rectangles and lines for the holes between the arms and the core.
- Glasses: My glasses are composed of two circles, an arc and to lines.
- Necklace: Two lines and two ellipses.
The greatest challenge in designing the portrait was making sure that the elements I included made sense. Sometimes a specific color or shape that I thought would fit in a specific place, looks horrible. In these situations, playing with individual values was the only way I knew how to fix this, and thus was very time consuming.
I also learned the importance of shadows, as adding them had a significant impact on the final product and took much less time than I initially expected.
Furthermore, in an attempt to include an interactive element, I added mouseX and mouseY qualities to the variable defining the color of my glasses so that the user could change it according to their preference.
Here’s my portrait:
Some elements to improve is that I hard coded my body, so if the dimensions of the canvas are changed, my head will adapt accordingly but my body will not. I would have also liked to include a background and more interactive portrait. Regardless, with this exercise being my first experience with .p5js and processing I am very happy with the final result.
So, which color of glasses do you think better fit me?