Fade in and fade out your banner with ImageReady

Leggi questo tutorial in lingua Italiana

ImageReady is Photoshop’s brother. This is a simple tutorial to introduce it. We are going to create an animated dissolving text banner. The effect will be smooth and the text will fade in and fade out. First of all we use Photoshop to set the canvas and create the text, then we will go to ImageReady clicking the button at the bottom of the tools palette.

Here we have the text:

See below the ImageReady button:

Once the program is running be sure to see the Animation window. Alternatively, you can visualize it by clicking Animation from the menu Window.

As soon as you open the window, you will see your first frame:

The red arrow shows frame number one. The effect we want to obtain is simple, but we have to work in a certain order. Click the right button of the mouse and select Duplicate current frame.

As soon as you click, a new frame (#2) will be added to your animation time line. The second frame will be the same as the first. Click on it and decrease the master opacity to 80% as shown in the picture.

Now repeat this by duplicating the frame and decreasing master opacity by 20% each time. My suggestion is to set 100%, 80%, 60%, 40%, 20% and 10% at the end in order to ease the last frame better.

Now repeat all duplicating the frames going up with master opacity. So 20% again, 40%, 60%, 80% and stop, as you already have a 100% frame.

See below if you are applying same values:

Frame#: 1 —> 100%, 2 —> 80%, 3 —> 60%, 4 —> 40%, 5 —> 20%, 6 —> 10%, 7 —> 20%, 8 —> 40%, 9 —> 60%, 10 —> 80%.

The red arrow shows how to scroll frame by frame and how to set a delay for frames. Following, you will see the effect for a 0-second delay, and 0.2-seconds delay.