Create an Animated Avatar

Intro: Create an Animated Avatar

This guide will show you how to make a small animated GIF, for use as an avatar in web forums.

Step 1: Get Everything You Need.

First of all, you need to get a copy of the show you want to make a GIF from on your computer. I can't tell you how to do this, but try finding another guide that describes how to rip a DVD into an AVI.

Next, you need a program that will allow you to take screenshots from a movie file. There are many programs that do this. The one I'm using is a free program called "Movie Snapshot," which is available here: http://www.cd2html.de/moviesnapshot.en.html
UPDATE: Another program I would reccomend for this task is VirtualDubMod. It's less simple, and a little more daunting than Movie Snapshot, but I also find it to be a little more stable and compatible with opening movie files. It also has many more features than Movie Snapshot. You can get it here: http://virtualdubmod.sourceforge.net/

Last, you need the GIMP, a free Image editing program, which you can get from this website: http://gimp-win.sourceforge.net/

Step 2: Get the Screenshots

Open up movie snapshot. It has a pretty simple intercface. Just use the Folder button to browse for your movie file and open it. It'll automatically start playing. When you get to the part you want to get the pictures from, push the pause button. You can use the << and >> buttons to advance or retreat by one frame, and the diskette button to save a picture.
It's a good idea to get something that will be short, simple, and loop easilly. I chose three frames of Bart and Lisa screaming from an episode of the Simpsons.

UPDATE: If you'd like to do this step with VirtualDubMod; open it up, then push Control-O to browse for your video file and open it. You can use the arrow keys to advance one frame forward and backward, or use the arrow buttons at the bottom. You can also use the slider bar, to move quickly through the movie. Once you've found the first frame you want to use, push Shift-1 and it will pop up with a little window, asking where you want to save it. VirtualDubMod defaults to saving in the .TGA format, which you really don't want to do. When saving pictures from VirtualDubMod, choose Bitmap (.bmp) as the output format, because it's a format everythign can open, and it doesn't compress the data. After you've saved the first picture, just advance the video by one frame and save again until you got the whole length of the video that you wanted to use, just like normally.

Step 3: Load Up Your Pictures in the GIMP

If you haven't already, follow the instructions on the Win-GIMP website for installing GTK and GIMP.

Now, Open up GIMP, and drag the first image into the main window, loading it. A new window, with the image, should pop up in GIMP. Also, a window entitled "layers" should pop up. If it doesn't, push Ctrl+L to bring it up. There should be one layer, currently, "Background," which contains the image you dragged into GIMP.


From the folder you're keeping them in, drag the rest of your images into the Layers window of GIMP, one at a time.

Step 4: Make It an Animation

Right click on the image, then go to Filters, Animation, Playback. A new window will pop up, click "play" in it, and it should show you what your animated GIF is going to look like. If it looks like it's playing too fast or too slow, we can change that later. If it looks like the frames are out of order, though, you need to need to change that now, so drag the frames around in the Layers window until it looks right.

Once they're in order, close the animation preview window, and right click on the image, going to the animation menu again, but this time click on "Optimize (For GIF)" It will think for a bit, then come up with a new image window. You can close the old one; we wont be needing it anymore.

Now, click on the new window, and you'll notice that the Layers window changes to reflect the new image. In the layers window, the names of the layers each contain "(100MS)." If you wanted to change the speed your GIF plays as, then do it here, by double-clicking on the name of each layer and changing the 100 to another number. Smaller numbers mean faster; larger numbers mean slower.

You may want to preview the animation again at this point, to make sure everything looks right.

Step 5: Resize the Image

Now, if you're using the image as an avatar in a webforum or something, there are probably some size restrictions you need to meet. I'm going to be resizing this image as thoough it needed to be 100x100 pixels. If you're planning on just keeping it as a GIF, or think the size it's at is fine, you can skip this step.

First, you might want to crop the image, to change it's dimmensions. I can make the final image be taller if I cut of the space on the left and right edges so that the image over-all is square.
To do this, right click on the image, then go to Image>Crop That will open up a window like the one shown here. Next to the "Width" and "height" boxes, there is a little chain. Click it so that it is broken. Next, if you want to narrow your image, lower the value in the width box. You'll notice that there's a little thumbnail of your picture that show what is being cut off. Don't like it only cutting off from one side? Then mess with the value in the X:Offset box towards the bottom of the window. Fiddle with this and the Width box, until the thumbnail looks correct. You can also do the same thing with the Height and Y:Offset, if you want to cut off uninsteresting parts from the top and bottom. Click Resize.



Now, we want to resize the image. Right click on the image again, and then go to Image>Resize. Lower the width of height values until you it's their value is within the size restricions you have. In this case, 100X100. Under Interpolation, go to "Cubic" for the best quality. Click on scale.

Step 6: Save It As a GIF

Click File>Save, save it wherever you want and enter in whatever you want for a filename, as long as it ends in ".gif". A new window will pop up, asking if you want to save it as an animation or merge the layers. Make sure you click "save as animation."

Click export, click ok in the rest of the windows that pop up, and it will save you a brand new animated gif. Now open it, and feel proud of yourself as you watch it.

Share

    Recommendations

    • Fix It! Contest

      Fix It! Contest
    • Metalworking Contest

      Metalworking Contest
    • Furniture Contest 2018

      Furniture Contest 2018

    53 Discussions

    0
    None
    ukdeejay

    6 years ago on Introduction

    Came across this site/tutorial/thread when I 'Googled' "how to create an avatar" -

    One question I would like to ask is -

    Are there no copyright issues with 'ripping' images (stills) or animations from a DVD? E.g. I quite like your 'little yellow robot' favicon, but wouldn't dream of using it for my own purposes!

    0
    None
    Dark Sage

    8 years ago on Introduction

    OMG I LOVE YOU!!!!!

    Been looking for something like this for months!

    And it Worked!!

    Thanks soooooooo Much :D

    Oshey - Animation.gif
    1 reply
    0
    None
    creampuff

    10 years ago on Introduction

    ok so i fixed that problem, pictures are fine, but now that its complete, how to i get it onto a forum that requires it to have a url (its just saved as a picture) how can i convert it to a url?

    2 replies
    0
    None
    yeah568creampuff

    Reply 9 years ago on Introduction

    Most likely, you have to upload it to a photo sharing service like Photobucket, or a similar service. After uploading it, you should find a URL of the image under or beside the image.

    0
    None
    HCGamer950yeah568

    Reply 7 years ago on Introduction

    i cant figure out how to take a picture on the movie snapshot i read the help andit says nothing about screen shot or taking a picture out of the video

    0
    None
    dana_m

    7 years ago on Introduction

    Hi.
    I had the same problem and found Video Avatar. This is simple tool for making moving userpics and staff loke this. Really liked it!
    http://www.geovid.com/video_avatar/ - link-)

    0
    None
    ToushiroDaijo

    8 years ago on Step 5

    Yeah When I tryed to do this to make a Toushiro Hitsugaya animation for my Avatar, it didn't squish it, it just cut off the rest.

    Is there a way to save a whole section? like if I don't wanna keep going forward and press save over and over. If I could let it play and it saves as it goes until I stop. Is there a way to do that?

    0
    None
    circa90

    8 years ago on Introduction

    i have used programm video avatar very easy and comfortable

    I used machinegun cat!!! (would have pic but i came down with a case of da n00b for stayin out in the 22 inches of snow we got this weekend...) can someone tell me how??

    0
    None

    I did it! Thanks for the instructable. Thank you also for the comments on vidgif. Definitely a lot easier than screenshots. Now I'm addicted making animated pictures.

    0
    None
    liquidsnake

    9 years ago on Step 6

    very helpful article.I have developed my avatar using the guidelines.Only problem i am experiencing is that of the size of the file.My file has the size of 136 KB and the allowed file size on the website is 11Kb.How do i reduce the size? thanks!