Composing Inside the Frame Scaffolding Motion Design Literacy for After Effects
Designed by Dan Liddle
Purdue University
OVERVIEW
After Effects is a powerful program for blending text, video, and animated graphics, allowing for multi-modal compositions that bridge the gap between the visual rhetorics of document design and video production.
But After Effects can also be daunting for students and teachers to work with for the first time. In this poster I discuss how I scaffold assignments and design challenges in order to help students make rhetorical decisions in designing motion graphics.
Research Questions
1. What is gained and (what is the cost) of assigning animation and/or motion design assignments in a professional writing class?
2. How can we scaffold concepts, small assignments, and major projects in order to simultaneously support students navigating complex design tools while avoiding teaching the tools?
COURSE INFORMATION
Course Title: Multimedia Writing
Course Length:
16 Weeks
Enrollment
Third and fourth year students majoring in professional writing, computer graphics, and computer science.
Classroom Tech
A computer lab equipped with 27 inch iMac computers and the full Adobe Creative Cloud (CC 13).
Course GOALS
Interrogate
the ideological ground of seemingly neutral design terms, such as beautiful, natural, modern, simple.
Identify
specific genre conventions of multimedia artifacts and compare these conventions within and between genres.
Reflect
on the process of composing multimedia, including strategies for invention, organization, iteration, and delivery.
Design
a range of multimedia products, using color, typography. space, and motion to support the stated purpose.
Compare
the rhetorical affordances and limitations of print texts, hypertexts, images, videos, and animated elements.
Appraise
the workload of a potential multimedia project, including planning time, production time, rendering, and distribution.
(Hover for Detail)
Student INFO*
*
Previous Experience With tHE ADOBE CREATIVE CLOUD?
Previous Experience With Video And/OR Animation?
What is Your Major?
Data taken from surveys distributed during the first week of class. 72 out of 80 students completed the survey.
"Previous experience with creative cloud?" reflects an aggregation of questions about Adobe Illustrator, Photoshop, InDesign, After Effects, and Premiere Pro.
"Previous experience with video and/or animation" reflects an aggregation of separate questions about video and animation.
Rhetoric and Motion DESIGN
Animation Ethos
Just like typefaces and colors can have distinct personalities or "personas." (Brumberger 2003) every animation has an opportunity to convey a distinct personality as well. This sense of ethos, like many aspects of visual design, works on a subtle, often invisible level.
For example, the design of Android interface animations tend to involve significant bouncing and explicit movement. This animation is often read as more friendly and informal than the slow fade animations commonly found in Apple user interfaces.
To be clear, these readings of ethos in animation are not universal across audiences or even across platforms. Indeed, some users might interpret any animations as flashy nonsense.
In this frame I can show several different kinds of animation "personality"
ANIMATION AND Abstraction
Animation can illustrate concepts that would be difficult to display in live-action video.
For example, a talking-heads video about the economics of the Afordable Care Act involves abstract relationships between government institutions, medical providers, insurers patients, and non-patients. The transactions between these institutions may be better represented with animated graphics than with a live-action video, because it can literally visualize these abstract relationships.
For more information on the relationship between photographic and iconographic evidence, see McCloud 1993, or, more recently, Johnson 2015.
In this frame I can show a diagram of some kind.
Animation and
Attention
One of the most important lessons factors of animation is that it is such a powerful attractor of attention. Even in a small bit of motion can completely disrupt the visual hierarchy of a text, working to distract the user more than to attract them to certain pieces of information.
At a very basic level, we can see the rhetorical value of animation in "follow the bouncing ball" tutorials, guiding the user around the screen. It also requires careful attention when working with text. Users struggle to read moving text, and it is also difficult to read when elements are moving on/off screen.
Indeed, deciding when to keep things still is just as important as deciding when to animate.
IN this I can show a bouncing ball and some text
SCAFFOLDING
Scaffolding Strategies
Analysis
before
Production
Still
before
Movement
Group Work
before
Individual Projects
before
1 Layer
before
1 Scene
Full Video
*But always (ALWAYS) audience awareness and delivery.
Example Projects
Click DOTS for more examples
Example Projects
Click DOTS for more examples
Example Projects
Click DOTS for more examples
Example Projects
Click DOTS for more examples
Example Projects
Click DOTS for more examples
TAKEAWAYS
Animation explicitly leads students to consider timing, pacing, and the audience's thought process more than document design or video production alone.
Though there is value-added, it does not necessitate working in After Effects for an entire semester.
Students honed a rhetorical vocabulary for assessing media by focusing on process in written documents.
The focus on animation obscured relationships to live-action film production. I wonder if there is enough time for both in one semester.
Learning curve less extreme than typically discussed.
Animation is still incredibly tedious. Students can easily become distracted by complex effects and forget about text, timing, etc.
ReADINGS AND Resources
ReADINGS ON AnIMATION
After Effects Resources
Head, Val. Designing Interface Animation: Meaningful Motion for User Experience. Rosenfeld, 2015.
Höffler, Tim N., and Detlev Leutner. "Instructional Animation Versus Static Pictures: A Meta-Analysis." Learning and Instruction 17.6 (2007): 722-738.
Lengler, Ralph, and Andrew Vande Moere. "Guiding the Viewer's Imagination: How Visual Rhetorical Figures Create Meaning in Animated Infographics." Information Visualisation, 2009 13th International Conference. IEEE, 2009.
Skjulstad, Synne, and Andrew Morrison. "Movement in the Interface." Computers and Composition 22.4 (2005): 413-433.
Skjulstad, Synne. "Communication Design and Motion Graphics on the Web." Journal of Media Practice 8.3 (2007): 359-378.
Sorapure, Madeleine. "Text, image, code, comment: Writing in Flash." Computers and Composition 23.4 (2006): 412-429.
Lev Manovich. "The Velvet Revolution Part I" and "The Velvet Revolution Part II"
Tversky, Barbara, Julie Bauer Morrison, and Mireille Betrancourt. "Animation: Can it Facilitate?" International Journal of Human-Computer Studies 57.4 (2002): 247-262.
Wells, Paul. The Fundamentals of Animation. Ava Publishing, 2006.
Williams, Richard. The Animator's Survival Kit: A Manual of Methods, Principles and Formulas for Classical, Computer, Games, Stop Motion and Internet Animators. Macmillan, 2009.
YouTube Channels
Evan Abrams
Mt. Mograph
Motion Design Schools
Template Sites
(Useful for inspiration and free starting materials)
About ME
I'm a currently a doctoral candidate at Purdue University. My current research project focuses on the re-emergence of animation as a factor in interface design, data visualization, and online video. In the fall of 2017 I'll be taking a position as an Assistant Professor of English at Western Kentucky University.
Questions?
If you'd like to see the assignment sheets or the syllabus, please contact me at
dliddle@purdue.edu.
If you want to follow more of my exploits in rhetoric and animation follow me on twitter at @danielliddle.