Beginner Tutorial


Timeline Basics


20 minutes

Posted on: October 15, 2017

Learn Sumerian
Timeline Basics

Tags

timeline
keyframes
easing

In this tutorial you will learn about:

timeline
easing
animating

In this tutorial, we animate a drone to fly around a large sphere using the Timeline and Keyframes. The Timeline in Amazon Sumerian enables you to create animations and movements for scene entities. You can also trigger them by actions you set in the State Machine.

You’ll learn about:

  • Keyframes
  • Timeline
  • Easing
  • Animation

This is the scene we will build in this tutorial. To play the scene again, refresh your browser. For best results, use the latest version of your browser..

Prerequisites

Before you begin, you should have completed the following tasks and tutorials:

Timeline Editor Interface Overview

In this section, we will get an overview of the Timeline editor interface. Note: We will be using screenshot images from the scene we will create in the next section of this tutorial. To skip to the lab portion of this tutorial and create a behavior of your own, skip down to Step 1.

Creating Timelines

There are two ways to create a Timeline.

The first option is to add a Timeline component to an entity. Select an entity in the Entities panel, and then navigate to the Inspector panel. Choose Add Component, and then select Timeline from the menu.

The second option is to choose Create Entity at the top of the interface and, from the menu, select Timeline under the Others category. This is the option we’ll use here.

This adds a Timeline to the Entities panel.

Timeline Component

  1. From the Entities panel, you can select the Timeline entity. In the Inspector panel, open the Timeline component.

  2. In the Timeline component, you can define three settings:

    • Duration: Sets the length of the Timeline. The default is 10 seconds.
    • Loop: Loops and repeats the Timeline upon completion.
    • Auto Start: Automatically starts the Timeline when play mode is initiated. This is selected by default.
  3. To open the Timeline editor, click Toggle Timeline.

Timeline Editor