EmoEase

A projection installation that responds to visitors’ presence using Kinect, particles, and emoji.

  • TouchDesigner
  • Kinect
Timeline
Oct 2023 – Nov 2023
Role
User research, interaction design, and development
Outcome
Interactive projection installation
Final installation
Section

Research context

I started EmoEase with a personal question: why did social media sometimes leave me anxious even when I knew much of what I was seeing was curated or exaggerated?

In a survey with 106 valid responses, 77 people (72.6%) said they had been troubled by over-packaged content on social media.

Six interviews showed different reactions. One interviewee said people tend to notice such content only afterward and feel embarrassed to say so. Another said that once they noticed content was exaggerated, they turned to friends for support, and another mentioned connecting with people in real life.

Building the projection

I built EmoEase in TouchDesigner as a projection that combines two layers in one image: imported social media footage, which I processed into layered trails, and the visitor’s body, which a Kinect turns into a particle silhouette surrounded by emoji.

I also set a simple rule for how the projection changes with the number of people in front of it. The thresholds were my own choice.

The two layers and their merge, in three columns. Type 1 builds trails of social media imagery from a randomized sequence of layers; type 2 builds the emotion visualization, generating particle streams, outlining a body from them, and growing emoji from detected facial expressions; the third column shows the two merged into one field of emoji over a particle silhouette.
The footage layer, the particle body layer, and the two merged
How the projection was built

Body tracking. A Kinect supplied the depth image and the skeleton.

The body layer. The depth silhouette drives a particle system, so the visitor appears as particles rather than as camera video. In the design, facial expressions map to the emoji that grow out of the silhouette; the mapping is a visual rule and does not identify how anyone feels.

Compositing. The two layers merge with a maximum operation, which keeps the brighter of the two at each pixel.

Interaction rule. The flowchart is the interaction specification I wrote for the number-of-people rule.

The interaction flowchart. From a start box a visitor stands in front of the sensor, which branches on how many people are present: one goes straight to performance mode 1; two and more than two each ask whether they are interacting, and a no on either branch returns to mode 1 while a yes gives mode 2 and mode 3. All branches meet at a single output. A dashed line across the diagram separates what the visitor sees from the camera, computer, and sensor that stay invisible.
The interaction specification, with the modes as planned

In the room

I used emoji as the visual language because they come from the platforms the project was questioning, so the projection answers in their vocabulary.

The installation ran with visitors interacting with it, as the demo video and the photo below show, but I did not formally evaluate whether it changed their awareness.

The installation seen from the back of the room. A visitor stands in silhouette at the left edge, the projection covers the wall in front of them with emoji around a yellow particle figure, and the Kinect sits on a low stand below the image.
Installation in use

Credits

Skills
  • Interaction design
  • Creative technology
  • User research
  • Experience design
  • Prototyping
Tools
  • TouchDesigner
  • Kinect
Roles

Design and development

  • Zhuoqi Liu

Portfolio guidance

  • Vince Ye