Last night my friend, ronobvious, sent me a link to this video clip of Cesc Fabregas from Arsenal doing a little dance.
He then said he wished he could make an animated gif of the dance to use as an avatar. I thought that there must be a way, so I started looking for resources.
I immediately found Glickr and was excited because I thought all I would have to was input the URL to the video and that the utility would create the animated gif. Unfortunately, Glickr threw a nasty php error and didn’t work. Ok, this was going to take a little bit more work and would require a software based solution.
Programs like Photoshop CS3 Extended can do this but since I am not a graphic designer and simply use free programs like Irfanview for cropping and resizing, I have no need for expensive software.
I then discovered creating the animated gif would be easy with Gimp and the Animation Package, which is free, open source and cross platform. Now, I am not a big fan of Gimp as I find it unnecessarily complicated without using step-by-step instructions. But it’s free and almost as good as Photoshop for the average home user.
In this tutorial I am using Gimp 2.4.6.
Ok. First I needed to download the YouTube file. TechCrunch has provided a utility to do this.
I then downloaded and installed Gimp and the Animation package. I found a video that shows how to create an animated gif from a video file, followed the instructions and created the animation for my friend. The video is a little quick so you might find that you need to pause when you are learning the process. If you would like written instructions, I have provided them below.
Instructions
- Download the Video File.
- Download and install the Gimp files for your operating system. Install the main program first and then the Animation Package second.
- Go to Xtns > Split Video Into Frames > Extract Videorange.
- On the next screen, browse for the video file that you saved and select the button that says Video Range.
- Select the frames that you want in the gif. Mine was from frame 1 to frame 62. Then check the Loop and Play Selection Only boxes. You can test this with the Start Playback Button. When you are satisfied with the frames, select the Ok button. The program will then take a couple of seconds extracting the audio and video.
- Go to Video > Frames to Image and set the From Frames and To Frames to the numbers you selected earlier. In my case, this would be 1 and 62.
- Go to Video > Frames Scale. This will set the size. Make it as small as possible because the animated gif file can be really large.
- Go to File > Save As and make sure to select .gif as the file extension.
- The next screen will ask you to export. Change the first option to animation and leave the other option on indexed rather than changing to grayscale . Then Save.
And here is the animated gif I created from the above video clip.
Scam says
The youtube link from Techcrunch was worth reading this article for!
I’ve got photoshop myself, though I only use it for resizing images and adding basic text.
You’ve motivated me to go and read some tutorials though to see if I can make similar animations with it.
Scams last blog post – Breaking News : Bigfoot Body Found?
Kim Woodbridge says
I’m assuming that Photoshop is different that Photoshop CS3 – yes? If so, I have found a number of tutorials for the latter but not the former.
Downloaded YouTube videos are in .flv format, which most players can not handle, and a converter is necessary. VLC, however, can play .flv files.
http://www.videolan.org/vlc/
Of course, none of this matters if you are going to make an animation but it does if you also want to watch the video.
And once again, Scam has given me ideas for future articles :-)
Scam says
The videos I downloaded played straight off in mediaplayer, but then I do have a huge codec pack installed.
As for ideas.. really?
You must be struggling if you take inspiration from me!!
Scams last blog post – Breaking News : Bigfoot Body Found?
Kim Woodbridge says
Scam,
It must be the codec pack. But then I rarely use Media Player so sorry for the incorrect info.
You don’t give me direct ideas for articles but your comments make me think. For example, all the different ways to download YouTube videos, video converters, etc … But I’m actually not struggling for ideas but rather for time. I have SO many drafts of ideas …
And currently I have a great idea for demonstrating how to use BlingEasy with a certain photo I acquired yesterday … ;-)
Scam says
I have 116 draft posts at the moment – I like to make sure I always have something in reserve!
Time-wise I just wait until I am feeling inspired and then sit down and write half a dozen articles, scheduling them to be published at a later date.
OOooooohhhhhh @ THAT photo :P
Scams last blog post – Breaking News : Bigfoot Body Found?
Don says
Thank you for a well composed step by step tutorial, just what I needed to make my video to gif, and free too. Kudos to you.
Kim Woodbridge says
Don – Thanks for stopping by and commenting. Is the animated gif on your myspace page the one that you made?
Don says
Yes that is correct, thanks to you!
noewayout says
Hi there , i’m sorry to tell you but the software u said doesn’t work . I mean that i download your software step by step and when i choose to Xtns and get in , i can’t browse my video into the gif maker . may be it doesn’t support my video file type . But u said that to download form youtube right so does it mean in flv format ? cause i download it with flv format and it doesn’t shown in browsing . so if u can please help me with this problem , or u can email me how to do it ,I’m sure your are kind of person that can rely on .
Kim Woodbridge says
Hi,
Where did you save the youtube video file? Is it on your desktop or another location on your computer? The browse function in Gimp is slightly different than what we are accustomed to in Windows programs.
Does anything show up when you browse? Can you see the video file in Windows explorer?
noewayout says
Hi ,
Finally it show up in c/download and i manage to make it into 24 frame but there is the problem started .I don’t know what to do after this step especially
at the output format under the video input browser , I have no idea what kind of output format should i choose or what to do ,so i click the ok and there is some kind of file open and it is like some soft of video cutter or something and I’m having trouble since then.
If u don’t mind please send me step by step to make some gif.This is my email
tminus.1sec at gmail.com or u can try tminus.1sec at yahoo.com
Even if u can’t send email i still thanks u for helping me out with gif trouble
Kim Woodbridge says
Hi,
Can you look at my list of instructions in the article and tell me the step # where you are having trouble? If you are at the end, you need to save the file as a .gif
# Go to File > Save As and make sure to select .gif as the file extension.
# The next screen will ask you to export. Change the first option to animation and leave the other option on indexed rather than changing to grayscale . Then Save.
noewayout says
Hey there ,
I have some bad news!!
It didn’t work out yet ,I don’t know where i got wrong and all i get is just a
simple gif ONE FRAME IMAGE .
So if u have time please send me pacific step by step to make gif or some
video tutorial link or something .I’m counting on you .
THANKS!!
Kim Woodbridge says
Hi,
Well, it has worked for others who have tried it. These are detailed step by step instructions. If it is not working for you, you are missing a step or there is something wrong with the video. You can always do a google search – I’m sure other sites have similar instructions.
noewayout says
Hey guss what I finally got it .I should have look at the guide u post earlier .
Last time I thought you said me to go to the video clip instead of the video option on the browser .
Fewwwwww it take me a while to figure it out haha.But I got it now.Thanks for your help .
Beside can gimp software make the video file to go backward ,i mean like 1234321 .
Kim Woodbridge says
Great! I’m glad you got it to work.
I haven’t tried this out yet so I can’t help if it doesn’t work.
When you extract the frames (go through step #7) from the video, it creates images of the frames. Mine get saved to My Pictures. You can copy 3, 2,1 and rename as 5, 6, 7. Open the first image in Gimp normally and then open the other 6 as layers Then do steps #8 and #9.
Yagya Ram says
HI,
Really i appreacite your initiation.
Just i was find a way how to convert video clips to GIF. I search in internet, l was littel bit discouraged because not having good idea.
Later i found this page and became happy.
Now i am making files here.
Thanks
Kim Woodbridge says
Hi Yagya – Thank you for visiting and commenting. I’m glad the
tutorial was useful.
srtjxftjg says
Hi, where is “Xtns”? I don’t see it anywhere in Gimp. I googled and found nothing. Thanks.
Kim Woodbridge says
Hi – Are you using Gimp v 2.4.6 and did you install the Gimp Animation
package? If so, it is in the top menu that says – File, Xtns, and Help
Mary says
Hi – Actually, the link you have is for 2.6.5 and that version doesn’t even have a top menu in the toolbox, there’s a window in the middle with File and Help (with other tabs too), but no Xtns. Here’s a screencap : http://tinyurl.com/c7psjn
Kim Woodbridge says
Hi Mary – Thanks! Looks like Gimp was updated since I wrote this article. I’ll fix the link and not which version I’m using.
If I get the time I’ll see if I can figure out how to do this in the newest
version.
megan says
Thanks for the instructions. I’ve been looking for a simple way to make a .gif out of a video for ages, I found the tut really helpful.
Kim Woodbridge says
Hi Megan,
There are a lot of steps but if you follow them and use the right version of Gimp, it should work fine.
Jerry Milne says
When I followed your steps it made a .gif as expected.
I wanted to speed the .gif up, so I chose 49.997 as speed instead of 29.997.
Under playback it appeared to be exactly as I wanted. I went through the steps to save it and when it is viewed now, it’s normal speed in Firefox and slow speed in IE.
Any suggestions?
Kim Woodbridge says
Hi Jerry – Honestly I haven’t done much with this since I first wrote the tutorial and have never tried different speeds. Of course, it must be
something to do with the differences in the browsers but beyond that I really don’t know.
Jav says
Hi. Great tutorial.
I had 2.6.7 but I didn’t know how to use it so downloaded this older one and it worked. If you have a chance to work this out for newer version, would be appreciated!
Kim Woodbridge says
Hi Jav – I haven’t used the newer version but if I get a chance I’ll take
a look at it.
weGIF says
this post is so detailed but still easy to understand and follow… animated GIF is really “IN” nowadays here on the net… i actually keep an account of mine on it i really fun and enjoyable… thanks, nice job Kim the Great!
Gif Photo Animation
Kim Woodbridge says
I’m not sure if animated gifs are as popular as the used to be. But it was one of those things that I wanted to see if it could be done.
Also, I removed the link from your comment – the site is already using the commentluv plugin, which will provide a link back to your site.
rico says
hey when i try to open gimp 2.4.6 an error pops up saying “the procedure entry point g_content_type_from_mime_type could not be located in the dynamic link library libgio-2.0-0.dll.”
Kim Woodbridge says
Hi Rico – Are you running Vista? I believe that there is a problem using that version of Gimp in Visa but you could try running or installing it in
XP compatibility mode.
rico says
thnx kim im not on vista i use xp but i just had to delete gimp and reinstall it. i made my gif! lol thnx a lot!!
Hugh says
Hi… I was just about to download this, but you say it doesn’t run on Vista? If so that sucks.
Kim Woodbridge says
Hi Hugh – This version of Gimp is not supposed to be for Vista but I don’t
know for certain what happens as I am using XP. When Rico asked his question, I did a google search and found that some people were having trouble running this version in XP.
rico says
hey guys u can also do this on gimp 2.7 instead of going to (as stated in the 3rd step) xtns u go to video and click split video into frames -> extract video range and then contine the steps that follow
Kim Woodbridge says
Hi Rico – Thanks! I’ll try to update the post.
sapphire says
where can i find the video..
cause i dont see any video button on GIMP..
Kim Woodbridge says
Hi Sapphire – I wrote this article quite some time ago and was using Gimp version 2.4.6 The menus may be different in other versions.
Susan76 says
Hello,
I do realise this post is old but I have a question. I didnt yet download GIMP and want to know if it automatically changes the dimension of the gif or do I do it myself?
I thought it was step 7 but as I understood it reduces the size (kb, mb) not the dimension is that correct?
I’d like to know this beforehand because I would like to be able to choose the dimension of my gif.
I tried an online gif maker and it reduced the video dimension and it turned out blurry even though the video I used was HD.
I’m grateful for your help.
Thanks.
Kim Woodbridge says
Hi – It’s been a long time but I believe that I was able to set the size of the gif. One issue is that an animated gif file can be really big so the smaller the better.
I also believe that some of the menus have changed in Gimp in newer versions than the version used in this tutorial.
Susan76 says
Thank you very much for the quick reply. I’ll give it a shot.
Caroline says
Thanks so much for that tutorial! It really helped :D
Kim Woodbridge says
Hi Caroline – Great! I’m glad it helped.
Jae says
Hey, thanks for this awesome tutorial, I have one problem though, the gif I made goes really slow, like it’s in slow motion or something. How can I fix that?
Kim Woodbridge says
Hi Jae – I don’t know. I tested this a couple of years ago and never ran into that problem.
Hailu says
Thanks Everybody!!! ~ as you can see the freshly cotrevned works on iOS devices now~ so you can enjoy a heartfelt wink on all your handheld devices while still managing to watch my face animate on Laptops. I’m not sure why the page is not zooming to fill the screen of the user device but, with iOS devices and most modern gadgets you can zoom in with your touch screens to your heart’s content. Go nuts!
Sue says
Hi, I made an animated .gif and the size is like 7MB.
I don’t want to make the picture size smaller but is there any way i can shrink this to less than a MB.
I’ve seen 480X266 at less than 500kb and I’m wondering how to make this possible.
(I have 90 layers/frames)
Kim Woodbridge says
Hi Sue – I’ve never looked into compressing it – the one in my example is almost 5MB.
Christie says
Hi. I have been making your gifs using this tutorial for a while now. Unfortunately, my computer crashed and I had to reinstall everything. But, now when I try to make gifs again the playback is way too fast. How can I fix this?
Kim Woodbridge says
Are you using a newer version of Gimp?
Otherwise I’m not sure which setting it would be – I haven’t made one of
these in over 2 years.
Nicole says
The directions u laid out wer terrific and fairly easy to follow BUT I was not able to complete the process. I downloaded all the correct software and everything was going as planned but then when the step came to “click ok” after you have established the frame start and end and done the whole loop and play selected thing, when I clicked “ok” it brought up an error screen that gave me three options…Overwrite File, Overwrite FILES or Cancel. No matter which one I chose (I tried this several times with different videos) it would start processing so I would think everything was ok so I would then go to the step of FRAME TO IMAGE and do that as directed, no problem there so then I would go to the next step of FRAME SCALE, when I would try to complete this step it would keep flashing GIMP ERROR SCREENS like: Could not open frame_000002.xcf for reading:No such file or directory. And I could not go further, can you help me with this please? Do you know what I have done wrong or what the problem may be? Thanks so much!
Kim Woodbridge says
Hi Nicole – This article is pretty old now. My instructions work for the version of Gimp listed in the article – are you using that version?
Amy says
Hi, sorry to post after you clearly posted this years ago.
Thank you so much for the tutorial, it has really taught me well!
The only problem is when I posted the gif on the web it would play once and would go back to the first frame, even though I’d clicked on loop when saving and also when choosing the frames.
Have I missed something really obvious here? I have read the instructions over a few times and nothing really on that, so I’m guessing the problem is a silly mistake. :)
Oh and also, all of the frames that automatically get saved into ‘my documents’, if I can’t delete them can I move them to a different folder?
Any help would be appreciated!
Thanks again!
Kim Woodbridge says
Hi Amy – So, it only plays once and then stops? Unfortunately, I’m not sure. It’s been quite a while since I made the one I have and I haven’t kept up with how this works in more recent versions of Gimp.
You should be able to move the frame files – just make sure that all of the files related to the animated gif are kept together.
amira says
HI THX so much for telling us how can we great a animated gif ^^
but i have a problme , when i open my gif with firefox , the url of my gif is like this
file:///C:/Documents%20and%20Settings/Administrateur/Bureau/MINZY.GIF
& i can upload it in my tumblr or anything , can you tell me how can i change my url gif pllz
Kim Woodbridge says
You should be able to upload it as an image into Tumblr. That URL is where it is located on your computer.
amira says
thanx so much ^^
becaus of you now i know how can i great a gif
thanx thanx so much ^^
Michelle says
Thanks so much for this. It made the process very simple and quick! Just what I was looking for :)
DG says
Hey nice tutorial. It actually works. Took some time relearning how to use Gimp (haven’t used it in a while) plus it doesn’t hurt that I know how to make gifs with Photoshop. I did run into a whole slew of problems but with trial and error I figured it all out. Thanks. I wish I could show the gif here so people can see how good it looks.
Kim Woodbridge says
Great! I’m glad it worked for you.
Stephanie says
I tried making a gif, but once I picked what video I wanted to use, it wouldn’t let me click Video Range, which means I can’t go any further. I don’t know what to do. :(
Stephanie says
Ya know what? Never mind, It wasn’t the correct format. Hahaha.
Molly says
Hi, thanks for the great tutorial. I downloaded a video of an episode of a television show, and when I click ‘video range’ from the ‘extract videorange’ box, Gimp won’t let me search for frames over 1000. Any advice?
Fin says
Thank you for the great tutorial! Worked like a charm. Pretty sure this is the only youtube to gif tutorial I’ve seen that actually works and doesn’t try to get you to download malware.
Johnny Reb says
Kim, you rock! I’m pretty handy with software but this would have taken forever to figure out on my own. Thanks.
Mia says
Could u explain me this step:
Go to Xtns > Split Video Into Frames > Extract Videorange. ?
I’m not quite sure what Xtns are. Is this in Gimp?
Smile says
Someone commented that this is the only video to gif tutorial method that works.
Personally I find using the website coub.com is so much easier. You just put in the link and the creator is very easy and the looped film (gif) is made in about 20 seconds, and nothing has to be downloaded.
Amy says
Thanks a lot for this really helpful tutorial! I just managed to create my first gif and I’m mighty proud, hehe!
Akira says
Hi..
I managed to make one gif using your method however how do I input watermark/signature/short quotes on it????
i tried so hard to find way but couldn’t find it..I hope you can help me on that…
thanks in advance!