ICM - Week 1 - Self Portrait

Editable Project: https://editor.p5js.org/sskripak/sketches/HyFSYEJdm

As I started to think about how I wanted to approach my self portrait in p5.js, I began doing rough sketches of my own face from memory and from a photo. The process of doing this I found really satisfying, and it reminded me how much I enjoy doing rough pencil sketches, especially of faces and figures. Often it feels like the image is emerging slowly out of seemingly random pencil scratches.


What I decided at that moment was to make an attempt to emulate this sketchy, imperfect style with p5.js. I find this task particularly intriguing because often what computer imaging seems to be focused on is creating very precise images, and so the idea of pushing back against that norm seemed like a fun challenge.

I started the same way that I would with a pencil drawing - by creating a rough outline of a face with a simple cross to indicate the middle of the face as well as approximately where the eyes would be. I simply used the line and ellipse command for this. I then quickly realized that adding hash marks would make it much quicker for me to estimate coordinates for the lines.

Screen Shot 2018-09-06 at 7.51.02 PM.png

I then set to the laborious task of inputing the four coordinates necessary for each line, and my face started to take shape. As you will notice, I made a deliberate point to use non-round numbers and to avoid symmetry from one side of my face to the other. This was to continue to resist the precision that is often associated with computer imaging. I only broke my strict rule about using only lines to create my glasses and irises.

Screen Shot 2018-09-07 at 11.53.30 AM.png

(note I also changed the color of the guidelines so they would stand out from the drawing marks.)

At this point, all I had left to do was refine and add a bit of color. Both of these things I did in the same spirit of my pencil sketches in that, instead of “erasing” lines, I simply added more lines on top (now in two colors) to create a subtle effect of shading and fill out the expression exactly how I wanted it.

This was one point at which, in retrospect, I imagine there must have been a way to more easily mix lines of two different colors, rather than being forced to type ‘stroke(…)’ over and over again to alternate colors.

self portrait_final.png

All in all, I think if I gained anything it is slightly improved ability to quickly estimate and identify the number values of specific coordinates within the canvas. I look forward to this skill continuing to be useful going forward. That being said, if I were to do it again, especially later in the class I think I would make an attempt to simply create a rudimentary drawing app that would allow me to just make the marks right onto the canvas with my mouse.

ICMStefan SkripakComment