Animation Studio

Animate every layer on one visual timeline.

Choose the property, trigger, and timing, then shape every point on one visual timeline.

See the timeline
0s1s2s3s4s5s6s7s8s
1000ms1000ms
1000ms
2200ms
1500ms
900ms

Motion for every page layer.

Animate text, images, shapes, and components without rebuilding the page around the effect.

Start building

01 / Add animation

Build an animation in three choices.

Choose the property, trigger, and timing. Lucra adds the new track to the timeline so you can preview it immediately.

Add animation

Forest Headline

123

What should animate?

Choose one property. You’ll choose when it runs next.

Search properties
CountRepaints
HideInstant
ShowInstant
Typewriter InInstant
Typewriter OutInstant
OpacitySmooth
TranslateSmooth
ScaleSmooth
RotateSmooth
Background colorRepaints
Text colorRepaints
Border colorRepaints
Border radiusRepaints
FilterRepaints
Box shadowRepaints
Layout positionLayout
WidthLayout
Min widthLayout
Max widthLayout
HeightLayout
Min heightLayout
Cancel

02 / One timeline

Arrange every move on one timeline.

See every property track against the same time ruler. Drag a start, end, or point to shape the sequence.

0s1s2s3s4s5s6s7s8s
1000ms1000ms
1000ms
2200ms
1500ms
900ms

03 / Magnetic snapping

Snap ensures perfect coordination.

Drag a point near a matching track and it locks to the same time. Hold Alt when the point should stay independent.

0s1s2s3s4s5s6s7s8s

04 / Easing gallery

Make the movement feel natural.

Compare easing curves on the selected segment, then choose the one that gives the movement the right pace and feel.

5s6s7s8s

Property

Translate

Smooth

Editing

Segment 1 easing

Easing

easeInSine

easeOutSine

easeInOutSine

easeInQuad

easeOutQuad

easeInOutQuad

easeInCubic

easeOutCubic

easeInOutCubic

easeInQuart

easeOutQuart

easeInOutQuart

easeInQuint

easeOutQuint

easeInOutQuint

easeInExpo

easeOutExpo

easeInOutExpo

easeInCirc

easeOutCirc

easeInOutCirc

easeInBack

easeOutBack

easeInOutBack

easeInElastic

easeOutElastic

easeInOutElastic

easeInBounce

easeOutBounce

easeInOutBounce

05 / Timeline scale

Zoom in to maximize precision.

Scale the ruler from 50% to 1600%. Layers, property controls, and playback stay fixed while the timeline opens around the point you are editing.

0s1s2s3s4s5s6s
0.00100%