Create a 2D character animation
Learn how to create a 2D vector character animation, fine-tune its movements, import assets from Adobe Stock, and publish to a variety of formats.
Learn how to create a 2D vector character animation, fine-tune its movements, import assets from Adobe Stock, and publish to a variety of formats.
Want to re-create this animation? Get the assets
If you want to re-create this animation, save the 2D Animation assets to your own Creative Cloud account. Once in your Creative Cloud Libraries, you can access these assets from the CC Libraries panel in Animate CC.
Note: You need to be signed into your Creative Cloud account to save the library. Get an Adobe ID if you don't have one.
If you want to re-create this animation, save the 2D Animation assets to your own Creative Cloud account. Once in your Creative Cloud Libraries, you can access these assets from the CC Libraries panel in Animate CC.
Note: You need to be signed into your Creative Cloud account to save the library. Get an Adobe ID if you don't have one.
1. Prepare the animation Stage
Create an HTML5 Canvas document and set the stage and document properties to prepare your animation project. Access a vector image from Adobe Stock to use as the background to the animation.
Create an HTML5 Canvas document and set the stage and document properties to prepare your animation project. Access a vector image from Adobe Stock to use as the background to the animation.
2. Create the scene
Add layers to the composition and use drawing tools, such as the Rectangle, Pen, and Brush tools to finish drawing the background scene.
Add layers to the composition and use drawing tools, such as the Rectangle, Pen, and Brush tools to finish drawing the background scene.
3. Import and prepare the character
Create a new layer for the character. Then, import the character, drawn in Illustrator CC, from the CC Libraries panel. Create movie clip symbols and separate the layers to prepare all parts of the character for animation.
Note: Click 2D Animation assets to save the character to your CC Libraries account.
Create a new layer for the character. Then, import the character, drawn in Illustrator CC, from the CC Libraries panel. Create movie clip symbols and separate the layers to prepare all parts of the character for animation.
Note: Click 2D Animation assets to save the character to your CC Libraries account.
4. Animate the character
Learn the difference between frames and keyframes and motion tweens and shape tweens. Then, apply these concepts to apply looping animation to the different parts of the character to create the appearance of realistic movement.
Learn the difference between frames and keyframes and motion tweens and shape tweens. Then, apply these concepts to apply looping animation to the different parts of the character to create the appearance of realistic movement.
5. Add animation to the main timeline
Learn the difference between movie clip animation and animation on the main timeline. Animate the character across the main timeline and fine-tune its path. Define separate animation for a cloud in the sky and test your animation project.
Learn the difference between movie clip animation and animation on the main timeline. Animate the character across the main timeline and fine-tune its path. Define separate animation for a cloud in the sky and test your animation project.
6. Publish your project
Use the publish settings to export your project for use on the web, in Dreamweaver, Muse, or InDesign projects, or to a custom publishing target.
Use the publish settings to export your project for use on the web, in Dreamweaver, Muse, or InDesign projects, or to a custom publishing target.
No comments:
Post a Comment