Face Generator

link to code


We were tasked to build a generator that makes multiple variations of the same face with parameterized design. The resulting code contains user-defined variables, random(), mousePressed(), and keyPressed().

Design Process

Before coding, it was important to sketch out my ideas and dissect how I could potentially code them. My first idea was the Eye of Horus, which is a Maltese cultural item found on fishing boats. I decided I should instead work on something with more features rather than just a singular eye, but I took inspiration from the sketches.

My next sketch was more similar to my final code, as it features a full face distortion. My goal was to have two completely different expressions morph into one another: a calm, simple smile into a crazy, swirly-eyed gape.

As I coded the face into a p5.js sketch, I considered what shapes would be best. I found that arcs provided the most interesting distortions and was the most lenient. For example, the eye shape is made of 2 arcs and the nose is made of 3 arcs.


Upon playing around with variables and the parts of shapes, I notice there is immense flexibility in the scaling of facial features. Regardless of what the facial features look like, as long as they include two objects in the eye position, one below the two, and one at the bottom in place of a mouth, people recognize the collection of objects as a face.

I also recognize that the nose can be mistaken for a mouth (similar to a :3 face), but this can have an added mystical effect on viewers as they discover what each shape is.


The assignment can be found here from the Critical Computation course website from the MFADT program at the New School University, Parsons School of Design.