Patch Editor: Use Face Movements to Control Animation

You can set an animation to play when a specific face movement or gesture is detected. Here we’ll look at 2 examples:

  • Playing an animation while an interaction is detected.
  • Starting and stopping an animation each time an interaction is detected.

You’ll use a patch representing the face tracker, and an interaction patch. The face tracker patch will detect the movement of the face and the interaction patch will detect a specific facial movement or expression.

You’ll connect these to the Loop Animation and Transition patches, to create the animation.

Playing an animation while an interaction is detected

Creating the patches

To try this out, add:

  1. A face tracker to your project, and create a patch to represent it by dragging it into the Patch Editor.
  2. Add an interaction patch, using the menu in the Patch Editor. For this example we’ll use the Smile patch - but you could choose another interaction patch that detects facial movement.
  3. A Loop Animation and a Transition patch, again using the menu in the Patch Editor.

Next create a patch to represent the property you want to affect. The Position or Rotation properties work well, to either move the object along the X, Y and Z axis or rotate it. In this example, we’ll use Position. To add this patch:

  1. Select an object in the Scene panel.
  2. Click the arrow next to Position in the Inspector.

Connecting the Patches

Now connect:

  1. The Face output in the face tracker patch to the Face input in the Smile patch.
  2. The output of the Smile patch to the Enable input port in the Loop Animation patch.
  3. The Progress output in the Loop Animation patch to the Progress input in the Transition patch.
  4. The output of the Transition patch to the 3D Position input in the patch representing the 3D object.

Here’s how your graph will look:

A patch graph with seven patches.

The final step is to edit the values in the Transition patch, to set the movement of the object. It’s worth experimenting with different values here. For this example try setting:

  1. The X and Z values next to End to 0.
  2. The Y value next to End to 0.1.
A patch graph with three patches.

The object will start at a position of 0 on the X, Y and Z axes, and move upwards along the Y axis:

The effect is seen in the Viewport and Simulator.

You could try checking the box next to Mirrored in the Loop Animation patch, to mirror the movement of the animation.

Starting and stopping an animation each time an interaction is detected

If a patch creates a boolean signal, it sends information to other patches in your graph to say whether something is happening or not. Use the same patches as in the example above to try this out.

Adding the patches

From the menu in the Patch Editor, select a:

  1. Pulse patch.
  2. Switch patch.

The Pulse patch will transform the signal from the Smile patch into a discrete event.

Disconnect the Smile and Loop Animation patches, and add the Pulse and Switch patches between them. Here’s how your graph should look:

A patch graph with nine patches.

The animation will now switch between starting and stopping each time a smile is detected.

Was this article helpful?