Using the timeline

Delete

The Flipbook tools are only available in Sketchbook Pro on Mac and Windows desktop


The timeline is where you will find all your primary animation tools. This is where you create and manage your keyframes, enable/disable onion skinning‍ (ghosting) and preview your animation (scrubbing the timeline or playback).

A labeled image of the Sketchbook Pro FlipBook timeline

  1. Commands for creating, duplicating and clearing frames and keyframes
  2. Starting frame of the flipbook
  3. Playback range - Start frame
  4. Frame bar to select and scrub across frames
  5. Current frame is highlighted in blue
  6. Background - create/edit a common background used across all frames.
  7. Playback range - End frame
  8. Number of all frames in the flipbook
  9. Auto Keyframe setting
  10. Loop Setting
  11. Ghosting controls for previous and next keyframes
  12. Playback controls
  13. Playback range scroll bar


Creating a new keyframe

  • Select the empty frame in the timeline you want to make into a keyframe.
  • Tap the Add Keyframe icon 
    • This converts the empty frame to a keyframe.
    • The keyframe will have its own new layer stack. 

  1. Indication that you are working in “Foreground” and the keyframe number
  2. Count of layers/groups used/available
  3. An initial blank layer 

Duplicating a keyframe

Duplicating a keyframe can be an effective starting point for a new keyframe. It inherits the same layers and layer order for you to adjust and build on.

When you have a keyframe selected in the timeline, tapping the duplicate keyframe icon will place the duplicate in the next frame

If you have an empty frame selected, duplicate keyframe will automatically duplicate the last keyframe into the selected frame.

Moving keyframes

To move a keyframe, tap-hold and drag it to the new location. 

When you hover over the preview of a keyframe, a hand cursor will appear.

Once you tap-drag, the preview will appear as the cursor and as you drag, frames will highlight to give you feedback on which frame you are over. 

Once you release the keyframe, it will instantly move to the new position in the timeline.

Pasting from clipboard

When you have an image copied to your clipboard, you can paste into a layer stack or you can use it make a new keyframe.

Pasting to a keyframe or the background

  • Select the keyframe or background and open the Layer Editor
  • Select the layer that you want the pasted image to be above
  • Edit > Paste
    • Windows Ctrl+v
    • Mac CMD+v

Pasting to make a new keyframe

  • Select the empty frame you want to make into a keyframe
  • Edit > Paste
    • The frame will be converted to a keyframe with one layer containing the image from the clipboard
  • Tips
    • This is an effective way to quickly make repeats of existing keyframes when you do not require the full layer stack duplicated in each instance.
    • Use Edit > Select and  Edit > Copy Mergedto quickly capture all the visible content in a layer stack into a flattened image .

Inserting an empty frame

Empty frames are not blank; they are extensions of the preceding keyframe. When you tap on an empty frame, it will always show the content of the keyframe it is associated with. Use empty frames to define the duration of your keyframes. 

When you tap the Insert Empty Frame icon [icon], it will add a new frame to the next frame position, shifting all the following frames/keyframes to the right. 

When you have an empty frame selected, the frame bar will highlight blue to show the keyframe associated to it.

Clearing a keyframe

When a keyframe is selected, the Clear Keyframe icon will show in this position in the timeline. 

Tapping the Clear Keyframe icon will remove the keyframe, making it an empty frame.

  • This will not shift any frames or keyframes in the timeline.
  • Remember, this action deletes the entire layer stack that was associated with that keyframe. 

Deleting a frame

When an empty frame is selected, you can delete it.

Deleting a frame will remove it and shift all subsequent frames and keyframes to the left.

Auto keyframe

This is a setting that enables quickly converting an empty frame to a keyframe by tapping in the canvas.

When the icon is dark gray, Auto Keyframe is enabled.

Looping the animation

This is a setting that toggles on/off looping for playback. This applies for the Play button (for the selected range) and Play All (to play every frame in the Flipbook.

Playback controls

The Playback controls let you play back by jumping to the beginning (frame 1), step back 1 frame, step forward 1 frame, or jump to the end of the animation.

  1. Go to beginning - takes you to first frame
  2. Go to previous frame
  3. Playback range
  4. Go to next frame
  5. Play back all frames in Flipbook

Creating & editing the background

The background applies across all frames within the Flipbook. 

Toggling the eye icon on the Background layer toggles background visibility.

Tapping on the background layer will open it in the Layer Editor. When active, the background layer will be outlined in blue in the Timeline. While in the background layer, other keyframe tools are disabled.

While working in the background layer, the Layer Editor panel will update to note Background Layers, of which there is a maximum of 20. 

Setting a frame range

The frame range is the number of visible frames you can see in the timeline. In this image, you can see the that range of what you see matches the Start/End fields as well as in the scroll bar.

Adjusting the range can be done in two ways:

  • Click-drag the handles at the ends of the scroll bar.
    • Pulling the bar wider will show more frames
    • Pulling it closer together will show less frames
    • The maximum number of frames you can set is dependent on the available space in the Timeline window and the minimum width of each frame where you can still select and interact with them.
  • Alternatively, you can also enter specific values into the Start and End fields.
    • The same maximum number of frames also apply.

Scrubbing the frame bar

Another method of previewing motion is to tap in in the Frame bar and drag left and right. This will dynamically update the canvas view and the frame you release on will be the active frame.