(Last Updated On: February 3, 2021)

In Saola Animate, each scene may have numerous elements, such as shapes, text, images, and videos. You can arrange the elements in many ways to create precise and professional-looking scenes. Today’s tutorial shows you how to order elements.

When being inserted into a scene, new elements are placed in front of others and may cover them partly or fully. This stack order of elements is called z-order. You can arrange elements in z-order such as moving them to the front or the back of the other elements with ease.

Ordering Elements Using Order Tools

Suppose that you have a scene with elements inserted in z-order like this:

Example of z-order.

As you can see in this example, rainbow is an upper element because it lies on top of others. To look more naturally, the rainbow should be placed behind the ground, so I will send it backward. To get it done, take the following steps:

Step 1: Select the rainbow element.

Step 2: Click Send Backward button Click Send Backward button on the display order toolbar. on the display order toolbar, or right-click on the Canvas > Arrange > Display Order > Send Backward, or click the Edit menu > Display Order > Send Backward.  

Sending the rainbow element backward means that you move it one step to the bottom.

Sending the rainbow element backward means that you move it one step to the bottom.

If you want to change z-order of other selected elements, do the same for other display order toolbar buttons:

  • Bring to Front: Place the selected element at the very top of the others.
  • Bring Forward: Move the selected element one step to the front.
  • Send to Back: Place the selected element at the very bottom of the others.
  • Send Backward: Move the selected element one step to the bottom.

Ordering Elements by Drag-n-Drop

You can also change the z-order more quickly by dragging and dropping elements in the Timeline or Elements pane. Just select the desired element, drag it to a new position that you want until a blue line appears, and drop it.

Select the desired element, drag it to a new position that you want until a blue line appears, and drop it.

This method can be used to change parents of elements, for example, move elements from their groups to another group. See this tutorial: Grouping Elements for more details.

So, now you know how to change z-order of elements in Saola Animate. Feel free to contact us if you need any support.