Introduction to Unity Timeline
Games often use cutscenes to engage the player and tell parts of the story. The Unity Timeline allows you to harness your in-engine assets to create highly customized cutscenes. By Anthony Uccello.
Sign up/Sign in
With a free Kodeco account you can download source code, track your progress, bookmark, personalise your learner profile and more!
Create accountAlready a member of Kodeco? Sign in
Sign up/Sign in
With a free Kodeco account you can download source code, track your progress, bookmark, personalise your learner profile and more!
Create accountAlready a member of Kodeco? Sign in
Sign up/Sign in
With a free Kodeco account you can download source code, track your progress, bookmark, personalise your learner profile and more!
Create accountAlready a member of Kodeco? Sign in
Contents
Introduction to Unity Timeline
25 mins
- Getting Started
- What Exactly Is a Timeline?
- Lights, Camera, ACTION!
- Creating the Timeline GameObject
- Animating the Jump!
- Recording Keyframes
- Adding Animation Clips
- Adding Cameras
- Time to Get Treasure!
- Facing the Treasure
- Approaching the Treasure
- Opening the Treasure
- Managing Complexity: Grouping Tracks
- Where to Go From Here
Recording Keyframes
Since the Hero GameObject track represents the position of the hero, you need to set it’s position as a starting keyframe.
Select the Hero track in the Timeline window and click the Record button (red circle) to begin recording. Select the Hero GameObject in the Hierarchy window and set the X Position to -1, then immediately set the X Position back to 0.
Go back to the Timeline window and click the Record button on the Hero track to stop recording. This has now added a keyframe for the starting position of the hero:
In this project, the hero was already in the position where he needed to begin. However, until you actually change the unit position, it won’t register as a keyframe while recording. So if you ever need to set a keyframe while recording for a position where the keyframe already is, just move it and move it back to register it.
An easy way to do this is to set the X Position of the object to -1 of its current position, then set it back. You will use this trick a few times in this tutorial.
Next, you will have the hero idle for 100 frames before he jumps off of the tower. Currently, you have only set the starting position of the hero, but you need to set the hero to the same position (i.e. the top of the tower) 100 frames later — otherwise, Unity will start interpolating a movement animation immediately.
Just as before, select the Timeline GameObject — this time, however, you should click the frame box at the top and type in 100. This sets the keyframe to frame 100.
Click the Record button on the Hero track. Select the Hero GameObject and, under Transform in the Inspector, set the X Position to -1, then immediately back to 0. Click the Record button once again to stop recording.
Now you have setup the Hero starting keyframe and are in a good place to continue on with animations.
Adding Animation Clips
Setting Position Data
First up, you’ll need to set your position data.
Click the Timeline GameObject to select it. In the Timeline window add an Animation to the Model track by right-clicking (Command-clicking on a Mac) the Model track and selecting Add From Animation Clip. Now, select the Idle animation:
Next, you’ll animate the hero to jump off of the tower, but you first need to move him up and over the railing, then down towards the ground.
To do so, first select the Timeline window and then set the frame to 138. Click the Record button on the Hero track. Now, select the Hero GameObject. Under Transform in the Inspector, set the Y Position to 3.934 and the Z Position to 1.97.
Return to the Timeline window and set the frame to 176. Select the Hero GameObject again and set the Y Position to 0 and the Z Position to 5.159. End recording by clicking the Record button:
Save the scene and press Play to see your work!
Adding Animations
You’ve set the position data but not the animations to go with them. You’ll sort that out next.
With the Timeline window selected, right-click (Command-click on a Mac) the Model track and click Add From Animation Clip, then select Jump. This should add a Jump animation right next to the Idle animation.
Drag the right side of the Jump animation to set it to frame 176. Now, you’ll add another Animation Clip — only this time, you’ll add the Land animation (you don’t need to change it’s length; just add it):
Save the scene, press Play and behold your work!
Adding Cameras
It’s a little hard to follow the action after the hero makes the jump off of the tower, so now would be a good time to start working with cameras.
Using the Hierarchy window, rename MainCamera to Camera1. Select the Timeline GameObject. Drag Camera1 onto the Timeline window, which will prompt you to select a track; select Activation Track. Drag the Active bar for the Camera1 track so that it finishes at frame 157:
The Activation Track is what determines whether a GameObject is active or not during a scene. Your main camera will now turn off after frame 157. Press Play and have a look:
You will now add another camera — only you will position this camera overhead so that it can get a bird’s-eye view of the hero after he’s jumped over the tower railing.
In the Hierarchy window, select Camera1, and duplicate it by pressing Control-D (Command-D on a Mac). Rename the duplicate to Camera2 and set it to be disabled.
In this tutorial, you’ll use two more cameras, so make them now by following the same steps; rename them Camera3 and Camera4, respectively, and be sure to disable them. After you are done, all the Camera GameObjects, except Camera1, should be disabled. This is what your hierarchy should look like now:
Now, you’ll position Camera2. Select Camera2 and below Transform in the Inspector, set its Y Position to 10.75 and its Z Position to 2.84. Set its X Rotation to 79.5:
As with Camera1, select the Timeline window and drag Camera2 from the Hierarchy onto it; again, this will prompt you to choose a track so select the Activation Track. Now, slide the Active bar so that it begins right after the end of the Camera1 activation (frame 158). Drag the right side of the Active track for Camera2 so that it ends at frame 216.
Save the scene, press Play and watch as your scene now has a camera cut!
Time to Get Treasure!
Facing the Treasure
Now that your hero has landed on the ground, he should turn towards the treasure chest and start walking.
Select the Timeline GameObject and set the frame to 202. Click the Record button on the Hero Track to begin recording.
Select the Hero GameObject and beneath Transform in the Inspector, set the Y Rotation to -1, then immediately back to 0 to set a starting keyframe for the Hero GameObject’s rotation.
With that complete, again select the Timeline GameObject and set the frame to 216. Again select the Hero GameObject and, beneath Transform in the Inspector, set the Y Rotation to -90.
The hero should also be idling during this time, so add an Idle animation to the Model Animation Track, and have it last until frame 216:
Now the the hero has landed safely and is looking at the treasure. It’s time to head over and open it!