Switching Between Two or More Animations

If you've imported a 3D object with 2 or more animations baked into the file, you can use patches to easily switch between these animations in response to user interaction.

Learn about:

For very simple animated effects, use the animation playback controller.

Animation playback controllers

Each of the animations that you want to play in your effect will need to be assigned to a separate animation playback controller. Find out more about creating animation playback controllers, and assigning animations to them..

Choosing an interaction patch

There are lots of interaction patches in Spark AR Studio. They detect interaction from the user, and output signals that can drive the rest of the graph you build in the Patch Editor.

For these effects, you'll need an interaction patch that creates a boolean signal (a signal that's either on, or off). For example, the Mouth Open, Screen Tap and Happy Face patches.

Switching between 2 animations

Start by creating the animation playback controllers:

  1. Create 2 animation playback controllers.
  2. Apply a different animation to each animation playback controller.
  3. Create a patch to represent each animation playback controller, by dragging each of them from the Assets Panel, into the Patch Editor.


Select the 3D object that you want to animation in the Scene Panel, and click the arrow next to Animation in the Inspector to create a patch representing the property we want to affect with this graph.

Next create 3 patches in the Patch Editor. Right-click, and select:

  1. A Screen Tap patch - or any other interaction patch that creates a boolean signal.
  2. An If Then Else patch.
  3. A Switch patch.

If Then Else can accept different data types. Change the data type to Animation Data using the dropdown at the bottom of the patch.

Next connect the patches. Connect:

  1. The Tap output in the Screen Tap patch to the Flip input in the Switch patch.
  2. The On/Off port in Switch to the Condition input in If Then Else.
  3. The output of one animation playback controller patch to the Then input in the If Then Else patch.
  4. The output of the other animation playback controller patch to the Else input in If Then Else.
  5. The output of the If Then Else patch to the patch representing the animation property of the 3D Object.

So, each time the screen is tapped, a switch is turned on or off. When it's on, the animation connected to the Then port will play, when it's off, the animation connected to the Else port will play.

The graph should look like this:



If you select Simulate Touch in the Simulator, clicking the screen will simulate someone tapping on a device:

“Kako” by manoeldarochadeoliveira is licensed under CC BY 2.0

Switching Between More Than 2 Animations

This time, use the the Counter and Option Picker patches, instead of Switch and If Then Else. You can create both of these by right-clicking in the Patch Editor to open the menu.

Connect:

  1. The Screen Tap patch to the Increase port in the Counter patch, to count how many times the screen is tapped.
  2. The Count output in the Counter patch to the Option input in the Option Picker.
  3. The output of each animation playback controller patch to an input in the Option Picker patch.

Remember to set the Maximum Count in the Counter patch. In the example below we set it to 3, to count through 3 animations and then start again.