The transformation layer allows you to keyframe a transformation of a drawing, an animation or a video. That way, you can move drawings or animations very quickly with a system of keyframes and curves.
The icons visible on the transformation layer are different than those on the other layers.
Tap on this icon to deploy the curves in the timeline and access more options for the transformation and display and change the values for the translation, scale, rotation, and opacity.
The eye enables or disables the layer. When it is enabled, the transformation is active.
You can change the pivot point of each individual layer in the transformation layer’s options which you can access with the next icon.
Tap on the menu icon to access more layer options:
Tap on this icon to duplicate only the transformation layer.
Tap on this icon to duplicate the transformation layer and all the layers contained inside. It duplicates the hierarchy.
This icon flattens the transformation layer. It creates a new single drawing layer with the result of the transformed layers and disables the original layers which remain in the layers pile.
Hierarchy
The transformation layer can contain layers to which it is linked. The layers contained inside a transformation layer are its children and the layer containing the children is the parent.
When the transformation layer is current, you can see its links to its children layers. The children layers are slightly shifted to the right.
You can hide or reveal the children by tapping on the transformation layer.
A transformation layer containing children layers can also be child to another transformation layer, creating another level of hierarchy.
THE TIMELINE
When you create a transformation layer, it will automatically be linked to the last current layer (drawing or video).
Drag layers on the transformation layer to link them to it.
To remove the link between the transformation layer and another layer, drag the layer out of the transformation layer.
The same way, if you wish to remove a layer from this list, go back to the layers pile and drag the layer out of the transformation layer.
Keyframes & curves
Once you have linked a transformation layer to another layer, you can start adding keyframes in the timeline. If your transformation layer is linked to a drawing layer, make sure that your drawing sheet(s) extend to the desired duration of the animation.
You can use the transformation layer on a single drawing, an animation or a video.
You can move your drawing or video in a transformation box like you would when using the transformation tool.
When you transform while holding one finger down, you can snap the transformation box to main guidelines (horizontal, vertical, diagonals and center) and to the box position guidelines.
In the top bar, you get some transformation options.
Allows you to move the canvas with the gestures. If it isn't enabled, you will be able to transform the image with your fingers. When enabled, the transformaiton can only be managed by handling the transformation box and you can zoom and move in the canvas with your fingers.
Sends you to the previous keyframe in the timeline.
Sends you to the next keyframe in the timeline.
Inverts the content of the transformation box horizontally.
Inverts the content of the transformation box vertically.
Resets the transformation.
You can add keyframes from the transformation values, or directly in the curves in the timeline.
Before adding a keyframe, go to the desired frame to set the current frame.
Tap on the dark diamond next to the color to add a new keyframe.
White diamonds indicate the presence of keyframes for specific values (position, scale, rotation, opacity).
Tap on a white diamond to remove the keyframe.
Simply moving your image on the canvas with the transformation box creates keyframes on the current frame for the different values you moved.
The movements of the HUD create keyframes for Positions X, Y, Scale X, Y and Rotation. The respective curves are displayed according to what you are currently changing.
When a keyframe is added, it appears on the current frame of the timeline. You can move the keyframe directly in the timeline to change its frame position, which will also change its values.
If you wish to change the frame position of the keyframe without changing its values, hold one finger on the screen while moving the keyframes.
Hold 2 fingers on the screen to move the keyframes vertically, changing only the values without changing the frame position.
Rotation changes the rotation of the object according to its pivot point. The x in 0x represents the number of times of a full rotation, and + 0° is the value added to the full rotations in degrees.
These values can be changed by moving the transformation box, the curves, or directly by sliding your finger on the values. You can also double-tap on them to enter the desired value manually.
Tap on a keyframe (diamond) to select it. A selected keyframe is orange.
To select multiple keyframes, double-tap then drag the area in which all the keyframes will be selected.
This multi-selection will select the keyframes of all the curves displayed in the timeline. If you wish to select only the keyframes of the Position X, then tap on the eye of all the other curves displayed to hide them before selecting.
On the contrary, if you wish to select the keyframes of all active curves, then display them all on the timeline before selecting.
When one or several keyframes are selected, the action panel appears.
Deletes the selected keyframe(s).
Copies the selected keyframe(s).
Pastes the keyframe(s) starting at the current frame.
These icons represent the strength of the curves of the tangents between 2 keyframes. That way, you can determine how abruptly your animation slows down or speeds up. This is a good way to build your ease-ins and ease-outs.
This example shows the curve of the Position Y values of the animation. Different tangents have been set in order to control the animation speed.
This example is the same as above. The only difference is that all the tangents of the animation curves have been set as linear.