Create Photo Gallery using Motion Presets - Exercise
Create Photo Gallery using Motion Presets
Duration: 20 to 30 minutes.
In this exercise you will build a photo gallery that automatically slides photos in and out. They will also fade in as they enter, and fade out as they leave.
Import and Prepare Images
- Open the file AdvancedAnimation/exercises/PhotoGallery.fla
- Import several images to the Library from AdvancedAnimation/exerices/galleryphotos.
- Create a new layer and name it Photo1.
Drag an instance of one of the images to the new layer just off the stage to the left.
- If desired, use the Transform Panel to set the height and width.
- Convert the image into a symbol.
- Drag each of the photos out to the stage make any size adjustments. Convert them each into symbols named photo2, photo3, photo4, etc.Use a Motion Preset to Slide in Pictures
- With the first photo positioned off the screen in the starting position, Single-click on the photo. Open the Motion Presets Panel.
- Find fly-in-left and click Apply. It will add about 24 frames.
- We want this photo to remain visible for about 1 full second, and then fly out to the right. To do this, add a Blank Keyframe in the very next frame (frame 25).
- Copy the photo from frame 24 and paste it in place (Control+Shift+V) on frame 25. The photo will stay in this location until the next keyframe.Photo Slide-out
Add another keyframe in Frame 50.
- Using another motion preset, add a motion tween to slide the photo out. This should run from frames 50 to 75.
- Position the photo off the screen in the ending position.
Test your movie!Add Additional Photos
- To add several additional photos, you may repeat the above steps. Or, follow this shortcut:
- Add an additional layer. Remove any frames in the new layer.
- Click on the name of the "Photo1" layer. Choose Edit > Timeline > Copy Frames to copy all the frames of this layer.
- Click on the first frame of the new layer and paste the frames (Edit > Timeline > Paste Frames)
- Single click on a photo to select it. In the Properties Panel, click on the Swap... Button.
- Select the next photo. Finishing the animation
- So far, our photos will all slide in simultaneously. Probably not what we want!
- To fix this drag each of the animations farther down the timeline so that they play one at a time.
Test your movie!
If you are done early...
- Add additional photos to the gallery.
- Use other motion presets to change some animations