Skip to main content
TikTok Effect House Platform Logo
Latest
Download
Log in
Animation

3D Animation Controller

Effect House supports skeletal animation, a widely used animation technique in 3D animation production which enables a 3D model to be animated by manipulating a virtual armature of the mesh. You can add animated models to your effect to make it appear more dynamic and engaging.

In this guide, you will learn how to import a rigged 3D model with skeletal animation, set up the animation by manipulating the Animation component, and use the 3D Animation Controller node to control the 3D animation.

Import a 3D Animation Asset

Import the 3D model with animation by clicking + Add Asset > Import > From Computer or simply drag the file into the Assets panel.

You can download Alien_assets.zip as an example:

Alien_assets.zip

Note
Note

Select the Import animation checkbox in the pop up window when importing.

Add a 3D Animation Asset to the Scene

After importing an animation, you can see the model in the Assets panel. To add the model to your scene, drag and drop the model from the Assets panel to the Hierarchy panel. The editor will automatically construct the hierarchy with an Animation component attached to the root object.

Tip
Tip

The alien model has skeletal animation, which means it is rigged with multiple joints. You can find these joints inside the model.

Configure an Animation

Click the SkeletonAndRenderRoot object in the Hierarchy panel to open the Animation component in the Inspector panel.

There are three animation clips built into the alien model. You can choose which animation clip you want to play by selecting from the Playback drop-down of the Animation component.

Animation Properties

Playback: The current chosen animation to be controlled with playback.

Animation > Clip: Assign the animation clip to the animation.

Animation > Play Mode:

  • Loop: When you reach the end of the animation clip playback, it will automatically begin again.
  • PingPong: When you reach the end of the animation clip playback, time will “ping pong” back and forth between the beginning and end of the clip.
  • Clamp: When you reach the end of the animation clip playback, the last frame will repeat continually until playback is manually stopped.
  • Once: When you reach the end of the animation clip playback, the clip will automatically stop playing.

Demo effect: 3D Animation Controller node

3DAnimationController.zip

Additionally, you can use the 3D Animation Controller node in Visual Scripting to help set interactions to control 3D animation states. Learn more about the 3D Animation Controller node.

In this example, the alien animation is set to disabled at the beginning of the effect. Then when the screen is tapped, the alien will play the second Animaz0_idle clip (index 1) with a one time loop (loop time 1). After the animation is finished, it will trigger the third Animaz1_walk clip (index2) to play infinitely (loop time -1).