Anyone seen the Lord of the Rings cartoon? It wasn't
very good, but the animation was realistic because
of a technique called ‘Rotoscoping’, filming
live actors an animated over the top of them. It’s
a bit frowned upon by the animation community, but
don't worry about them, we’re web people. Flash
MX lets you embed video into your movies, so lets
have a go eh?
1. Open up a new movie, and go to file > import.
Pick a movie from your selection, and embed it. Leave
most of the settings as they are, (you can increase
quality if you want to help drawing, but big files
take a long time to open,) and click open. Don’t
worry about the size, we’ll be throwing away
all the video at the end. Once it’s finished
importing, (make a coffee if its over 40Mb,) lock
the layer the movie’s in.
2. Pick the section of movie you want to animate.
This is clearly up to your discretion, but don’t
be too ambitious the first time. Pick a small section,
with not too much detail for now, and make it better
another time. I used a section from the Glassjaw video
for ‘Cosmopolitan Bloodloss’, but I nearly
chose the video of the monkey doing kung-fu that’s
going round the net. Daryl has his face away from
the camera, which is good because I suck at drawing.
3. Make a new layer by clicking the ‘New Layer’
button in the bottom left of the timeline area. (See
diagram.)
4. Now you can draw on the second layer with the
tools over the top of the area you want to animate.
Insert a keyframe (hit F6) on layer 2, (called ‘rotoscoper’
in the diagram,) on the corresponding frame, and doodle
away. I used the pencil tool, and changed it to ‘smooth’
by selecting smooth from the drop-down menu in the
‘options’ box in the toolbar. Use small
strokes for the smaller areas where you need more
detail. Notice I used a new keyframe for each relative
frame of the movie. It might be a good idea to add
all these in now, as you can see how far you’ve
got to go.
5. I know I can’t draw, but if you can, you’ll
get better results than me J. In my defense, you can
see the movie was small, and not especially detailed.
I nearly gave up at this point because it looked so
sucky, but I’m glad I stuck with it. This was
nearly a tutorial on buttons :-).
Notice you have to draw every frame individually,
and there’s no short cut. I drew 13 frames in
the end, and it took me ages. I’m sure it’s
easier with a graphics tablet. I’ll submit another
one after Christmas.
6. At this point I realized I’d drawn in white,
and the movie background was white. Not a hard problem
to fix, but hey, we all make mistakes. It wasn’t
hard to change it.
Now for the moment of truth. All frames drawn, (SAVE
IT FIRST, don’t lose all your work,) unlock and
delete the original movie layer, and remove all the
frames you don’t want on layer 2 by highlighting
them, right-clicking and selecting ‘delete frames’.
Zoom back out to the original size.
Hit alt+enter and the movie will play as a test,
defaulting to loop. Sit back and I hope that you’re
as blown away as I was with my creation. This is my
first proper experience with rotoscoping and took
me 40 mins or so, but I was writing the article as
I went.
Publish and post the finished movie, and check out
peoples reactions. Experiment if you want by doing
the above as a movie clip instead. Play around, and
let people know if you learn any cool tricks.
Whew, that was fun. Next time, we’ll be making
some buttons to control your Flash movies. Here is
a look at the animation in its final form.
Spoono
