View Full Version : Basic Guide to Animating Your Pictures


ahadinosaur
12-24-2005, 05:01 PM
A Basic Guide to Animating Your Pictures
by:ahadinosaur

Hello everyone! This is a short tutorial on how to animate your pictures, using a simple program called Microsoft GIF Animator. This is only for people who have Microsoft Windows, as it only runs on a Microsoft Windows Operating System . Microsoft GIF Animator can be downloaded online, and it is FREE Software. (List is provided at the bottom of this post as safe download sites)

This tutorial will teach you how to go from flat unanimated pictures, to flashy and fun animations like this one:

http://i34.****************/albums/d120/VMKgraphics/ForumAnimation.gif

For the purposes of this tutorial, I'm going to use the avatar above as an example. If you have read this tutorial before, You can skip to all the basic Important info, which is in green text.

On a beginning note, create your frames with some kind of drawing program, such as Paint or Photoshop. For every change you want in the animation, whether it be change in color/text/or whatever, you MUST make a new frame.
With the avatar above, I had to make SEVEN different frames for each different color I wanted it to change.

http://i34.****************/albums/d120/VMKgraphics/tutorial1.gif

Make sure you save all of your pictures as .GIF's or Compuserve .GIF's. They WILL NOT WORK in the animator if they are saved as anything otherwise. If you are looking to make an avatar, also make sure that your avatar does not exceed 100x100 pixels, as this is the forum limit.

http://i34.****************/albums/d120/VMKgraphics/tutorial2.gif

After you have all your frames made and save, open up the program Microsoft GIF Animator.

http://i34.****************/albums/d120/VMKgraphics/tutorial3.gif

Once the animator is open, click on the yellow folder button next to the white Paper button. This is your OPEN button.

http://i34.****************/albums/d120/VMKgraphics/tutorial4.gif

Open the LAST frame of your avatar
****IMPORTANT NOTE: YOU MUST OPEN THE LAST FRAME FIRST! IF YOU DON'T, YOUR ANIMATION WILL GO BACKWARDS!
http://i34.****************/albums/d120/VMKgraphics/tutorial5.gif

After your first frame is opened, click on the white folder with the plus sign on it. This is your INSERT button. For the rest of the animation, you will be using this button.

http://i34.****************/albums/d120/VMKgraphics/tutorial6.gif

Insert all the rest of your frames, BACKWARDS!!!
Since I want my animation to be like a rainbow, I opened the pink first and inserted Purple-Blue-Green-Yellow-Orange- and then Red. REMEMBER YOU MUST DO IT BACKWARDS!

http://i34.****************/albums/d120/VMKgraphics/tutorial7.gif

After all of your frames have been inserted, it should look something like this:
(Red at the top, because it is first, but red was inserted last. Pink at the bottom, because it is last, but Pink was opened first)

http://i34.****************/albums/d120/VMKgraphics/tutorial8.gif

Now it's time to modify things. First, go to ANIMATION-LOOPING-REPEAT FOREVER. This is what keeps your animation constantly moving. You must check the Looping and Repeat Forever buttons if you want you animation to move continuously.

http://i34.****************/albums/d120/VMKgraphics/tutorial9.gif

After that, it's time to set the speed of the animation.
Click the Image Tab. See where it says duration? That is where we determine the speed of the animation, how fast it goes frame by frame. Speed is determined by 100's of a second. For instance, if you filled out 25/100, That would be ONE QUARTER of a second. THE SMALLER THE NUMBER IS, THE FASTER IT GOES. THE LARGER THE NUMBER IS, THE SLOWER IT GOES. So an animation set to a speed of 25/100 moves frames faster than an animation with a speed set to 75/100. I usually start around 25/100, and work my way around that. You can set the duration to whatever you want, BUT YOU MUST SET DURATION FOR EVERY FRAME! You cannot do duration for just one frame and expect it to work. It has to be set for every frame!

http://i34.****************/albums/d120/VMKgraphics/tutorial10.gif

After all that, if you want you can preview your animation. Go to the dark blue pointey arrow button, and click it.

http://i34.****************/albums/d120/VMKgraphics/tutorial11.gif

If you are staisfied with your work, you can now go and save it. Click the 3 floppy disk button, and save it as whatever you want.

http://i34.****************/albums/d120/VMKgraphics/tutorial12.gif

And, VIOLA! Now you have your animation.
http://i34.****************/albums/d120/VMKgraphics/ForumAnimation.gif

Feedback on this thread is appreciated,
Happy Animating,
Best of Luck!
-ahadinosaur
(If you have questions, feel free to PM me)

Safe Microsoft GIF Animator Download Sites:
http://www.purpletoad.net/glitter-tutorial2.html- Click on the file that is Microsoft GIF Animator and download it. It is a zipped file. (Link provided by LadyMaria)

**If you have any SAFE place that you have downloaded the animator from and would like it listed here, please post or PM me.

Don't forget, always SURF SAFE, and ask your parents before you download anything.

Cookielover
12-25-2005, 01:57 AM
good thing i have windows!! i am so excited

gotsrvd
12-25-2005, 02:11 AM
thank you so much. it must've had taken a long time to paste all those steps on this post?

ElementSun
12-25-2005, 02:15 AM
nice this really helps no more free trails for me!

Misskayla
12-25-2005, 02:34 AM
@_@ thx..Wow thats a alot

Cookielover
12-25-2005, 04:01 AM
what did i do wrong?? it says it is to big

cutestuff
12-25-2005, 04:07 AM
Wow that's great i cant wait to make a new avi.

ahadinosaur
12-25-2005, 02:59 PM
Well I'm glad you all like it!
Yes, I did spend quite a lot of time typing it up and making screenshots and stuff, but it's for the enjoyment and learning process of everyone, so no problem! Remember, if you need any help Post or PM and I'll get back to you about it =)

what did i do wrong?? it says it is to big
Vmkrocker, what is it telling you is too big?

coolbabygrl
12-25-2005, 03:29 PM
1 thing.......if u turn a .bmp into a .gif.......wont it cause color lossage?

ahadinosaur
12-25-2005, 05:58 PM
1 thing.......if u turn a .bmp into a .gif.......wont it cause color lossage?

if you have photoshop it won't, but I believe if you do it in Paint it will, and it will also get all speckley.

dudedanrocks
12-25-2005, 06:07 PM
is the animator in Windows XP home eddition?

ahadinosaur
01-07-2006, 02:14 PM
is the animator in Windows XP home eddition?

It doesn't come with Windows XP, youll have to download it from somewhere. But its free =)

LadyMaria
01-07-2006, 02:23 PM
This is where I downloaded it... Before This thread was up :)

http://www.purpletoad.net/glitter-tutorial2.html

Its at the top of the page.. It says "Download MS GIF Animator *zipped file*"

ahadinosaur
01-07-2006, 02:44 PM
This is where I downloaded it... Before This thread was up :)

http://www.purpletoad.net/glitter-tutorial2.html

Its at the top of the page.. It says "Download MS GIF Animator *zipped file*"

Is it okay with you if I make this a link on the guide?

VmkLuva
01-07-2006, 02:45 PM
This should be stickied

LadyMaria
01-07-2006, 02:55 PM
Is it okay with you if I make this a link on the guide?

Oh yes! I posted it to help ppl!

Maroonishroses
01-07-2006, 02:58 PM
we don't all have that program!!!!!!!

ahadinosaur
01-07-2006, 02:59 PM
This should be stickied
The Mod I talked to said we'd have to wait awhile and see if enough people viewed it/got help with it. But I do hope it will be eligible as a sticky, it's pretty helpful(I think..LOL)

Oh yes! I posted it to help ppl!
Thanks! I'll put credits to you as well.

LittleBubbles
03-30-2006, 12:46 AM
Nice guide ^^

I used to use Microsoft GIF animator all the time but I use Jasc Animating Shop ;D

...I thought I was the only one who knew about Purpletoad.net =p I guess not XD

ahadinosaur
03-31-2006, 01:38 AM
Thanks Bubbles!
I do use a more advanced animator as well, but GIF animator is what really got my started, I think its great for beginners! :)

manunderwater
03-31-2006, 01:43 AM
I wish you had it for Macintosh..

ahadinosaur
04-11-2006, 02:17 PM
I wish you had it for Macintosh..
I just did a google on it, so for anyone who has a MAC:
if you'd like to give animating on a Mac a try, there is a demo version of PhotoCell, which I've heard is very good. *Note: It's only a demo version, if you'd like to buy the real thing it's $59 US dollars.
Information about that and other graphic related stuff can be found at
http://graphicssoft.about.com/od/webanimationsoftware/

That link also has other links to demo's of other animation programs, unfortunately I don't control these sites so if you do visit them be sure to SURF SAFE. They look safe for the most part, and remember to ALWAYS ASK YOUR PARENTS BEFORE DOWNLOADING ANYTHING.

mickeymouse2818
04-11-2006, 02:32 PM
wow this really helps alot. ive been looking for how to do this for a while now. im glad someone took the time to help others create them as well :)

ahadinosaur
04-11-2006, 04:44 PM
wow this really helps alot. ive been looking for how to do this for a while now. im glad someone took the time to help others create them as well :)

Aww, thank you very much for your kind words. I'm glad you appreciate it, and I hope it can be of lots of help for your future animating adventures ;)
If there's something not covered in the guide that you need help with, feel free to ask and I'll try to answer. Thanks again :)

Chaelle
04-11-2006, 07:41 PM
I'm having a problem, I can't save it in GIF because I can't find it. I'm trying to save it in My Pictures but all it says is, jepg btmp etc...
~Chaelle
Oh never mind, I got it now. :D
PPS. How do I go onto frame #2? lol.

ahadinosaur
04-11-2006, 11:40 PM
I'm having a problem, I can't save it in GIF because I can't find it. I'm trying to save it in My Pictures but all it says is, jepg btmp etc...
~Chaelle
Oh never mind, I got it now. :D
PPS. How do I go onto frame #2? lol.

(I hope this is the "frame 2" your talking about xD
Anyway, to add on the next frame, instead of clicking the button that is the open manila folder with a curvy arrow over it(rofl) Click the button that is the white paper with the plus sign on it (or just do CTRL+I) And remember, make your avatar backwards with the last frame first, or it will be out of order! Lol.
Hope it helps, but if I didn't answer your question I'll be glad to try and work it out again. Good luck!

ccooldudecool
04-12-2006, 02:18 AM
lol
thanks for posting this

Chaelle
04-12-2006, 02:19 AM
Ah... I get it now. Thank you so much. So how do I put a shortcut to it, because the only way I can find it is that I have to download it again. (I'm computer impaired it seems lol)
~Chaelle
PS. Don't kill me I'm bad at this LOL! I clicked looping and Repeat Forever but it is still not animated.

Pebble
04-12-2006, 03:04 AM
I downloaded this from purpletoad like a mounth ago and never figure out how to open it after I downlaoded it... LOL


Plus I would download Jasc but our family doesn't see the need to pay for it LOL!


O.O Arg... still can't open it!

ahadinosaur
04-12-2006, 02:17 PM
Ah... I get it now. Thank you so much. So how do I put a shortcut to it, because the only way I can find it is that I have to download it again. (I'm computer impaired it seems lol)
~Chaelle
PS. Don't kill me I'm bad at this LOL! I clicked looping and Repeat Forever but it is still not animated.
AHA! I know the exact reason ;) Took me awhile to catch onto this too, I thought all you had to do was that....
Alright, if you need a "visual" step, this can be viewed on the tutorial, its like the 3rd or 4th picture from the bottom. Otherwise, what you need to do is set a time for EACH frame. Select a frame, click the 'image' tab at the top near 'Options' and 'Animation', and where it says duration type in how long you want the frame to be. You MUST do this for every frame! Just keep clicking on the frame and adjusting them. the duration speed is one out of one hundreth of a second, 1 being the quickest time(you'd only see it for 1/100 of a second) and 100 being the slowest time(you'd see it for about a whole second.) You CAN go higher than 100, and I often do it if I want the frame to display longer. Remember, do this for every frame!
In short,the formula is:Image>Duration>#
Let me know if that helps, and feel free to ask more questions! (Don't worry about not picking it up so quickly, I did the same thing :pinkbun: )

For making a shortcut, right click the animator and either do 'Create Shortcut' or 'Pin to Start Menu' Pin to start menu will have it displayed right as you open the start menu, probably under your internet button or something. How it looks is shown in one of my tutorial pictures, right near Roller Coaster Tycoon xD

Otherwise, the only other problem I can think of is that when you download it, your clicking Open instead of Save, and it hasn't properly saved on your computer yet.



I downloaded this from purpletoad like a mounth ago and never figure out how to open it after I downlaoded it... LOL


Plus I would download Jasc but our family doesn't see the need to pay for it LOL!


O.O Arg... still can't open it!

Hmmmm. Well Pebble, what I can think of is that your program needs to be unzipped. If it has already been unzipped, then I don't see a problem with it. What type of computer do you have? You can try to unzip it, or just download again, unzip, and see how it works. Let me know how that goes, and if you still need more help I'll be glad to work it out, lol.

Best of luck to you both, be sure to post your creations here so we can see :)
(I'm thinking of adding a "Player Created Graphics" section to the tutorial, I'm sure they would be great adds)

Pebble
04-12-2006, 03:06 PM
Hmmmm. Well Pebble, what I can think of is that your program needs to be unzipped. If it has already been unzipped, then I don't see a problem with it. What type of computer do you have? You can try to unzip it, or just download again, unzip, and see how it works. Let me know how that goes, and if you still need more help I'll be glad to work it out, lol.

Best of luck to you both, be sure to post your creations here so we can see :)
(I'm thinking of adding a "Player Created Graphics" section to the tutorial, I'm sure they would be great adds)

It's okay I finally found it under Start. :)


And BTW Everybody: If you use paint, get an Image Converter, and save it as a BMP and convert it into a GIF, no color loss! Smoof :)

Azkadellia
04-12-2006, 05:12 PM
Cool!! THANK YOU!! :)

ahadinosaur
04-12-2006, 06:05 PM
Good Idea Pebble, I think I'll add that into the tutorial somewhere. I'll give credits to you, possibly a 'player tips' section? Haha, this tutorial just keeps on expanding. Let me know if you need anything else!

Your very welcome CrazyforBluStitch, Enjoy!