# Cutscenes

### Camera Cutscene

1. Create a new **Cinemachine Virtual Camera** by selecting **GameObject -> Cinemachine -> Virtual Camera.**

<figure><img src="https://2665493337-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fh8bp6Jx5qkS4c0NEaWR1%2Fuploads%2FXsbhMGHSBT2ysLTaRbec%2FScreenshot_3.png?alt=media&#x26;token=8fd6d06f-4a6e-4d83-953b-2df1f74755bf" alt=""><figcaption></figcaption></figure>

2. You can define whether the cutscene should be triggered by a trigger, interact, or event. In this particular example, I've added a **Cutscene Trigger** component to the Button object and set the trigger type to **Event** as I want to play the press sound using the **Custom Interact Event** component. Then set the **Cutscene Type** to **Camera Cutscene**.

<div><figure><img src="https://2665493337-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fh8bp6Jx5qkS4c0NEaWR1%2Fuploads%2FzTkNFZY9gZqM5IqBagJ2%2FScreenshot_4.png?alt=media&#x26;token=499ded65-2436-49e3-aca1-689af6cc8aab" alt=""><figcaption></figcaption></figure> <figure><img src="https://2665493337-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fh8bp6Jx5qkS4c0NEaWR1%2Fuploads%2F3WWbf684hegG8vGv7r1l%2FScreenshot_5.png?alt=media&#x26;token=ef18e8d0-2f68-4e53-afe5-227cebf5b11b" alt=""><figcaption></figcaption></figure></div>

{% hint style="info" %}
If you enable **Wait For Dialogue**, the cutscene will not be played until the dialogue ends.
{% endhint %}

2. Add a **Playable Director** and **Animator** component to the **Virtual Camera** object.

<figure><img src="https://2665493337-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fh8bp6Jx5qkS4c0NEaWR1%2Fuploads%2FN3m9zb25Uszrcpvmr2Mx%2FScreenshot_6.png?alt=media&#x26;token=95c4e0e0-ebd2-413f-8961-a0899e8c3998" alt=""><figcaption></figcaption></figure>

2. Open the **Timeline** window by selecting **Window -> Sequencing -> Timeline**. Select the object containing the **Playable Director** component, and then click on **Create** in the Timeline window. This action will generate a new **Timeline Asset**.
3. Within the Timeline window, press the plus **(+)** symbol and choose the **Animation Track** option.

<figure><img src="https://2665493337-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fh8bp6Jx5qkS4c0NEaWR1%2Fuploads%2FMPvubSJFresgg9Bt0gpi%2FScreenshot_5.png?alt=media&#x26;token=4397ee39-fd41-4ffe-9c2a-27445c1ecc3e" alt=""><figcaption></figcaption></figure>

6. Assign a **Virtual Camera** to the **Animation** Track field. This will allow us to animate the virtual camera within the timeline window. Next, click on the red record button to start creating the animation.

{% hint style="info" %}
For those unfamiliar with creating animations using Timeline, you can access the Animation window by first adding a keyframe to the timeline track (by moving the object) and then clicking on the **three dots -> Edit in Animation Window**.
{% endhint %}

<figure><img src="https://2665493337-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fh8bp6Jx5qkS4c0NEaWR1%2Fuploads%2FfgQAZeGKdtzX6TecchZE%2FScreenshot_6.png?alt=media&#x26;token=a8b8ddce-04b1-47bd-83d8-2d68262eca45" alt=""><figcaption></figcaption></figure>

7. When you have finished creating the animation on the timeline, be sure to assign all required references in the **Cutscene Trigger** component.

### Player Cutscene

1. Create or copy a **CutscenePlayer** object from the **Playground Demo** scene. This object represents a simplified version of the player that contains only the camera.

<figure><img src="https://2665493337-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fh8bp6Jx5qkS4c0NEaWR1%2Fuploads%2FKdXUduNhnJhvwBvtbvx5%2FScreenshot_8.png?alt=media&#x26;token=703a0f04-a461-41f4-aedc-1e51024cbda6" alt=""><figcaption></figcaption></figure>

{% hint style="info" %}
The *CutscenePlayer* object should contain **Animator**, **Playable Director** and **Cutscene Player** components.
{% endhint %}

2. Create a **Box Collider** object and add a **Cutscene Trigger** component to it. In this example, the trigger type is set to **Trigger** so that when the player enters the trigger, the cutscene will play. Then set the **Cutscene Type** to **Player Cutscene**.

<figure><img src="https://2665493337-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fh8bp6Jx5qkS4c0NEaWR1%2Fuploads%2FkcfSYhVgEiCcGdq1lfla%2FScreenshot_9.png?alt=media&#x26;token=ffa9f7d6-47d2-4e64-bcef-0c99069d41f9" alt=""><figcaption></figcaption></figure>

3. Open the **Timeline Window** and start recording the **CutscenePlayer** object. You can animate the **CutscenePlayer** object as you want, you can add cutstom objects to it, for example hands, and animate them easily.

<figure><img src="https://2665493337-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fh8bp6Jx5qkS4c0NEaWR1%2Fuploads%2FNJKlM47XgrOAWRhtvYS7%2FScreenshot_10.png?alt=media&#x26;token=daa646ea-c004-4530-9d12-43ec8873f861" alt=""><figcaption></figcaption></figure>

4. When you finish animating the **CutscenePlayer**, assign it in the **Cutscene Trigger** to the **Cutscene** and **Cutscene Player** fields.

<figure><img src="https://2665493337-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fh8bp6Jx5qkS4c0NEaWR1%2Fuploads%2FFwrmrOB17DMP4KME09zV%2FScreenshot_11.png?alt=media&#x26;token=0416035d-ffa7-4515-a27c-44690d15ff36" alt=""><figcaption></figcaption></figure>

{% hint style="info" %}
When you enable the **Wait For Blend In** option, the cutscene will not be played until the main camera is blended into the cutscene camera. You can use the **Blend In Offset** value to specify in what time to play the cutscene.

The value 0.5 means that the cutscene will be played at half the blend time for a smooth transition.
{% endhint %}

{% hint style="warning" %}
I highly recommend watching some **YouTube** tutorials on how to use **Timeline**. This will help you unlock its true potential and create fantastic cutscenes.
{% endhint %}

{% embed url="<https://www.youtube.com/watch?v=G_uBFM3YUF4>" %}
