When animating the text box into the main scene, we can coordinate the animation with to the animated products symbol by adding the starting keyframe on frame twenty-seven. This allows enough time for the products symbol to play, and help create the illusion of a sweeping animated effect across the advertisement.
- [Voiceover] So now that we have all of the…scripts working in our animation…now we're gonna go back and animate the text block,…the text, add a web font,…and then we can work on the publishing.…So we're start off by animating the text block.…Now if you did a publish movie,…you probably are seeing the output window here…in place of the timeline.…So I'll come back here and highlight the timeline.…In the top of the timeline panel…where we added the button layer,…let's come in here and hide and block that layer…and then we'll come down…and select that first key frame for the text block.…Now the text block is just a rectangle,…so to animate this we need to convert this to a symbol.…
So let's go up to the modify menu,…choose convert to symbol.…We'll name this text box.…Set the type to a graphic.…Registration point doesn't matter.…Then we'll click okay.…Now the text block is in its final position.…So let's come down to to the text box layer.…Let's come out to frame 48.…With that frame selected let's come up to insert,…
Author
Chris Converse
Released
5/12/2016- Creating a new HTML Canvas project
- Adding artwork, text, and shapes
- Creating and animating elements, including masks and symbols
- Using scripts for playback and interactivity
- Adding web fonts
- Finalizing the animation
- Publishing an Animate CC project
Skill Level Beginner
Duration
Views
-
Introduction
-
Welcome58s
-
-
1. Creating and Importing Artwork
-
Creating a composition5m 20s
-
Adding text and shapes3m 29s
-
2. Creating Animations
-
Animating the final product5m 25s
-
3. Adding Scripts (Actions) for Playback and Interaction
-
Adding timeline actions5m 26s
-
Making the ad clickable5m 44s
-
-
4. Adding Web Fonts and Final Animations
-
Animating the text box2m 31s
-
Using a Typekit web font1m 56s
-
Animating the text3m 24s
-
-
5. Publish Settings
Take notes with your new membership!
Type in the entry box, then click Enter to save your note.
Press on any video thumbnail to jump immediately to the timecode shown.
Notes are saved with you account but can also be exported as plain text, MS Word, PDF, Google Doc, or Evernote.
Share this video
Embed this video
Video: Animating the text box