Step 1: We begin this tutorial not in Flash, but in Photoshop! I've used a large, high resolution, wide shot of a golf course to create two 200x200px shots, one of the whole photo and one close up, they are shown in Figures 1 & 2.

Figure 1: Main Shot

Figure 2: A small, close-up crop of the hole

Step 2: Next we take each and produce two zoom-blurred versions. To do this take the shot in question, duplicate its layer and then go to 'Filter > Blur > Radial Blur' (see Figure 3). Set the Blur Method to 'Zoom' and Quality to 'Best', for the Amount first do a version with about 30 and then another version with about 90.

Figure 3: The Photoshop Radial Blur Filter

Figure 4: Zoom Blurred

Step 3: You should now have a sequence of 6 photos, 2 regular shots, 2 slightly zoomed (with the Amount set to 30) and 2 with a lot of zoom (with the Amount set to 90). We now import these into Photoshop. To do this go to File > Save For Web, then in the Save for Web dialog box set the 'Preset' to 'PNG-24'. This will produce a large file size image with no degradation in quality. When you import these images into Flash you can then use Flash to choose the quality output and get the best quality image for the size.

Once you have saved your images, create a new Flash document and set it to 200x200px and 40 frames per second. Then go to 'File > Import > Import to Library' and find your 6 PNG files. You should now have a nice library of images for us to play with (see Figure 6)

Figure 5: Set to PNG-24

Figure 6: A nice library of photos to play with

Step 4: So, now the fun part! What we need to do is create a situation where we start with photo 1, then quickly fade to photo 1 zoomed, then to photo 1 super zoomed, then to photo 2 super zoomed, then to photo 2 zoomed and finally to photo 2. So thats the overall plan.

We do this by placing photo 1 (in this case the wide shot of the golf course) on our first layer. Then create a second layer and place a keyframe at frame 30 and place the shot of photo 1 zoomed on the stage. Hit F8 to turn the photo into a movie clip, as once we've done that we can do things like fades (see Figure 7). So next create a keyframe on frame 35, then go back to frame 30 and set the image to Alpha 0 (see Figure 8). Then right click between the two keyframes and select 'Motion Tween'.

Figure 7: Create a movieclip

Figure 8: From nothing to everything.

Step 5: You now have a movieclip fading in over the top of the initial photo. We now repeat this process five times more, so that on layer 3 we have the super zoomed of photo 1 faded in from keyframes 34-40, then on layer 4 we have the super zoomed shot of photo 2 faded in on keyframes 39-45, then on layer 5 the zoomed shot of photo 2 faded in on keyframes 44-50 and finally on layer 6 we have photo 2 itself faded on. So your timeline should look approximately like Figure 9.

This will give us half our animation, as shown in Figure 10. As you can see the effect is a very quick zoom in. You can play with the amount of the blur and speed of transitions between photos to get the effect looking just the way you want it.

Figure 9: Slightly overlap the animations for a more organic effect.

Step 6: Now, to zoom back out we select all the frames by clicking on Layer 1, Frame 1 and then while holding Shift down click on the last frame of Layer 6. Then right-click and select 'Copy Frames'. (see Figure 11). Next Shift-select the the 6 Frames immediately after your animation and right click again, this time choose 'Paste Frames'. You should now have two copies of your animation.

Next Shift-select the second set of keyframes, right click and choose 'Reverse Frames'. This should flip them all around so that you have the entire animation going backwards. Now unfortunately the way that Flash reverses frames, it changes the placement of keyframes on one side. You will need to go through and move the keyframes along to the right positions. But basically you want to have a precise mirror of the first set. This will produce our final animation in Figure 12.

Figure 11: Copy your frames