phase logo
Product
Learn
phase logo
Product
Learn
Editor

Design Motion

From Design to Animation, All in One App.

Editor Hero Left Pattern
Editor Hero Bottom Pattern
Editor Hero Illustration

Why Designers Love Us

Easy to Learn

For all levels of design expertise.

Hand-off is Simple

Developers can use your animations out of the box.

Web-Based

Design and Animate in your browser.

Design

Explore Our Creative Tools.

Pen Tool

Craft intricate shapes with ease.

Shapes

Design simple structures effortlessly.

Containers

Organize the layout with spatial boundaries.

Boolean

Creating new elements by merging.

Origin

Set reference points for precise animation.

Mask

Hide elements non-destructively.

Animate

Why Would We Settle for Static Designs, When We Can Add Motion?

Intuitive Keyframes

Keyframes are automatically added when we make changes to elements on the canvas or in the properties panel.

Trim Path

Reveal or conceal shapes and paths to create dynamic movement.

Easing

The key to smooth transitions between keyframes.

Import

Import and Customize Design.

Lottie Animations

Choose from a variety of animations from the Lottie library.

Image

Add movement to images in just a few steps.

SVG

Easily animate files exported from Figma or other tools.

Export

Shipping Our Work is Fast and Easy.

Lottie

For seamless web and mobile use.

GIF

To share looping animations.

MP4

For videos without compression loss.

Collaboration

Discover How Teams Work Together in Phase.