GIF TUTORIAL (Might as as well use a hot image) Includes sharpening the images to lessen the damage done when the gif is optimized.


I’m working on my gif making skills. I feel I’m like I’m almost there. To reduce grain you sharpen the image A LOT. Note: this will increase the gif file size so maybe trim a 100px after.


To make my gifs I use three free programs

  • Firefox extension videodownloader
  • KM Player
  • GIMP


Download the video you want (HD wherever possible) with firefox add on videodownloader.


Open the video with KMplayer.

Once you’ve chosen the moment you want to gif, take note of the time mark and pause the video. Right click the video and go to frame extract. At the top of this new window choose the destination folder you want to save your frames to. Then click start and play your video. Press stop when the moment has ended.


Remember you only want to use a few seconds, if that,  because gifs need to be small for tumblr. Choose your moments wisely and maybe make a few small gifs instead of a long one.


In your chosen folder you will see a screenshot of every millisecond. These are your frames.


Open GIMP and go to file then open as layers.

It will load each frame, which will take a moment. You can resize your image by going to image->scale image or if you want to cut some of the image away to reduce size and/or edit, go to the rectangle in your toolbox on the left and drag it over the image, then go to image-> crop selection. Note: When you use ->scale image to resize, and type in say, 400px width on an image that was 600px, Click into the Height box or it won’t automatically reduce the height. The joys of GIMP!.


To see what your animation looks like go to filters->animation->playback.


To sharpen the gif you have to sharpen each layer in GIMP. With Photoshop I believe you can multiselect your layers and apply the effect or use an adjustment layer. Sadly GIMP isn’t that easy (it is legally free after all). In gimp you have to click filters->enhance->sharpen and do it to every layer. You sharpen the layer until the image looks a little over sharpened. Not cartoonish but obviously too sharpened. I sharpened the above image 120%. I did 60% twice as gimps limit is 100%. This may be become too distorted/cartoonish for your images though. Just see what the layer looks like, it just needs to look a bit over sharpened. it may seem too much as an image but leave it alone as the gif will look good when you optimize and export it, as above. To save time once you have sharpened one layer just click the next one and press ctrl+F and it will sharpen the layer your currently on without you going to filters->sharpen again.

Then go to filters->animation->optimize gif. This optimizes and compresses the gif for web usage. It can mess up a gifs colouring and make them very poor quality. The fact you sharpened before hand will lessen the effect considerably.


Then go to file->export. Export as GIF.  It might tell you you have gone over canvas borders and do you wish to crop etc, it’s fine click okay. It’s to do with the way you have re-sized it. I think it is when I’ve resized image and not the canvas or something to that effect. Where it says all images or all files, make sure —>GIF image (*gif) is selected.

It will pop up with a box titled export image as gif. Click ->As Animation or or it won’t move. Loop forever must be checked also or the gif will play once and stop. There are further GIF options about delays between frames which you can completely ignore, or mess with when you have done a few to slow the gif down etc.

Click Export and you are done.


I always open the gif in my internet browser to see if I am happy with it as well as doing a test post on tumblr as you never know when you will get a “error loading file” message. Whenever I have seen this I have simply scaled the gif down a 100px or more and it has fixed it, which has been fine because photoset posts make your gif larger anyway. Tumblrs current limit is 2mb for gifs, it seems that your whole post/photoset can’t be over 5MB or you’ll get error messages and gifs that do not move. I am still learning about this.


That’s all she wrote.


-S (a.k.a lickitandlikeit)

13 notes

  1. beloved-changmin55 reblogged this from lookfar
  2. overnight-shipping reblogged this from dreamingforeverinwonderland
  3. dreamingforeverinwonderland reblogged this from lickitandlikeit
  4. lookfar reblogged this from lickitandlikeit and added:
    i should learn this…
  5. lickitandlikeit posted this