Follow the previous steps to create the initial transition.  Once you have that, this part is fairly simple.  Here's the sequence of what we want to happen:

Initial Image is fully Visible >> Transition  >> Ending Image is fully Visible
During the Transition, InitialImage and Ending Image will be partially visible.  (Ie: Ending Image will show up gradually, and Initial Image will disappear gradually.)

To reproduce this sequence in the Flash movie, let's use the movie we crated previously.  I added another layer here to place the InitialImage and also added a layer to put some labels.  I decided that the Initial Image should stay untouched on the screen for 19 frames before the Transition, so I inserted 19 frames before the Transition.  

Now insert the image that you'd like to use into the first frame of the InitialImage layer.  

Notice that I put labels to indicate when the Transition starts (Transition) and ends (Transition Finished).  From the time the Transition starts until the frame labelled FullCircle, both the Initial Image and the Ending Image must be visible, because they will be overlapping like below:

After the FullCircle frame, you can (should) remove the InitialImage because it would have been completely replaced by the EndingImage.  

Here's a sample FLA file.

If you wish to show another image after the FullCircle frame instead of showing a blank like the example below, you can add another image after the frame labbeled Full Circle.


(C) F. Permadi