top of page
Screen Shot 2022-10-19 at 6.50.22 PM.png

Facial Expression Amplifier

  • Design and implement an app using facial expression detection API

  • 3-week design sprint

  • Tools: Processing

I designed and implemented an application using Processing and Javascript that will read my facial expression, detect my emotion, and display a real-time overlay on my face to amplify or exaggerate my expression. The purpose is to have fun and make myself or others realize my emotion with a better read of my expression.

What the program does

In this project, I explored facial recognition and integrated it with Processing. I researched and leveraged some facial recognition API to build an app using this technology. For example, face-api.js can help do facial recognition and detection with some JavaScript code. I also learned to write code in p5.js so my code is compatible with the javascript library.


Once I could do facial recognition in Processing, I developed a simple app for expression recognition. Some closest friends of mine used to tell me that they found me having an angry expression but I myself did not realize it. This app will read my facial expression via the laptop camera, and amplify my expression by displaying a matching overlay in the real-time camera image. I hope to make it a starting point for me to better understand my expression :)

Technical features

In this project, I explored and used below technical features of Processing

  • Connect to computer hardware components, like the camera

  • Integrate with an external custom library or API

  • Write Processing code in p5.js which is a javascript

  • Use text, emoji, and images to give feedback to the user about expressions detected

  • Use arrays and for loops to store and iterate through the data

Final Demo

Try it yourself at Open Processing!

bottom of page