Cinematic tool

What is this?

This tool is created with ImGUI and is used for in-engine composing of both cinematics and sequences. The interface and a lot of features are based on the Timeline tool in The Unity Game Engine.

I have been using The Unity Engine for many of my personal projects and have always used the Timeline tool in some way for events, sequences, and cinematics. Our game engine at the time had a very strong base, so I thought this tool would be a great and useful addition to our workflow. I had also become very familiar with ImGUI while creating many small gameplay-specific tools for our projects and wanted to challenge myself by creating something more complex and expandable. This was also a great combination with my already created tool VISION which is my Cinemachine based camera system

Why did i create this?

Unity Engine tool

My tool for our engine

Key Features

Adding tracks and entities

Using the menu bar in the track menu you can add new clip tracks and animation tracks.

Animation tracks start with a null Entity ID which you then can add to using drag and drop from the scene hierarchy. This entity slot can be changed if the developer wants.

The developer can select a track to add keyframes to using the record on the right of the entity bar.

You can then add keyframes by placing the entity the way you like and the timeline marker on the timestamp you want, right-click, and then “Add Keyframe”

Adding keyframes

The developer can select the clip track using the record button on the right of the track name (Clip Track)

To add a clip you drag and drop a camera entity from the scene hierarchy to the track. The clip will then be created with a default time of 2 seconds.

Adding clips

If two clips overlap, then the clip will draw a blending section between the two clips based on the amount of overlapping. This will then be used when playing the cinematic to blend two cameras using an invisible “Transition Camera” that interpolates between the two cameras transforms over the time interval they overlap.

blending clips

On the play and stop menu there is a button for previewing. This button will place all entities in the timeline on the position they would be at on the time stamp the marker currently sits at.

A bonus feature is that if a track is currently selected to record while previewing it will not be affected by the previewing to easily see the other entities’ state at that timestamp

Previewing sequence

Structure

The Timeline asset is structured in a way that makes it easy to access inside the ImGUI code to draw. The track struct holds a vector of its keyframes and clips, and then a Timeline class deriving from a base class called Asset holds all tracks. The Asset base class is used in the engine’s different importers for easy serializing and deserializing.

Tracks

The clip and keyframe structs are the main object types that can be placed and edited inside the Timeline tool. They can’t be placed on the same track and instead use two different track types, “Clip Track” and “Animation Track”.

The animation track stores a specific Entity ID, and then its keyframes are used to animate the Entity.

The clip track doesn’t store a specific Entity to animate and instead stores multiple clips with their corresponding camera to swap between over the timeline.

Track Objects

The keyframe behaves like any other animation keyframe. When created in the timeline, it stores the position and rotation of the entity assigned to the animation track. It then calculates the frame it was created on using some pixel positions and sizes from the ImGUI window. Then it uses its frame to calculate its time stamp.

As stated, clips save their own Entities assigned to them. They aren’t drawn on the window like a keyframe with one timestamp but instead draw a box over a time interval using a start and end time. This is to control which cinematic camera it should render from a specific time interval. If two clips overlaps they will automatically blend with each other using a hidden “Transition camera” over the time they overlap for a smooth transition instead of a hard cut.

the Nerdy stuff

Issues and future work

Track Object Structure

I have realized that as this tool has progressed, it has become increasingly difficult to add new types of tracks or object types because I must keep track of the object I selected. Currently, mouse picking for selection and dragging looks for ImGUI Items but they are handled in the code where they are also drawn.

To fix this issue, I plan to refactor the object types to be classes that inherit a base class that can hold the object type, track ID, and their ImGUI Item so that all selection handling can be in one place.

SHowCase

Saved Timeline Preset (YAML)