From the course: Web Motion: Animate a CSS Sprite Sheet

Unlock the full course today

Join today to access over 22,500 courses taught by industry experts or purchase this course individually.

Assembling the project in Edge Animate

Assembling the project in Edge Animate

From the course: Web Motion: Animate a CSS Sprite Sheet

Start my 1-month free trial

Assembling the project in Edge Animate

Now that the content has been created, we can turn our attention to the assembly of the project. The plan is to have our character run in from the right side of the stage, circle behind the incense burner, and run out of the scene on the left. Though we could code this whole thing up using CSS, this is a course for beginners, so Edge Animate as the assembly application makes sense. Based on what has to happen, we can map out our workflow. First, the character needs to be an animate symbol because see it's not only running, but the symbol is in motion as well. We have to be aware that objects moving away from the viewer tend to get smaller, which means scaling is involved, and finally the character runs behind the incense burner, meaning layering order is important. With that in mind, let's get started. And to get started, open the run.an file, located in the Assemble folder found in your download. Now, rather than get fancy, I'm going to show you a rather nifty key hole technique for…

Contents