Quick Tutorials

Here are a few videos to get you started.

01 - Getting Started

This short video shows you how to load Diya, connect screens and preview your animation.

02 - Customizing the Timeline

Here, we see how to open the timeline, customize the transitions and modify the easing with the curve editor.

03 - Flattening Groups

For performance reasons, Diya flattens groups by default. Here, we'll see how to turn this off so we can animate child layers individually.

04 - Animating Symbols

Animate your symbols and reuse them across your prototype. You only have to build your animation once!

05 - On Load Animations

Diya now supports "On Load" animations that will trigger the timeline automatically when the screen loads. This is perfect for animating loaders, spinners and other UI components without user interaction.

06 - Shape Animations

You can now animate between complex shapes in Diya. You no longer need to animate between just rectangles and circles!

07 - Path Animations

Here's how you can create those cool line and path based animations. Super useful to create line art, circular spinners and graphs