Skip to main content

Interactivityv4.0.475

Studio interactivity means visual edits that are written back to your codebase.

Edits can be undone with ⌘/Ctrl + Z and redone with ⌘/Ctrl + Y.

Selecting edit targets

  • Select sequences, sequence props, effects, effect props, keyframes and easing segments.
  • Hold Shift to select ranges.
  • Hold ⌘/Ctrl to toggle items.
  • Drag on the timeline to marquee-select sequences, keyframes and easing segments.
  • Press ⌘/Ctrl + A to select all sequence rows.
  • Use outlines, the selection palette and row highlights to see which items will be affected by the next edit.

Canvas edits

  • Selectable sequences show outlines directly in the preview when they can be edited from the canvas.
  • Drag selected outlines to move sequences by updating style.translate.
  • Move multiple selected sequences together.
  • Hold Shift while dragging outlines to lock movement to one axis.
  • Drag outline edges to scale selected sequences when style.scale is editable.
  • Drag outline corners to rotate selected sequences when style.rotate is editable.
  • Drag the transform-origin handle to move the transform origin. Studio compensates style.translate so the visual position stays stable.
  • Edit keyframed style.translate, style.rotate or style.transformOrigin values from the canvas. Drags create or update keyframes at the current frame.

Effects in the preview

  • Drop effects onto outlined sequences when the sequence supports effects.
  • Drag UV-coordinate handles for selected effects and effect props.
  • Use connected handle lines to see which handles belong together.
  • Copy selected effects with ⌘/Ctrl + C and paste them with ⌘/Ctrl + V.
  • Copy and paste individual effect prop values, including keyframed effect params where supported.

Keyframes

  • Select keyframes in the timeline.
  • Drag selected keyframes horizontally to change their frame.
  • Move multiple selected keyframes together.
  • Move keyframes for sequence props and effect props.
  • Press Delete or Backspace to delete selected keyframes where supported.

Easing segments

  • Select easing segments between keyframes.
  • Open the easing context menu to set Linear, choose a preset or open the custom easing editor.
  • Apply easing edits to all selected easing segments.
  • Press Delete or Backspace to reset selected easing segments to linear when only easing segments are selected.

Deleting, resetting and duplicating

  • Press Delete or Backspace to delete selected keyframes, sequences, effects or all effects where supported.
  • Reset selected sequence or effect props to their defaults with Delete or Backspace when deletion does not apply.
  • Press ⌘/Ctrl + D to duplicate selected sequences.