Create Photo Gallery using Motion Presets - Exercise

Contact Us or call 1-877-932-8228
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

  1. Open the file AdvancedAnimation/exercises/PhotoGallery.fla
  2. Import several images to the Library from AdvancedAnimation/exerices/galleryphotos.
  3. Create a new layer and name it Photo1.
  4. Drag an instance of one of the images to the new layer just off the stage to the left.
  5. If desired, use the Transform Panel to set the height and width.
  6. Convert the image into a symbol.
  7. 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
  8. With the first photo positioned off the screen in the starting position, Single-click on the photo. Open the Motion Presets Panel.
  9. Find fly-in-left and click Apply. It will add about 24 frames.
  10. 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).
  11. 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
  12. Add another keyframe in Frame 50.
  13. Using another motion preset, add a motion tween to slide the photo out. This should run from frames 50 to 75.
  14. Position the photo off the screen in the ending position.
  15. Test your movie!Add Additional Photos
  16. To add several additional photos, you may repeat the above steps. Or, follow this shortcut:
  17. Add an additional layer. Remove any frames in the new layer.
  18. Click on the name of the "Photo1" layer. Choose Edit > Timeline > Copy Frames to copy all the frames of this layer.
  19. Click on the first frame of the new layer and paste the frames (Edit > Timeline > Paste Frames)
  20. Single click on a photo to select it. In the Properties Panel, click on the Swap... Button.
  21. Select the next photo. Finishing the animation
  22. So far, our photos will all slide in simultaneously. Probably not what we want!
  23. To fix this drag each of the animations farther down the timeline so that they play one at a time.
  24. Test your movie!

If you are done early...

  • Add additional photos to the gallery.
  • Use other motion presets to change some animations