One of the services I offer as part of the FMS TEL team is the creation of bespoke 2D animations. These are most commonly used as small parts of a bigger project, but they can also be stand-alone projects themselves.
Types of animation and choosing the right tool for the job
Depending on the nature of the animation required, and also the context in which it will be used, there are three different types of animation that we can produce.
- Video based animation
- HTML5 (web based) animation
- Animated GIFs
When looking at the source material I will first plan the animation in my head, and will usually know right away which type of animation will be most appropriate for the job. For example, if there are any user interactions to be included then an HTML5 animation would allow for that, but if there is the need for some organic shapes then that would suit a video based animation better.
Planning and Storyboarding
When visualising an animation, I plan the animation as a whole from the start, rather than tackling it scene-by-scene as this gives a more natural and entertaining feel to the end result.
Once I’m happy that I have a good understanding of the content I will then create a series of illustrations as a storyboard and send this as a PDF for review.
I then discuss with the subject specialist which techniques will work best for the application, and raise any concerns. I can then start the animation process.
Creating the animation
Getting things right at the concept and storyboard stage is critical and can save a lot of time, compared to how much of a time investment it can be if you have to re-do a large part of the animation.
However, understanding that I may not get the content perfect in the first draft every time, I structure my files in a way that changes can be made with minimal disruption to the rest of the timeline. This is achieved by both layering up the source Illustrator files and also separating the key points of the main composition timeline into separate sub-compositions. That way I can work on a small section without knocking everything else out of sync.
Obviously, every project is different but by focusing on the movements involved, the flow between the scenes and the basic animation principles I begin the sequence (as you may have guessed) from the start and work on each stage in sequence. This is important because elements will often carry through from one scene to another so duplication can be avoided.
I use Adobe After Effects to create video-based animation and animated GIFs, and Adobe Illustrator to create any graphic and illustration assets needed for the animation. After Effects is an extremely powerful timeline-based tool that can make almost anything possible – think of it as being a kind of Photoshop for video!
If there is to be audio narration or a musical soundtrack on the video, then I arrange for that to be recorded early on in the development rather than being added at the end, as the content and movements should be timed to fit with events in the audio.
Most of the development time actually lies in creating the assets for the storyboard (which are later used in the animation), so when it actually comes to the animating stage things tend to move along pretty quickly.
I usually render out (export) the animation after every new section is complete and upload it our Vimeo account for approval and to check that I’m on the right track before moving on to the next one.
The review process
The Vimeo Review platform we use lets the users add time-stamped comments directly onto the video and sends me a notification email immediately thus providing a good communication channel for each specific issue.
When the first draft of an animation is complete, a shareable, password-protected link to the video can be sent out for a wider review to gather comments and feedback. From there we can address any comments and fine-tune the animation for further revisions, which will in turn be sent out for review.
While there is no standard for this, normally after a first (alpha) release and review, changes are made if required and a second (beta) release is then sent for review, with any further required changes reflected in a final (gold) release.
The finished product
The final render from After Effects will be a simple video file, usually in the .H264 codec (MP4) that can either be hosted on our Vimeo account and an embed code supplied, or, depending on file size restrictions, this could be uploaded directly to your target system. It can also be supplied as a file to be included in a PowerPoint presentation or other teaching material. The type of output required is discussed before we start the project to make sure we are taking the best approach.
I’ve worked on a wide variety of projects during my time at the university, including multiple MOOCs, marketing materials, and work on modules across both FMS and Engineering courses. The showreel below includes just a small sample of the projects I have been involved in.