Featured, Javascript
comments 3

Weird Faces Study by Matthias Dörfelt using PaperJS

weird_face_study_01 copy


Created by Matthias Dörfelt aka mokafolioWeird Faces Study uses PaperJS library to produce computer generated faces that have a certain aesthetics and are immediately recognisable.

Weird Faces Study is an attempt to combine my old interest in illustration with programing, to create something procedural that has a truly individual artistic touch to it and is not instantly recognisable as a generative art piece. Even though, the faces look hand-drawn, they are entirely expressed by algorithmic rules. Each face is random, each face is unique. Still, they look similar to my actual hand drawn faces.

The faces are generated in a similar way as potato head (the toy). As seen on the right in the image below, Matthias thought about different presets for the different facial features that could then be mixed in arbitrary ways to compose the final face. The presets are expressed entirely algorithmically, so that each preset potentially has an infinite number of variations. Noise is applied to the outlines to suggest a hand drawn and natural gesture.

weird_face_study_05The order of the face generation is:
1. draw head shape.
2. draw fold inside the head shape.
2. find shape center, draw nose.
3. draw eyes based on the nose position and radius to make sure that they don’t overlap.
4. draw eyebrows based on the eye positions and radii.
5. draw mouth based on eyes and nose to make sure they don’t overlap.
6. draw cheeks based on head outline and head radius.
7. draw ears on the head outline.
8. draw hair on the head outline.

Weird Faces Study has been programed in Java Script using the great PaperJS library. The library includes useful functions built in to simplify a lot of the operations described above (i.e. to find the closest point on a path and to find the normal of a point on a path).

Project Page


  • ffd8

    great idea – but with it being made in paperjs, i’m surprised there isn’t an online generator of the contents to have a live demo of it’s output. <- or did I miss an obvious link on the project page?

  • Was wondering the exact same thing…

  • laurelobrien

    I know your comment is old, but I wonder if that defeats the purpose. It would make viewing the results more democratic, but the screen output is probably just a byproduct of the process to get the ink and paper output. Some artists like having control of the output, presentation, seriality etc.