Step 1.

Well Kite here's my very first attempt at some form of tutorial although this is very basic indeed but I don't really want to get too complicated here but just show you the basic idea behind a simple scroll.

first of all you need to start a new project in Imageready...
goto "file" and click on "new"...from here you can get to choose what dimensions you want.
I generally use 240x 80 pixels on either a transparent background or any colour you want really.
you can leave it white and change it later if you wish.

Step 2.

In the "Layers" box now you will see a single box with the word "Background" on it....Double-Click it and a box will appear giving it a new name "Layer 0"....just click ok at this point....this gives us access to work with the canvas.

Step 3.

Now it's time to add some text to the first frame of our project...

Click on the "Text" icon as I've highlighted in the screenshot and add text by just clicking on the canvas and typing whatever you wish.

Step 4.

You will see after adding your text that the "Layers" box displays 2 layers...the background and your text.

Step 5.

You can now see that our project with it's text has been underlined and from here you can move the text anyway you like.

beneath that you can see the "Animation" window which will display our frames as we create them.

Step 6.

As you pass your cursor over your text it will change to a black arrow...this indicates that you can move your text in any direction...if you hold down the "Shift-Key" and click the mouse button you can move the text in straight lines without any deviation.

Step 7.

ok so now do as I explained above and move your text to a point that you want it to start....you can even move it off the canvas if you wish.

Step 8.

when you've positioned the text to where you want it we then need to duplicate our current frame and to do this we need to click on the icon I've highlighted in the screenshot....this gives us our next "frame" in the animation....you can see that there is no text in either frame...that's because I chose to move my text in frame one to the extreme right of my canvas.

Step 9.

Now in "Frame 2" we need to put our text where we want it to finish the animation....in this case I'm choosing to now move it to the extreme left of the canvas so once again it won't be visible....I've only partially moved the text in the screenshot but it should be moved to the extreme left if your wishing to scroll the text from right to left of the canvas.

Step 10.

The next step is to add the additional frames for the animation to run smoothly....In this case we use the "TWEEN" option.

The "tween" puts the extra frames Be-"Tween" our frames 1 and 2 thus saving us much more time and the need to create every frame manually.

Step 11.

Once you've clicked on the "tween" icon a box will appear asking you how many frames to add to the animation....the more frames you add the smoother and slower the animation but also the file size generally becomes greater....play around with this option to get the result you want.

Step 12.

I decided to choose the 20 frames for this exercise and you can see in the screenshot how the "tween" option created our additional frames for us....you can test the animation by clicking on the "PLAY" button as highlighted in the screenshot also.

Step 13.

Once you're happy with your animation you can then save it using the "save Optimized as" option.

Step 14.

After clicking on the save option you will be given an option ....make sure you choose the "Images Only"....we only need this when we are using our gif's in the forum.....no additional Html code is needed.

Once you've saved your project you will need to first upload it to either the webspace your ISP may provide for you or an additional webpage you may have....then you need to update your signature settings in the forum. I've taken the liberty of showing you how the finished result should work.....if you have any problems then don't hesitate to PM me in the forum and I will hopefully be able to help you.

Ok I decided to take this tutorial to the next step so that you end up with a similar gif to the one at the top of the page.

so now instead of moving your text off the page in Step 9 just position it in the centre of your canvas....see screenshot.

Continue with Steps 10,11,& 12 and you should now be at the stage where your project has its completed frames...in this case I used 20 frames to keep a smooth animation which should now give you a total of 22 frames....now we need to copy the frames to reverse the effect so we need to click on frame number 2 and then hold down the "shift key" and then click on frame 21....frames 1 and 22 should remain untouched.
Next we need to Copy & Paste the highlighted frames after Frame 22 and to do this we click on the small black arrow as indicated in the screenshot

When you've clicked on the arrow you will see this menu...(screenshot)...click on copy frames. and then re-click on the small black arrow as described in the screen above.

you will then see the next menu and here we choose "Paste Frames"...see screenshot 2.

before clicking on "Paste Frames" make sure you click on "Frame 22"

 
Screenshot 2.

After you click on "Paste Frames" you will be given this menu....(screenshot).

select "Paste after selection" and the frames will be added to the animation giving you a total of 42 Frames I think...lol.

 

Re-click on the small black arrow again and we will then see this menu....(Screenshot).

from here we select "Reverse Frames"...this will reverse the frames you just pasted into the sequence and thus give the effect of your animation in reverse.

You can if you want, add a time delay to any frame...I chose frame 22 as this is where the text is in it's central position. if you click on the arrow as seen in the screenshot it will give you some options to set the delay for that particular frame.
When you're done return to Steps 13 & 14 to save your work and test it thorougly.

Again if you have any problems or find this tutorial to difficult to follow then I apologise as this is my first attempt at tutorial writing....I'm sure you will let me know if my attempt sucks or not...lol

Mike.

Email