How to use the “Animation” and the “Animator” windows in Unity?

Ouzani Abd Raouf
11 min readJun 4, 2020

--

The Animation window allows you to create and view individual animation clips so it can only show one animation clip at a time. You can also import animation clips created with another software. Animation clips store animation for a single gameObject or a single hierarchy of gameObjects.

In addition to animating movement, the Animation window also allows you to animate variables of materials and components and even to add Animation Events, which are functions that are called at specified points along the animation timeline.

The clips you create in the Animation window can be combined and blended between using an Animator controller.

Opening the animation window
Unity animation window
Unity animation window

Now, we will try to make a simple animation with the Animation Window.

1- Create a Cube gameObject in your scene;

2- Select the Cube and in the Animation Window, click on the “Create” Button;

3- A window will come up asking you to specify a filename. Name it whatever you want. I named mine “firstAnimation”. You can also create a special folder for all your animations;

Creating a new animation clip in Unity
Creating a new animation clip

Note that this action will create two files for you:

  • an “Animation Clip”
  • and an “Animator Controller” .
Animation clip and animation controller
Animation clip and animation controller

Also, an “Animator” component is automatically attached to the cube with the Animator Controller file (named “Cube” in our example) assigned to the “Controller” field.

Animator component
Animator component

So, what is an Animator Controller?

An Animator Controller allows you to arrange and maintain a set of Animation Clips and associated Animation Transitions for a character or a gameObject. You can use it to tell your gameObject (or character) which animation to play based on conditions that you specify.

The Animator Controller manages Animation Clips and the Transitions between them using a State Machine. A “State Machine” keeps track of which clip should currently be playing, and when the animations should change or blend together.

The Animation Window is now ready to animate your gameObject.

The Animation window shows the timeline and key frames of the animation for the currently selected gameObject or animation clip asset.

When you start animating various properties within this clip, the animated properties will appear at the left side of the window. If the animation controls multiple child objects, the list will also include hierarchical sub-lists of each child object’s animated properties.

Because there are multiple ways to animate a gameObject in the Animation Window, we will not get into all the possible options. Instead, we will learn some basics through the following example.

1- Make sure the previous cube gameObject is still selected;

2- Enable the recording mode (auto-key mode) by clicking on the red circle to begin the animation process. The Animation window time line is tinted red when in this mode;

In record mode, Unity automatically creates keyframes at the playback head when you move, rotate, or modify any property that can be animated on your gameObject.

3- In the time line, click on the ticked bar at 1:00 to move the playback head to that position;

4- Rotate the cube with the mouse in the Scene view or modify the rotation transforms in the Inspector window for more precision.

The changes you make to the gameObject are recorded as keyframes at the current time shown by the white line (the playback head) in the Animation Window.

Any change to a property such as its position, rotation or scale will cause a keyframe for that property to appear in the Animation window.

Any properties of the gameObject that are currently animated are shown listed in the left-hand side of the Animation Window.

Clicking or dragging in the time line bar moves the playback head and shows the state of the animation at the playback head’s current time. The Inspector and Scene View shows the gameObject at that frame of the Animation Clip.

Any changes to the gameObject are recorded into the Animation Clip asset.

Use the mouse wheel to zoom in the timeline area of the Animation window.

The numbers in the time line are shown as seconds and frames, so 1:30 means 1 second and 30 frames.

Next, we will create another animation clip for the same gameObject.

1- Select the cube gameObject;

2- In the Animation Window, click on the animation list menu and choose “Create New Clip…”;

Like the first time, a window will show up asking you to specify a filename. Name it whatever you want. I named mine “secondAnimation”.

A new animation clip asset is created in the Project window and is now the current animation clip in the Animation Window.

3- Enable the recording mode by clicking on the red circle;

4- In the time line bar, click at 1:00 to move the playback head to that position;

5- Set the X, Y and Z scale transforms to 2 in the Inspector window;

6- In the time line bar, click at 2:00;

7- Set the X, Y and Z scale transforms to 1 in the Inspector window;

8- Disable the recording mode, and click on the play button to test the animation.

Playback and frame navigation controls

To control playback of the Animation Clip, use the Playback Controls at the top left of Animation window.

From left-to-right, these controls are:

  • Preview mode (on/off), always on if record mode is on.
  • Record mode (on/off).
  • Move playback head to the beginning of the clip.
  • Move playback head to the previous keyframe.
  • Play Animation.
  • Move playback head to the next keyframe.
  • Move playback head to the end of the clip.

You can also control the playback head using the following keyboard shortcuts:

  • Press Comma (,) to go to the previous frame.
  • Press Period (.) to go to the next frame.
  • Hold Alt and press Comma (,) to go to the previous keyframe .
  • Hold Alt and press Period (.) to go to the next keyframe.

How to use the Animator window in Unity?

Now that you have created an animation clip for your gameObject (the Cube), let’s see how to use it in the Animator Window.

Unity already created a state machine for each Animation Clip we created for the Cube. You can take a look at it in the Animator Window. To do so, select the Cube in the Hierarchy window and from the menu select Window=>Animator.

Animator window
Animator window

You’ll see an arrow that points from Entry to firstAnimation. This means firstAnimation is the Default State, the state that the state machine is in when first activated. It is colored orange.

If you click the main Play button of Unity, the Cube will rotate because firstAnimation is the default animation and the first one to be executed at runtime.

By default, a new created Animation Clip will loop continuously when activated. If you want to change this behavior click on the Animation Clip asset in the Project window then in the Inspector window uncheck the “Loop Time” option.

If you do not see all the states hold alt and move the mouse with the left mouse button down to navigate in the Animator View.

You can arrange the states in the way that suits you. Just drag them around.

Now we want the Cube to switch between firstAnimation and secondAnimation as soon as the respective animations end. Switching from one state to another is called a transition.

To create your first transition, right-click on firstAnimation. Select “Make Transition” from the drop-down menu, then click on secondAnimation. This creates a transition between the two states. Do the same for the opposite direction, from secondAnimation to firstAnimation.

If you click the main Play button this time, you will see the Cube switching continuously between the two animations: rotating and scaling.

How to control switching between states using Parameters and Conditions?

A parameter is a variable that you specify on the Animator. You can use it to define a condition for a specific transition to happen. You can define more than one condition on a transition. In this case, all conditions have to be met to trigger the transition.

You can assign default values to every parameter in the parameter list.

Types of Parameters:

  • Float: Fractions (0.2, 0.55, 7.42, …)
  • Int: Whole numbers (3, 15, 955, …)
  • Bool: True or False
  • Trigger: Boolean parameter that is reset to false once consumed by a transition
Types of Parameters
Types of Parameters:

We will now take a look on how it works in practice:

In the top left corner of the Animator window, select the “Parameters” tab. Click on the “+” button. From the drop-down menu, select “Trigger”. This creates a new trigger. Name it “nextAnim” for example.

Next, select the transition arrow from firstAnimation to secondAnimation. In the Inspector, scroll to the Conditions section at the bottom. Click on the “+” button. This adds the “nextAnim” trigger as a condition.

Do the same thing with the second transition from secondAnimation to firstAnimation.

If you click the Play button, the Cube will keep rotating (because of the Loop option) but never execute the scale animation. This time we will need to “trigger” the animation manually to switch between the two animations.

To test the trigger functionality reorganize your Unity workspace (layout) so you can see both the Animator window and the Game window at the same time. You can do that by dragging and dropping the name of the windows. Make sure that the “Maximize On Play” button in the Game window is disabled. Click on the Play button and then click on the radio button after the nextAnim parameter. A swapping between the two animations happens every time you click on the radio button.

We will do the same thing but this time using a script. In the following example, the trigger is set to true (enabled) whenever the space button of the keyboard is pressed. Remember that a trigger is a Boolean value that is automatically set to false (disabled) after it have been consumed by a transition.

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
public class MyTrigger : MonoBehaviour
{
// Update is called once per frame
void Update()
{
if (Input.GetKeyDown("space"))
{
//Get the Animator component reference from the current gameObject
Animator cubeAnimator = GetComponent<Animator>();
//Enable the trigger
cubeAnimator.SetTrigger("nextAnim");
}
}
}

Attach the above script to the Cube gameObject, click on the Play button and then press the space key to enable the trigger.

The transition settings

In the Animator window, click on a transition to see its settings in the inspector window:

  • Has Exit Time determines whether the transition can be triggered at any time, or only after the specified exit time.
  • Exit Time is the earliest time after which the transition can start. It is represented in normalised time. An exit time of 0.70 means the transition starts only when the animation is 70% complete.
  • Transition Duration and Fixed Duration allow you to specify how long the transition takes. If Fixed Duration is enabled, specify the duration in seconds. Otherwise, specify the duration in normalised time.
  • Transition Offset controls the offset of the time to begin playing in the destination state which is transitioned to. For example, a value of 0.6 would mean the target state will begin playing at 60% of the way through its own timeline.
  • Interrupt Source controls whether the transition may be interrupted, for example, when another transition is triggered.

How to use Animation Events in Unity?

Animation Events allow you to call functions in the object’s script at specified points in the timeline.

The function called by an Animation Event also has the option to take one parameter. The parameter can be a float, string, int, or object reference, or an AnimationEvent object. The AnimationEvent object has member variables that allow a float, string, integer and object reference to be passed into the function all at once, along with other information about the Event that triggered the function call.

To use Animation Events, you need a script with a public method that do something you want to happen at a specific time in the animation clip. You can create a new script or add this method to an existent script like the one we used previously to trigger the animation clips. We will use the second option. We will add a method that prints a message to the console.

public void PrintMessage(string s)
{
print(" Event: " + s + " called at: " + Time.time);
}

Now you need to create an Animation Event that calls this method. Switch to the Animation View while the Cube is selected in the Hierarchy and pick the firstAnimation animation clip. In the Time Line set the playback head to 0:30. Then click on the button Add Event.

The Events added to a clip are shown as markers in the Event line.

When you add an Event, the Inspector window displays several fields. These fields allow you to specify the name of the function you want to call, and the value of the parameter you want to pass to it.

Click on the marker for the Animation Event you just created. In the Inspector window, select the function “PrintMessage” from the dropdown list, and fill the empty string field with a string of your choice.

This creates an Animation Event that calls the method PrintMessage () at 0:30.

Click the Play button to run the scene. You should see a message in the Console window each time the playback head goes through 0:30 in the time line.

--

--

Ouzani Abd Raouf
Ouzani Abd Raouf

Written by Ouzani Abd Raouf

Computer Science Engineer and Cisco Instructor

Responses (1)