Content Warning: Distorted facial imagery, horror themes
For this project, I started by thinking about facial expressions.
A facial expression is never really created by one isolated feature. When we smile, frown, or become afraid, different parts of the face move together. The mouth changes, but so do the eyes, eyebrows, cheeks, and other facial muscles. These movements are connected, and we read the relationship between them as an emotion.
Instead of creating several separate objects that interact with each other, I wanted to treat a face as a system of relationships.
One of my main inspirations was the game Who’s Lila?. I was interested in the way the game makes facial expression itself part of the interaction. Rather than treating a face as a static portrait, it makes the manipulation and interpretation of expression feel strange and uncomfortable.
I wanted to experiment with a similar idea in a much simpler way using p5.js.
I created a new variable called let smile;
smile = map(mouseX, 0, width, 0, 1);
I then used the smile variable to control several different parts of the face. As smile increases, both the width and height of the mouth increase. As the smile gets bigger, the eyes get smaller （a negative relationship aha）, and the pupils get bigger.
In the next step, I added eyebrows to make the expression more contradictory.