The **Keyframe Animation Editor** is Unilighter's multi-track timeline for designing dynamic lighting sequences, continuous pan/tilt movements, fluid color gradients, and tempo-locked parameter sweeps.

![Keyframe Animation Timeline](https://unilighter.cc/info/docs/animations/keyframe/screen_animations_f2da2ddb.png)

---

## ⏱️ Timeline Modes & Tempo Synchronization

Animations can run in either **Time** or **Beat** mode:

- **Time Mode (`ms`)**: Operates on a standard millisecond and second timeline. Ideal for fixed-duration theatrical cues, cinematic fades, or standalone sequences.
- **Beat Mode (`beats`)**: Synchronizes playback directly with the project BPM. In this mode, timeline intervals represent musical beats rather than seconds.
- **BPM Multipliers**: When running in Beat mode, you can scale playback using the BPM dropdown (`8x`, `4x`, `2x`, `1x`, `/2`, `/4`, `/8`). This lets you turn the same programmed pattern into a rapid accent or stretch it across a long musical phrase without moving individual keyframes.
- **Mode Switching**: Switching between Time and Beat automatically rescales existing keyframes (1 second maps to 1 beat) to maintain your layout.

---

## 🎚️ Tracks & Channels

Animations are organized by **Device Tracks** and **Tag Tracks**:

- **Device Tracks**: Target a specific physical fixture in the patch.
- **Tag Tracks**: Target all fixtures sharing a specific tag (e.g., `#wash`, `#beams`).
- **Parameter Channels**: Each track can contain dedicated sub-tracks for fixture parameters, such as `Dimmer`, `Pan`, `Tilt`, `Color (Hue, Saturation, Value)`, `Strobe`, `Gobo`, `Focus`, `Frost`, `Zoom`, `Amber`, and `UV`.

Each parameter channel displays a visual timeline row along with an interactive value box on the left that displays the current evaluated parameter at the playhead.

### Fast Device Track Setup

When adding a device track, the selector carries the parameter choices from the previously selected fixture to the next fixture. Only matching parameters that exist on the new fixture are selected, which is useful for consecutive fixtures with similar profiles.

- Hold **Shift**, **Ctrl**, or **⌘** while selecting a fixture to select all of its available parameters.
- Hold **Alt** to start the fixture with no inherited parameters and choose the channels manually.
- You can still adjust the parameter checkboxes for each fixture before clicking **Add Tracks**.

---

## 💎 Working with Keyframes

Keyframes represent target parameter values at specific points in time. Unilighter interpolates between them smoothly at the console's frame rate.

### Keyframe Visuals
- **Shapes**: Parameter types use distinct shapes for quick identification—diamonds for dimmers and general controls, circles for color channels, squares for pan/tilt positions, and triangles for rotation.
- **Fill Indicators**: The visual fill level inside each keyframe reflects its stored numerical value.

### Creating & Editing Keyframes
- **Double-Click Creation**: Double-clicking any empty spot on a channel row creates a keyframe at that timestamp, automatically selects it, and highlights the channel's value box for immediate typing.
- **Selection & Direct Input**: Clicking a keyframe selects it, snaps the playhead to its timestamp, and focuses the channel value field. Typing a new number instantly updates the keyframe.
- **Creating via Value Field**: When no keyframe is selected on a channel, editing its value field creates or updates a keyframe at the current playhead position. Pressing `Enter` commits the value.

### Multi-Channel Value Editing
You can edit multiple channel values simultaneously:
- Hold `Shift` or `Ctrl` (or click and drag) across channel value fields to multi-select them.
- Typing a value in any of the selected inputs immediately applies that value to all selected channels at the playhead position.

---

## 📦 Multi-Track Selection, Movement & Duplication

The editor supports advanced multi-selection and drag-and-drop workflows for managing large groups of keyframes across multiple tracks:

- **Box Selection (Marquee)**: Click and drag on any empty timeline area to draw a selection rectangle. All keyframes within the box across multiple tracks will be selected. Hold `Shift` while dragging to add to your existing selection.
- **Shift-Click**: Click individual keyframes while holding `Shift` to toggle them into or out of the selection.
- **Moving Keyframe Packs**: Dragging a selected group of keyframes moves the entire pack along the timeline. If you drag the pack vertically and drop it onto another channel row, the keyframes shift across channels while preserving their relative time spacing.
- **Duplicate with Ctrl / Cmd**: Hold `Ctrl` (or `Cmd` on macOS) while dragging a selection to duplicate the entire keyframe pack. The original keyframes stay in place, and the duplicates are placed at the target timestamp and channel.
- **Deleting**: Press `Delete` to remove all currently selected keyframes (this works even if a channel value input field currently has keyboard focus).
- **Deselection**: Press `Escape` or click on an empty timeline area to clear the keyframe selection and reset channel value multi-select.

---

## 📈 Transitions & Easing Curves

The span between two consecutive keyframes defines the interpolation curve between their values:

- **Editing Transitions**: Clicking the transition line between two keyframes opens the Transition Selector popup.
- **Available Curves**: Choose from `Linear`, `Ease In`, `Ease Out`, `Ease In-Out`, `Step` (instant jump/hold), `Sine`, `Cubic`, and other easing functions.
- **Default Transition**: When you pick a transition curve, the editor remembers it and automatically applies it to newly created keyframes.

---

## 👑 The Master Track

At the top of the timeline sits the **Master Track**, which provides an aggregate overview of your entire animation:

- **Synchronized Markers**: Displays aggregate markers wherever keyframes exist on any track below.
- **Inspection Tooltips**: Hovering over a master keyframe displays a tooltip listing every channel and value set at that exact timestamp.
- **Global Time Shift**: Dragging a master keyframe moves all underlying keyframes at that timestamp together, keeping complex multi-fixture cues aligned.
- **Batch Deletion**: Double-clicking a master keyframe opens a prompt to delete all keyframes across all tracks at that time.

---

## 🎬 Live Preview & Playback

- **Play / Pause**: Press `Space` or click the Play button to preview the animation timeline in real time.
- **Preview Toggle**: Enable the **Preview** checkbox to stream the animation's live output to the DMX engine and 3D visualizer.
- **Preview Modes**:
  - **Blended**: Evaluates the animation on top of your currently active show scenes and stage output.
  - **Isolated**: Mutes other active scenes and outputs only the current animation for isolated tweaking.

---

## ⌨️ Keyboard Shortcuts Reference

| Shortcut | Action |
| :--- | :--- |
| **Space** | Play / Pause animation playback |
| **Delete** | Delete selected keyframes (works even when a value input is focused) |
| **Escape** | Deselect keyframes and clear channel value multi-select |
| **Click keyframe** | Select keyframe, seek playhead to its time, and focus value field |
| **Shift + Click keyframe** | Add / remove keyframe from selection |
| **Drag empty timeline** | Box-select (marquee) keyframes across tracks |
| **Shift + Drag empty timeline** | Add keyframes within marquee box to active selection |
| **Drag selected keyframes** | Move keyframe pack across time and channels |
| **Ctrl / Cmd + Drag selected** | Duplicate keyframe pack and place copies on target time/channel |
| **Double-click channel row** | Create keyframe at clicked position and focus value input |
| **Enter in value field** | Commit value to selected keyframe or create keyframe at playhead |
| **Shift / Ctrl + Click value fields** | Multi-select channel value inputs for simultaneous batch editing |
| **Click transition span** | Open transition easing curve selector |
| **Ctrl / Cmd + Mouse Wheel** | Zoom timeline in / out |

