Challenge — Sequencing Animations with Timeline

Tutorial

·

Beginner

·

+10XP

·

30 mins

·

(56)

Unity Technologies

Challenge — Sequencing Animations with Timeline

In this challenge, you'll be animating a brake model to demonstrate the brake’s components.

Languages available:

1. Overview

The goal of this challenge is to apply what you've learned about animations to a GameObject to visualize the anatomy of the object itself. We'll use an automotive brake to explore how we can animate its different child GameObjects to reveal all of it parts and pieces. The provided scene has a brake labeled “PiXYZ-DEMO-BRAKES.CATProduct.” The complete Scene uses a Timeline to coordinate the multiple animations.

To complete this challenge, you will:

  1. Animate the caliper on the Z axis
  2. Animate the bolts vertically on the Y axis
  3. Animate the brake’s back and front on the Z and Y axes

2. Create the Brake Caliper Animation

Create an animation that moves the brake caliper in the negative Z direction.

The final caliper animation

The final caliper animation

(Hint: Click on various pieces of the brake model to figure out which parts you need to use.)

By clicking on the different aspects of the caliper, you’ll see the parts that need to be used inside the Animation Clips.

By clicking on the different aspects of the caliper, you’ll see the parts that need to be used inside the Animation Clips.

(Hint: You can find the Timeline and Animation windows by selecting Window > Animation or Window > Timeline)

1. Open the Animation window (Window > Animation).

Opening the Animation window

Opening the Animation window

2. Create a new Animation Clip and name it CaliperFlyout.

In the Hierarchy, click on the pieces of the Scene that you want to animate and in the Animation window, you’ll find the Create button or Create New Clip.

In the Hierarchy, click on the pieces of the Scene that you want to animate and in the Animation window, you’ll find the Create button or Create New Clip.

Create a brake animation called CaliperFlyout that pulls the calipers away from the center. Highlight the Asset called Brake, and in the Animation window, click Create.

Create a brake animation called CaliperFlyout that pulls the calipers away from the center. Highlight the Asset called Brake, and in the Animation window, click Create.

3. Click the Add Property button and grab the Transform/position of every caliper part in the Hierarchy. 

You’ll need to repeat this process for about six different caliper pieces. Then you’ll move on to Keyframing.

You’ll need to repeat this process for about six different caliper pieces. Then you’ll move on to Keyframing.

4. Zoom out on the Timeline and add a Keyframe (to recap, a Keyframe defines the starting and ending points of any smooth transition) at around 6:00.

Above is an example of how to create Keyframes. Experiment with the time of the second set of Keyframes — 6:00 seemed right to us.

Above is an example of how to create Keyframes. Experiment with the time of the second set of Keyframes — 6:00 seemed right to us.

5. Click Record and drag each of the caliper parts backward in the Z direction within the Scene view.

With the newly created Keyframes selected, click on the record button and manipulate the brake in the Scene view. To save changes made to properties, click the record button again at the end of your changes.

With the newly created Keyframes selected, click on the record button and manipulate the brake in the Scene view. To save changes made to properties, click the record button again at the end of your changes.

Tip — Carefully Add Your Animation Properties

If you simply grab the high-level caliper parts, you will not be able to access the position property in the Animation Clip. Here’s what it looks like when you grab only the higher-level parts.

Here’s what it looks like when you grab only the higher-level names of the parts. Avoid this.

Here’s what it looks like when you grab only the higher-level names of the parts. Avoid this.

3. Animate the Bolts

Create a BoltFlyOut Animation for the bolts in the brake assembly.

The BoltFlyOut animation

The BoltFlyOut animation

  1. Open the Animation window.
  2. Create a new Animation Clip and name it BoltFlyout.
  3. Add each Bolt Transform to the Animation window using the Add Property button.
  4. Add Keyframes that move the bolts in the negative Y direction (Note: Past -3 is a good number as a guideline to ensure the bolts get out of the way of the rest of the brake.)

4. Animate the Brake Backing Pieces

Use the Animation window to create an animation that moves the brake backs outward.

The BrakeBackFlyout animation

The BrakeBackFlyout animation

  1. Open the Animation window.
  2. Create a new Animation Clip and name it BrakeBackFlyout.
  3. Add each back disc part’s Transform to the Animation window.
  4. Move the GameObjects away from the center of the model, creating new Keyframes to lock in the changed Position values.

5. Animate the Manifold

Use the Animation window to create an animation that moves the manifold piece backward on the Z axis.

The Manifold animation

The Manifold animation

  1. Select the Manifold GameObject in the Hierarchy and add a new property.
  2. Add a new Keyframe approximately five seconds into the Timeline, and record the Manifold’s adjusted position on the Z axis.
  3. Deselect record to stop the edit and hit the play button to test the Manifold’s movement.

6. Sequence the Animation Clips with Timeline

Create a Timeline and drag the four animations you created above into the Timeline editor. Drag each clip to the initial timestamp — we want all to play at the same time.

You’ll need to drag all four newly created animations into the Timeline, creating four tracks. Drag each clip to start at 0 so they all play at the same time.

You’ll need to drag all four newly created animations into the Timeline, creating four tracks. Drag each clip to start at 0 so they all play at the same time.

(Hint: The Timeline is responsible for executing Animations in a sequence, but needs an Animator to bind to as well.)

1. Create a new Timeline Asset and name it Explode.

After you create the Timeline Asset, name it Explode, and then double-click on it.

After you create the Timeline Asset, name it Explode, and then double-click on it.

2. Double-click it to open the Timeline Asset in the Timeline window and create or drag the four Animation Clips you created from the Project window to the Timeline.

This is an example of what happens when you drag an Animation Clip into the Timeline.

This is an example of what happens when you drag an Animation Clip into the Timeline.

3. By the time you’ve finished adjusting the clips, your Timeline will look like this.

Notice how each of the clips is dragged right to the zero timestamp?

Notice how each of the clips is dragged right to the zero timestamp?

4. Create a Playable Director on an empty GameObject (called Timeline) and drag it into the Timeline Asset.

Remember, it’s a best practice to create a new GameObject to house your Timeline component.

Remember, it’s a best practice to create a new GameObject to house your Timeline component.

Drag your Explode Timeline into the Playable field of the Playable Director.

Drag your Explode Timeline into the Playable field of the Playable Director.

--------------------

Tip — Create Your Animation Clips Directly in Timeline

Create your Animation Clips directly in Timeline by adding a new GameObject, hitting the record button, and adjusting the object's Position, Rotation, or Scale (depending on your intention). This saves you the step of making them and then adding them to the Timeline.

You can create Animation Clips like we've created in this challenge and then manually drag them into the Timeline. Or you can record animations directly into the Timeline.

You can create Animation Clips like we've created in this challenge and then manually drag them into the Timeline. Or you can record animations directly into the Timeline.

Now drag the Brake GameObject (which has the appropriate controller and Playable Director on it) to each of your Animation Tracks.

Now drag the Brake GameObject (which has the appropriate controller and Playable Director on it) to each of your Animation Tracks.

Amazing! Now that you've built your own Timeline creation, feel free to explore more animations.

Tip — Un-looping your Animations

Having trouble with looping animations? Locate the animation in your Project window, select it to show the Animation Clip Inspector, then ensure Loop Time is unchecked.

 Uncheck this box to make sure the animation doesn't loop

Uncheck this box to make sure the animation doesn't loop

7. Key Takeaways

You've now completed the animation challenge and have animated a brake model, providing users with a clearer view of the brake's many parts, which is helpful when engineering, designing, or reviewing a product.

By completing this challenge, you’re now able to:

  • Create multiple Animation Clips using the Animation window and Keyframes
  • Sequence multiple animations at once using Timeline to increase the amount of activity in a Scene.

Complete this tutorial