Introduction to 2D Animation
Adding movement adds life.
If you add movement to artwork you can dramatically increase its chances of getting noticed and this is even more significant on the web where competition is fierce for your users' attention.
The deployment of animated banners is where much of web advertising revenue comes from. This module is an introduction to the tools and knowledge you need to make 2d animation and making a web advert is part of that.
Animations for the web are deployed in several ways
- Coded animation using just HTML5, and CSS3 is an increasingly popular strategy for providing visual feedback such as buttons that swell on a mouse interaction, parallax scrolling effects or images that fade and zoom into or out-of view.
- Broadcast format 2D animation deployed as a video format (MP4, MP5). Adobe Animate, Toon Boom Harmony or Adobe After Effects are the major players for broadcast in the 2D space.
- GIF Animation
- SVG Animation
What about animation for Broadcast?
Adobe Animate exports in all broadcast formats so for broadcast it's still a valid animation tool especially if you're focussing on 2D character animation with audio synch.
After Effects is recommended if you need to work in VFX with reduced emphasis on chararcter animation (although it does have a rudimentary character animation toolset). Toon Boom Animate is a worthy equal to Adobe Animate in the character-animation-for-broadcast space.
How will I be assessed?
You will be assessed using these projects :
- Produce an animated rotoscoped product.
- Design and produce a Web Advertisement that complies with Fairfax Digital Media specifications.
You can find further detail on these assessment tasks in Lesson 7 and the assessment tasks are on our Learning Management System (LMS).
This module delivers and assesses the following unit (link to training.gov.au)
- CUAANM301 Create 2D digital animations
Recognition of Current Skills
If you think you already have the skills required then get in touch with your teacher to verify this. If it's determined that you do, then this means you just need to submit the apporpriate evidence and you don't need to do the learning or assessment tasks.
Archive all your work
It is important you keep all your work somewhere safe; backup to memory stick, hard-drive or cloud storage. As a student of TasTAFE Creative Industries you are responsible for retaining evidence just in case you need to be assessed at a later date.
Like the rest of the modules in the Cert3 Screen & Media, this module is supported by Learning Tasks.
The Learning Tasks are important because they provide an opportunity for you to get feedback as your skills develop.
To many students, the feedback is one of the most important parts of the qualification.
The Software / Hardware
What software do I need?
Mac or PC?
The mac version is almost identical to the PC version, the significant differences being the keyboard shortcuts.
Why Adobe Animate?
The need for skilled animators in general remains high and is growing. Demand for animated online content is surging too. Total Online Advertising Expenditure globally in 2014 pushed toward $4.5B. PwC Report (note: 40% of this figure is video-deployed content). Animated content is a big part of that spend and Adobe Animate still delivers the best "cinematic-quality" interactive products and supports all animation formats across all platforms.
Adobe Animate (aka Flash) remains the choice of Blue Rocket Studios (Hobart) for producing character animation. Their latest 52-episdoe TV production "Fanshaw & Crudnut" is made using Flash CC.
Watch this report on the project from Georgia Love at Blue Rocket Studios, Salamanca Place, Hobart:
Adobe Animate, Toon Boom harmony, SynFig, Tumult Hype 3.5, Sencha or Google Web Designer?
There are alternatives to Animate. Toon Boom Harmony is a very popular tool thanks to its character animation toolset that in some situations (Inverse Kinematics) is better than Animate. It's less than optimal for web animation however.
However Adobe Animate is still the most popular tool for creating animation for web and broadcast thanks to its extensive utility, large established user base and mature learning resources.
There are other options, Synfig is one (with limited web deployment options), it's Open Source and offers a sub-set of Animate's toolset.
Animate | The best 2D animation tool
Animate is a wise choice for developing sophisticated broadcast-ready animated content because it's versatile, flexible and has a wide-range of tools for most animation scenarios.
You can export to a vast range of formats including HTML5 Canvas (for cross-platform deployment) as well as jpg, Illustrator and DXF.
It's primary output file format is .swf, short for Shockwave Flash. Shockwave was the format that Macromedia developed in the early days of Flash. Want to know more on how Flash evolved?
Animate produces small files with big IMPACT !
Animate artwork is based on vector artwork and because of this, animators and designers can produce artwork that behaves and look just like traditional broadcast adverts but without big file sizes. Knowing how to keep file sizes down for adverts is a vital skill for any designer. The bigger the file, the greater the cost to the client.
What can Animate do?
Animate is most famous for animation, however and it's been refined to the point where it can be used to develop entire applications (which run on your desktop, mac, or PC ). It is the "Swiss Army Knife" of multimedia development tools.
It can make WebGL interactive animation, GIF animations, menu front-ends for Playstation games, Mobile Apps, produce adverts for web or broadcast TV & database applications for major players in global finance not to mention the myriad of products emerging from "Rich Internet Application"; developers such as Google Maps, Google Earth, Vimeo, VideoSift, FaceBook and Android for mobile / PDA.
What about After Effects?
Adobe After Effects is a fantastic tool for creating broadcast animation. It's the most popular choice of visual effects professionals.
In this module however, we won't be covering After Effects. If you are interested in learning how to use After Effects it's never been easier; there are thousands of tutorial videos on Youtube. Here's a good place to start. In addition, check out these After Effects tutorial videos from Andy Sykes.
In a logical sequence of delivery, you are expected to cover the following outcomes:
- Keyframe animation
- Motion-tweening animation including shape tweening
- Working with text
- Importing photos/bitmaps
- Using video to help animate (rotoscoping)
- Basic interactivity using Code Snippets
- Editing video using Premiere Pro CC for deployment in Animate
Resources to help support your learning are shown below. These are links to websites that offer tutorial support & other resources for animators from beginner to intermediate to expert.
- lynda.com | beginners to intermediate but not free...although extract samplers are free
- flashkit | beginners to advanced
- Sitepoint | wide variety of tutorials
- fwa | favourite website awards, showcasing a lot of leading-edge web animation
- Adobe TV | A series of tutorial videos covering Flash and Animate from beginner to advanced
- Our 2D Animation Forum | http://ddmstudy.com
- YouTube. Search specifically for what you're looking for and it's highly likely someone will have made a tutorial to demonstrate it. It's Youtube so it's a mixed bunch of good and not-so-good. If you find a good one, spread the word in our Forums.
- Hexjibber | Strange name that betrays the quality of the resource; home of Andy Sykes UK animator. Tutorial videos pitched at beginners new to Adobe Animate.
- The Principles of Animation | The 12 Principles of Animation established by early Disney animators. If you're interested in taking your animation beyond this Module study these to add to your understanding of how to make your animations come alive.
- IAB Interactive advertising Bureau Guide to transitioning from Flash to HTML5