# Graph Editor

The graph editor is a powerful tool used to fine-tune and control keyframes and the interpolation/easing between keyframes. The keyframe values and interpolation can be changed to create dramatically different results. Interpolation between two keys is represented as a graph, or curve, hence the name ‘graph editor’.

<img src="/files/-MfmwKjHFt9ej5UNutpU" alt="" data-size="original">&#x20;

### Creating/Saving Keys (Press S)

You can create/save a keyframe by **pressing “S”** on your keyboard. This saves keyframes of all properties of the currently selected nodes at the current frame. If no nodes are selected, nothing will happen.

Alternatively, you can **double click** (or **right click and press "Add Key"**) on anywhere on a curve, and a key will automatically be added to that curve at that frame.

<figure><img src="/files/nIFYRpUZNoiYpTtpQepo" alt=""><figcaption></figcaption></figure>

### Moving Keys

**Click and drag** on keys to move and adjust them. **Right click** on a keyframe to directly adjust values, tangent types, interpolation mode and delete key.

<div align="left"><img src="/files/-MkaQVxqiAfGfSfwHVyM" alt=""></div>

**Shortcut:** If you don't want to click on the selected keys to move them, you can use the following shortcut to move and drag selected keyframe(s) from anywhere in the graph editor.

* Windows : Hold down **`Alt`** + **Left click**
* Mac : Hold down **`Option`** + **Left click**

> **`Tip:`** Mouse down, then Ctrl + Drag: Move a keyframe(s) (or bounding box if more than one keyframe is selected) left and right without changing the Y-values.

> **`Tip:`** Mouse down, then Shift + Drag: Move a keyframe(s) up and down without changing the X-values.

## Selecting keys

**To Select / Multi select**

* Windows : Hold **`Shift`** + Left click.
* Mac : Hold **`Shift`** or **`Command`** + Left click.

or left click and drag to create a bounding box, every keyframeinside this box will be selected.

<div align="left"><img src="/files/-Mi3fePCKc2Nb0NYdEO0" alt=""></div>

**To add more keyframes to the selection,** hold **`shift`** and mouse drag.

![](/files/-Mi3fp69g4UGJwtCr-bU)

**To remove keyframes from the selection**,

* Windows : Hold **`Ctrl`** + Left mouse drag.
* Mac : Hold **`Command`** + Left mouse drag.

![](/files/-Mi3fu1YmSNSV_1JNEGW)

**Invert Selection**

* Windows : Hold **`Shift`** + **`Ctrl`** + Left mouse drag.
* Mac : Hold **`Shift`** + **`Command`** + Left mouse drag.

![](/files/-Mi3g-Ce3r1kgxNGi2XR)

## Scaling Keys

To scale multiple keys at once, drag the sides of the bounding box. This can be scaled up, down, left and right.&#x20;

<div align="left"><img src="/files/-MhhGZLb4PGCBCrl5TcC" alt=""></div>

To scale along the middle of the bounding box, hold **`Shift`** then drag

<div align="left"><img src="/files/-MiUDbxRp50ee_btEa8a" alt="Scale the keys along the middle with Shift"></div>

## **'Tween' / In-between Button**

This tool help animators create precise in-between keys or overshoot. It's a time-saving tool for animators to pose animations faster.\
This works the same as TweenMachine in Maya.

![](/files/-Mkit018mNQWejvnKvc1)

Hold down **`Shift`** and mouse hover over '**T'** button to create an overshoot.

## Normalize

If the 'Normalize' button is ON, all the selected curves that displayed in the Graph Editor are scaled to fit within a range of -1 to 1. \
This is handy for adjusting multiple curves with very different keyframe values.

![](/files/-MkgyROh2Wt5svWPR8AK)

## Keyframe input

![](/files/-Mkislyxsx0BEiZpJXTK)

The frame and value here is represent a selected key’s current frame and value. You can edit them by entering values from the keyboard and press enter to save the new input.

## Interpolation Types

&#x20;There are 3 interpolation types.

* <img src="/files/-MjamV213vhABNTsW_yZ" alt="" data-size="original"> **Bezier interpolation** uses a curve to interpolate between key values. The handles can be dragged to customise the shape of the overall curve.
* <img src="/files/-MjanM8kBDaX_BiCeJRM" alt="" data-size="original"> **Constant interpolation** preserves the current value until the next key is reached, where the next value is set instantly.
* <img src="/files/-MjanV0nFPGNw2i2BuW9" alt="" data-size="original"> **Linear interpolation** is represented as a straight line between two keys. This creates a constant rate of change from one key value to the next.

## Tangents

By default, tangents are flat. This can be changed with the 'Auto tangent' button. Auto tangent allows the curve to smooth itself out.

<figure><img src="/files/1sQUvDJjAIy63W0VzyEX" alt=""><figcaption></figcaption></figure>

***Right click*** on the selected keyframes to access more options for manipulating tangents.&#x20;

<img src="/files/-MkaOrLpim4qTHY78GM1" alt="" data-size="original">

### Tangent weights

Tangent handles can be set to weighted ON or OFF. If ON, the handle can be stretched out, giving you even more control over the final curve.

![](/files/-Mkgz5r-SMry-HOIVVba)

### Set Broken Tangents

This allows you to manipulate left and right tangent handles individually i.e. moving the left tangent will not affect the right tangent.&#x20;

![](/files/-Mkgzz_Bk1WyOAf5nV6a)

{% hint style="info" %}
Adjustments to the keyframes and curves in the graph editor will dynamically update the animation of the relevant node(s) in the scene, which is a neat property. However, there are cases where such adjustments would not affect the node(s) in the scene due to the presence of overriding animation layers, or if the curves are on a layer with zero weight. For more info, refer to the [Animation Layers](/pixcap-docs/interface/animation-panel/animation-basics.md) section.
{% endhint %}

## Controls and Shortcuts

**Mouse wheel** to Zoom in/out

#### To zoom on X only

* Windows : Hold **`Ctrl`** while using the mouse wheel
* Mac : Hold **`Cmd`** while using the mouse wheel

&#x20;**`F`**  Key, Focuses the graph editor on the selected keyframes. If no keyframes are selected, zooms out on all curves and keyframes. Both X and Y on the graph editor are adjusted.

**`Delete`** key to delete selected keys in the graph editor

#### Select all keys in the graph editor

* Windows : **`Ctrl`** + **`A`**&#x20;
* Mac : **`Cmd`** + **`A`**&#x20;

**Copy selected keys.** Copied keys are transferable across layers.

* Windows : **`Ctrl`** + **`C`**&#x20;
* Mac : **`Cmd`** + **`C`**&#x20;

**Paste** the copied keys

* Windows : **`Ctrl`** + **`V`**&#x20;
* Mac : **`Cmd`** + **`V`**&#x20;

{% hint style="info" %}
Keys will only be pasted for the same node properties and visible curves in the graph editor. For instance, if keys from the position property are copied, pasting the keys into a rotation property will not take effect.
{% endhint %}

#### Copy and cut selected keys.

* Windows : **`Ctrl`** + **`X`**&#x20;
* Mac : **`Cmd`** + **`X`**&#x20;


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://pixcap.gitbook.io/pixcap-docs/interface/animation-panel/graph-editor.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
