Today we are going to create a cool looking image transition with Adobe Photoshop and ImageReady. The transition is pretty seamless and is really nice for slide shows. You should have it ready in no time, and have an end result like this:
1. Firstly load up the two (or more) images you wish to use for this affect in Photoshop. When opening the files, hold down shift to select more than one at a time.
2. In Photoshop click on the image you wish to come first and convert the background to a layer. In the layers palette right hand click the background layer and click ‘Layer from background…’.
3. Now go to the image you wish to come second and, making sure it’s window is active, select it using ‘CTRL+A’ on your keyboard. Now copy it to the clipboard by pressing ‘CTRL+C’.
4. Go back to your original image and paste the image you just copied onto a new layer using the keyboard shortcut ‘CTRL+V’. Close the image you just pasted, you won’t need it anymore.
5. Duplicate each layer by right clicking them and selecting ‘Duplicate layer…’
6. We are now going to manipulate the second to top layer, so you can see it, make the top layer invisible; click the little eye next to it in the layers palette so that it disappears from the image (temporarily).
7. Now, making sure the second to top layer is active, lower it’s opacity to about 50% in the layers palette.
8. Hold shift and click the layer below the one you just changed the opacity of to select them both.
9. Press ‘CTRL+E’ on your keyboard to merge the two layers into one.
10. Now to add our zoom; keeping the merged layer active, go to ‘Filter > Blur > Radial Blur’. Set the ‘Blur Method’ to zoom and the ‘Quality’ to best; trial and error with the ‘Amount’ until you find a setting which you think is suitably cool for your image. You will need to click ‘OK’ to see it in action, but if it isn’t what you want just undo and do it again.
11. Repeat this method for each image you want in the affect.
12. Make the top layer visible again by clicking the eye icon.
13. Open the image in ImageReady by clicking the open in ImageReady button.
14. In ImageReady, make sure the animation palette is open by going to ‘Window > Animation’ and making sure it is checked.
15. We are now going to turn our layers into frames. Click the small arrow underneath the ‘x’ which closes the animation palette. A menu will drop down; go to ‘Make Frames From Layers'
16. Now all of your layers will be presented as frames in the timeline, but before you hit the play button make sure that the drop down list in the bottom left of the palette is set to ‘Once’. Now you can press play…
17. And that’s it! Save your image as an animated gif by going to ‘File > Save Optimized As’ and selecting a .gif file extension.
I got my example with a bit of fiddling around. My animation is set to loop forever, and each image slide (not the transition ones) is set to a one second delay. Remember, if you are going to loop your animation forever then you must put a transition frame either at the very beginning or end of your timeline so it flows.
More Tutorials: 
