ImageReady Tutorial

Thread Tools
 
Search this Thread
 
Old 07-17-2007, 10:52 PM
  #1  
alexr
★★★★★
Thread Starter
 
alexr's Avatar
 
Join Date: May 2005
Location: Banned Camp (Counselor)
Posts: 10,200
Default ImageReady Tutorial

Ok, so now that you have ImageReady open and you want to make images fade back and forth, this is how you do so. i had to use the sample pictures because when i started doing this i didnt have my hard drive with all my signatures and stuff.

anyway here goes:

ImageReady uses slides to create moving pictures/animated GIF's, much like how a flip book works. so using that basic principle, we will create an image that changes between two pictures.



First make sure you have atleast 2 different layers of images you want to fade. Start out by making one of them on, and all the rest off, by using the eyeball icon in the layers window for all the different layers.



Next, take your first picture, and duplicate that first slide using the button pointed to in the image above.



Next, we want to switch the image to the next stage (in this example, it is the second picture -- in other cases, it may be a different car angle, or a different background image). This can be done with multiple layers, you can switch backgrounds and objects at the same time, but to keep things simple, we'll just start with one thing.

To do this, all you do is turn on the layer that we want to blend in, and turn off the layer we want to fade out.



So far, all we have is 2 static images, in two different frames. If they were to be played back to us, they would just flip flop between the two, so we need to add a smooth transition so they fade.

First we want to click the Tween button, which is right next to the Duplicate Frame button. this will bring up a menu where we will choose our settings.

For our purposes, we want all the boxes checked at the bottom of this menu (position, opacity,effects). You can mess around with these as you please, but for now lets check them all.

Next choose All Layers, because the layers we want to Tween are already visible, and we dont need to tween anything else.

Now choose how many frames you would like to add. the more frames you add the longer it will take to transition, but remember that, the more frames you add, the larger the file size will be. You want to keep the file size relatively low, because these files are big to begin with, and when posted on websites, they will take longer to load.

I usually would like to keep them under 750k (but we'll get into that later)*

A good number of slides to choose from, i would suggest is either 5 or 10, nice round numbers.

Lets go with 5 for now. so select 5 frames and click OK.

Now that you have one transition. you are technically done with the slides. but rather than have it just change once, lets make it a loop, so it goes back and forth smoothly.

Up through image 7 of this tutorial (im talking about the images i have in this thread, not the slides) everything is just a repetition of what we have already done, except we are doing this with the second image, rather than the first.



Make sure you have the last slide selected, and lets duplicate that.



And now lets switch the layer view back to the original image using the eyeball icons in the layers window



Once again were gonna Tween the image to the previous frame, using the same settings as before



Now we have a nice transitioning image that goes from its original image, to a secondary image, and back.

But now we want the image to stay in one state for a few seconds, so we can look at each image before it disappears.

Lets freeze frame the first image at the end of the sequence.

So were gonna click on the "0 sec." Under the frame we want to freeze, and select a time. I selected 2 seconds, but you can choose whatever you would like.



Now we have to do the same thing for the second image.

There is a little math involved here. First go the very first frame. And go over 1 frame to count for the original frame. Then count over 5 frames for the 5 we added, and you should end up at the second picture with no fading in it (this should be frame 7).

Now you are done. You have successfully created 1 image that fades in and out between two different images, and pauses to view each image in the sequence.



This step is optional. the image should already be set to repeat forever, but if you would like it to just play once, or a set amount of times, you can go ahead and click in the bottom left corner of the frame window and bring up the repeat menu, and choose what you desire.



Now lets bring it to life. Click the internet explorer icon (or firefox if its preset to firefox), and the image that you created will load in a window in your internet browser.



Now all we have left to do is Right-Click and save the image. These images are considered GIF files, so we will save it in the GIF file format.

Wahlah.

*I mentioned earlier about file sizes. Once you have uploaded the image into the browser by clicking the IE button in ImageReady, the image will appear in the browser. To view the file size, it should already be labeled below the image, but if not, you can go and right click the image, and go to Properties to view the file size.

I have found that a file size larger than around 750k takes a long time to load, and tends to lag between frames, rather than transitioning smoothly.

You can cut down the size of the file, by making the whole image smaller in size by going to Image > Image Size and choosing a smaller image parameter.

OR

You can start from the beginning of this tutorial and choose a lower number of frames when you are in the Tween menu. refer back to the 4th image in this tutorial if you need to reference the Tween menu.

alexr is offline  
Related Topics
Thread
Thread Starter
Forum
Replies
Last Post
kdryan
2005-2014 Mustangs
2
08-29-2015 09:57 PM
bond007
V6 (1994-2004) Mustangs
2
08-26-2015 11:36 PM
DuFFMaNN
Chop Shop
6
11-27-2006 04:09 AM
JonBeast
Chop Shop
0
01-17-2006 06:59 PM



Quick Reply: ImageReady Tutorial



All times are GMT -5. The time now is 03:22 PM.