Working with the Capo

Let's begin by opening the capo-start document.…I'm going to animate the top green bike all the…way off to the left side of the scene as…well as the orange and the white but I…want to change their start times to be one second apart.…I'm going to record enable the scene, go to…three seconds on the timeline, select the green bike.…And move it off to the left side of the scene.…Now, that's all well and easy when we know that…our animation is going to start at the beginning of the timeline.…You might be thinking, if wanted to delay this, why don't I…just select my animation overview bar and move it out to one second?…While that certainly works.…

There's an easier way.…So, let's undo that so that our animation does start at zero seconds.…And with record enable still on, we're going to…begin the animation of the orange bike at one second.…The cable tool is positioned right here in the top-left corner of the main…timeline, and we can just pull that out, the one second mark.…This now establishes the start of whatever property…

Resume Transcript Auto-Scroll

Author

Released

9/20/2013

Tumult Hype offers a timeline-based toolset for creating efficient, back-end HTML5 and JavaScript code that brings your animations to life. Join Jake Ströh as he shows how to create interactive motion graphics that work on mobile, desktop, and even ebooks, with Hype. First, learn how to animate text, shapes, and images with keyframes; perfect the timing of your animation; and use the Capo tool to create automatic start and stop points. Then learn how to manage interactivity with buttons and actions, and work with relative timelines, which take into account events on other timelines. Finally, you'll add transitions, export your finished project, and add it to an existing website.