PDA

View Full Version : Animating Fade


DarK_AssassiN
09-01-2005, 05:37 PM
I want to have an image fade into another image but I dont want to do it little by little (saving JPGs every 10 seconds switching the opacity). Could anyone help me?

Euroscale
09-02-2005, 10:47 AM
Which programs do you have? Only Image Ready? I´m afraid that won´t work. What´s the purpose of the animation at the end? Internet, DVD, screensaver...

Chonny99
09-03-2005, 12:02 AM
Here is how to get the fade

Open both images

The image you want to see first before the Fade that will be your base image.

Select the image you want to use as the image you see after the Fade is done

Click on Select>All Then click on Edit Copy

Now select the Base image and click on Select>All, Click on Edit>Paste

Now you will have two layers in the image, the Base image which is the Background layer and the image you want to see after the Fade is done which is on Layer 1

*** Important***
Click on the visibility icon (Eyeball in front ) of Layer 1 this turns off the layer so you see the Background Layer instead of Layer 1

Click on the Jump to ImageReady Icon at the bottom of the Photoshop tools palette.

ImageReady will now open up the image, there will be a number of Tabs at the top Original, Optimized etc. these will tell you are in ImageReady.

Click on Window>Animation this opens the Animation palette and it has the first frame already in it, which happens to match the condition you set in Photoshop Layer 1 is hidden.

In the Animation Palette you will see an icon that looks like a square with its corner bent up, this is the Duplicate Current Frame right next to the Trashcan at the bottom of the palette.

If it isn’t already open make sure you can see the Layers palette by selecting
Window>Layers.

Click the Duplicate Current Frame icon and you have two frames that are exactly the same at this time, click and turn on the visibility icon on Layer 1

Now you have the first frame with your base image, and the second frame has the image you want to see after the fade is done.

Leave the time in the frames set to 0 secs.

Click on the first frame so it is highlighted, then click on the small arrow at the top right of the Animation palette, a popup menu will open scroll down to Tween and select it.


When the Tween panel pops open there are a number of conditions you can set Tween With [Next Frame]
Set this to Next Frame if you need to change it.

Frames to Add: I usually add about 15—25 frames as that seems to give a gradual fade

Layers
Click and Select All Layers

Parameters
Select Position, Opacity, Effects these all should be checked

Click OK

The Animation palette now has the first frame, a 15 -25 frame fade and the last frame

Click on the Play button in the Animation palette it looks like a small triangle on its side

You should see the image start out with the base image and slowly fade into the final image.

You can also adjust the times on the frames by clicking on the small arrow next where it says 0 secs. You could set the time so that the first image displays for 2 seconds and then fades into the second image.

**** Important ****
If you don’t want it to loop forever click on Forever at the bottom of the Animation palette and change that to Once

Click on the Stop button in the Animation palette to stop it from playing the Animation

Click on the small arrow at the top right of the Animation palette, a popup menu will open scroll down to Optimize Animation

Select Optimize
Bounding Box
Redundant Pixel Removal
Both of these should be checked
Click OK

On the Top Banner bar Select File>Save Optimized As

The Save As dialog opens asking you where you want to save the file
The file will also be a .gif as this is now an animation file.


Once you get it saved as a gif, go to your browser Select Open File in your browser and point it to your saved gif you should see the animation play in the browser window.

Now just add, place or copy the gif to where you want it.
I hope this helps :-) John