Print E-mail
Digg!

Del.icio.us!

Newsvine!

Frame by Frame

Show your students how to create animated drawings using Flash.

Kevin Driscoll

Animation is an excellent extension to an investigation of digital-image editing. This introductory lesson demonstrates the origins of animation in a pre-digital era and carries these core principles to the personal computer. Students will also be able to integrate this work into ongoing, Web-based projects as animated GIFs and Flash movies.

Lesson Description: Class begins with a simple prompt: “Use the brush tool to draw a face.” The teacher will circulate to assist with any technical issues. The teacher describes frame-by-frame animation while a video of Glen Keane, the lead character animator at Walt Disney Studios, plays silently. The class considers the tracing paper and charcoal pencil. How do they compare with other drawing tools?

The teacher next demonstrates the same frame-by-frame technique using “onion-skinning,” or semi-transparent layering, in animation software. Students are then prompted to think about the opposite expression to the one their face is currently making (for example, bored/excited), and they begin to draw more frames. Students experiment with cut, copy and paste as well as simply drawing.

While students are working, the teacher passes out printed flip books. What happens if the reader flips faster or slower? How many pages does it take to produce believable motion? The teacher should demonstrate how to change the animation’s frame rate.

Subject Area: This lesson can be adapted to art, media and computer applications courses for middle school and high school students. An ideal setting is a computer lab in which each student has her own computer and can see the teacher’s desktop on a projector. The examples in this lesson use a Flash platform for creating animations, but the work can be adapted to any multilayered, digital-image editing software.

Curriculum Standards: This lesson addresses the following areas of the National Educational Technology Standards for Students: Creativity and Innovation

  • Students apply existing knowledge to generate new ideas, products or processes
  • Students create original works as a means of personal or group expression Technology Operations and Concepts
  • Students select and use applications effectively and productively
  • Students transfer current knowledge to learning of new technologies

Resources:

  • Over-the-shoulder view of Glen Keane sketching frame-by-frame: youtube.com/watch?v=JA7Naf0RF4M
  • Free image-editing software: gimp.org
  • Detailed instructions and sample Flash projects for use with this lesson: www.curriki.org

Grading Rubric: This is a project to introduce a unit and should be counted among a larger portfolio of work. Students should be required to exhibit a selection of their work publicly.

Teaching Tips

  • It is helpful to start up the software in advance of class, with a new empty project opened and the desired drawing tool selected.
  • Keep a simple text editor (such as Notepad) open on the teacher’s desktop. Use it to display instructions and record interesting student comments or questions. This can be an invaluable log of the day’s work.
  • Play the Keane video without sound and narrate it live for the needs of the particular class. Art students will need different direction than computer-science students.
  • Pair students or provide mirrors so they can observe the changes that faces make between expressions.
  • Limit students to using one drawing tool, one foreground and one background color to help focus everyone on creating high-quality animation.

Kevin Driscoll is co-founder of Developing Curriculum, a nonprofit dedicated to developing high-quality free/open learning materials. He is currently a graduate student in Comparative Media Studies at MIT and a former computer science and mathematics teacher at Prospect Hill Academy Charter School in Cambridge, Mass