Journal 58 — Unity Timeline, Set Up Animations

Objective: Create Timeline in Unity for cutscene and set up animation for game objects

In the example below from “The Great Fleece”, we need to create the completion cutscene with the player successfully escaping.

We can follow a similar Hierarchy as the Game Over Cutscene. If you recall, this will contain the empty game object that holds the Timeline component, prefab animation, virtual cameras, and UI canvas. With the empty game object selected, we can create a new Timeline.

The Win_Level prefab has the Animator attached, so we want to add a new Animation Track to the cutscene empty game object, and drag in the prefab, and add the correct animation clip.

Here’s the complete prefab animation scene to check.

Now we can add the virtual cameras.

Based on the Director’s Notes, the first virtual camera is set up to show the player at the double doors exit.

After creating the virtual camera we can move the scene view to the approximate location and hit Ctrl-Shift-F to align the camera to the view.

Next we can add the Cinemachine Track and drag in the Main Camera.

After that, we can add the Cinemachine Shot for the virtual cameras.

After setting up the first virtual camera, we can add a second virtual camera. Based on the Director’s Notes, this will be a closeup shot of the player turning to the camera and smiling, then the scene fades.

We can add another Cinemachine Shot for the second virtual camera.

Now let’s fix the transition. We can adjust the length of the first camera shot, and move the second virtual camera to the correct time, and by dragging the second shot into the first, we can blend the transition.

To add some camera effects to the first virtual camera, let’s add some noise to mimic camera shake, which Unity includes some presets that range from subtle to extreme or can be customized to your preference.

Now here’s the game view with the camera blend transition.

The last part of the cutscene is to fix the transitions with the screen fade in and out, and the UI. To reduce a few intermediate steps, you can copy the canvas game object from the game over cutscene. This includes the previously created camera fade image and UI buttons.

Now let’s fix the screen fade at the beginning and end of the scene. We can create a new Timeline animation track and drag in the camera fade image.

Now hit record, and set the initial black screen and about a half second later, record a new keyframe with the Alpha set to transparent.

Before setting the rest of the screen fade, we can lengthen the total clip length slightly by simply dragging the animation to a greater duration. This will allow a bit more time to show all the effects.

Now we can fix the fade effect by recording two more keyframes near the end of the clip.

Last we can fix the UI. Since we copied over the Game Over text, we need to change this to a congratulations message which is included in the game assets.

Here’s what the entire clip looks like, minus the fix for the UI.

We can add a new Animation Track for the UI Canvas.

The congratulations message and UI buttons only need to show at the black screen fade in near the end of the cutscene.

Finally, we can see the entire cutscene.

Thank you for your time!

An Engineering Manager consultant who is seeking additional skills using Unity 3D for game and application development.