Aaryan’s Self-Portrait: Touch-and-Go

I am bad at drawing. I once tried drawing a reindeer in school for Christmas, and what I drew looked more like a Martian cow. I’m also relatively new to coding. So, I wasn’t sure where to start my self-portrait, I didn’t even know if my head would be an ellipse or a rectangle. So, I decided to just start drawing and try capturing some of the identifiable features of my face as best I could, and take it from there. This was not too difficult, as it just needed the basic shapes we learned in class. The only challenge was figuring out where to locate each shape and how big to make it. I had to do this manually for each shape, and there were quite a few elements, so it took a while. But I was quite happy with the disembodied face I produced at the end.

Disembodied Face:

This face seemed like a passable self-portrait that captured some features such as the roundness of my head. But it very clearly didn’t look like me (not that I had expected it too). So, I decided to incorporate something that was easy to associate with me as a person, to make the drawing more representative of me. Currently, the one thing outside academics that I give the most time and energy is Touch Rugby. So, I thought I would put a touch rugby ball into my portrait.

It was easy enough to draw the ball (it’s quite similarly shaped to my head, actually). I thought it would be fun to have the ball bouncing against my head, so I decided to add that simple animation based on the bouncing ball activity we had done in class. I could get the ball to bounce between my fixed head and the border of the canvas. I had gotten more comfortable with drawing shapes, so I drew the rest of a body and added a few details, a well as a background.

At this point, I was quite happy with the self-portrait, save for one element. My head being rigidly fixed while the ball bounced against it looked unnatural, and I wanted to create some response from my head. But this seemed tough and I couldn’t think of how to do that, especially while keeping the rest of the body still and consistent. But then I glanced through the examples from past classes and felt inspired. So, I decided to try it. It was a conceptual challenge, but I realized, if I made a reference variable to demarcate the head position, I could make the ball interact with that variable. So, I decided to set the x value of the face as a variable and made the other facial features relative to this position. I created a velocity variable for the face that would become non-zero when the ball hit the face; it would then change direction after some motion, and then become zero again when the face reached its initial position. To keep the rest of the body still, I made top of the neck relative to the face, but the bottom fixed with the rest of the body. It worked, and I was quite pleased with having overcome that hurdle and added this element of interaction between my head and the ball.

The Final Result:


Looking back, I would have made my life a lot easier if I had created this reference variable earlier as it would have been a lot simpler to position the other elements on the face. It would have also given me more flexibility, such as being able to move many features at once, rather than having to change coordinates individually. One feature that helped with some shapes, especially the arms and legs, was this function called quad() which I looked up to make custom quadrilaterals. It helped but required manual input of all vertices. I did this because I couldn’t figure out how to use rotate(), which is something I should certainly get the hang of so that I can make diagonal shapes. My approach to this assignment was to try a few things and build the idea as I went along, without a coherent idea to begin with. It would definitely help to start with an overall concept and work towards it next time, but I think that will also come with greater skills and confidence in being able to execute an idea.