Back to Academy

Design and Animate

The Raylight design panel showing a layer's position, tilt, and effects.

The right sidebar shapes the selected layer. Two tabs, like Figma: Design for how it looks, Animate for how it moves. Same layer, two views.

Design: how a layer looks

  • Position: X, Y, Z, plus roll, flip, and align.
  • Tilt: the X and Y angle that gives it perspective.
  • Layout: size and crop.
  • Appearance: opacity and corner radius.
  • Fill and stroke: a shape's color, a layer's outline.
  • Effects: per-layer drop shadow, glow, and backdrop blur.

Text layers swap all this for their words and font controls.

Scene effects

Select the scene itself, or its bottom layer, and Design adds the cinematic effects that cover the whole frame: depth of field, bloom, vignette, motion blur, color split, film grain, ghost, color grade, and edge fade. The scene background and export sit here too.

Animate: how a layer moves

  • In and Out: the entrance and exit, chosen as presets. Stack more than one.
  • During: blocks you add for movement in the middle.
  • Timing and easing: every block has its own timing, plus an easing or spring curve that sets how it speeds up and slows down.

The picker at the top of the pane adds custom blocks and effects.

Nothing selected

With nothing selected, the sidebar shows the project itself: its name, aspect ratio, and background.