Sample GIF File for Testing - Learning Container

sample animated .gif file for download

Then, choose to download your GIF as a High-Quality file. That's it. Done! Congrats! 3. MailChimp's automation feature promo email. MailChimp. You can create GIFs as still images and animated files according to You can easily download your desired GIFs template according to the. 47 high-quality Animation Gif for free! Download and use them in your website, document or presentation. pvmstech8 - Animated GIFs Samples; triple spiral.

Final: Sample animated .gif file for download

Hdri images for 3ds max free download
How do i download .key foles to a pdf
Can you mod black ops digital download ps3
Them crooked vultures free download rar

Make an Animated GIF

Introduction: Make an Animated GIF

NOTE: This page might take a moment to load

Nothing sums up things like an animated GIF, and if you've spent any time on the Internet you've undoubtedly seen a few. For those who arrived late to class, an animated GIF is a digital picture format that has the ability to display animation. GIF format makes it possible to watch motion in a frame without having to use a video hosting service like Youtube or Vimeo.
The simple I ♥ bacon image above is an example of an animated GIF.

Animated GIFs, like its JIF peanut butter namesake, are amazing when prepared right and disastrous when handled wrong. This Instructable will cover 4 different methods:

Using a free online method - video and images into GIF
Using Photoshop orGIMP - images only into GIF
Using iWisoft - video only into GIF

Some examples on how animated GIFs can be used are:

There's almost no limit to how animated GIF's can be used. I'll do my best to cover the basics on how animated GIFs are made, and provide examples for you to try yourself with files (found at the bottom of this step, and Step 4 and 5). The methods shown are a few of many different ways to make animated GIFs. There are alternative methods using the same programs, and there may be easier and better methods not discussed at all. Please feel free to share your thoughts in the comments below.

↓ grab the Photoshop and GIMP templates here

Step 1: GIF Limitations

_{"@______.gif - image from marc kjerland used under Creative Commons}
what makes a good animatied GIF?
I think the most important thing is camera stability. When considering which pictures or video to use try to chose scenes with consistency in frame and subject. Moving shots/subjects can work, but the most effective animated GIF's have a frame of reference which your eyes can lock onto and your brain has an easier time understanding what's going on. And, because animated GIF's are usually short/small this makes it even more important.

loss of colour/definition:
GIF's are great to convey action but aren't so good at replicating a realistic colour spectrum.

"The format supports up to 8 bits per pixel thus allowing a single image to reference a palette of up to distinct colors. The colors are chosen from the bit RGB color space. It also supports animations and allows a separate palette of colors for each frame. The color limitation makes the GIF format unsuitable for reproducing color photographs and other images with continuous color, but it is well-suited for simpler images such as graphics or logos with solid areas of color."

This effect is called posterizatrion

size/length:
Animated GIF files are usually small, this usually means small in dimension or short in length, or both. When deciding what to make a GIF animation of consider the output size and length. Animated GIF's will not play correctly if reduced through inline HTML (using <img width="size")

experiment:
when using programs like Photoshop and GIMP there are huge areas where you can push the boundaries of making an animated GIF. The techniques I show are just the basics, with a little trial and error you can create some interesting results.

Step 2: Use an Online Service

The easiest way to make an animated GIF is to use an online service. The upside is that it is easy and free, but they usually have a watermark over the image along with some kind of restriction on output size/length/quality/image size/other.

Searching for "online GIF maker" returns these popular picture to GIF sites:

www.cronistalascolonias.com.ar (pictures only)
www.cronistalascolonias.com.ar (YouTube clips)
www.cronistalascolonias.com.ar (video and pictures)
www.cronistalascolonias.com.ar (pictures only)
www.cronistalascolonias.com.ar (pictures only)

Some are more successful than others, which is why I end up just making my own (see next)

Step 3: Using Photoshop

Photoshop is a very powerful tool that does loads of photo editing magic; it is also very expensive. Luckily, Adobe offer a student version and Photoshop elements, both of which are significatnly less expensive and follow the same process as described below.

I'll walk you through an example of a very simple animated GIF. I made this I ♥ bacon animation in about 20 minutes. You can download my finished Photoshop file (www.cronistalascolonias.com.ar) at the bottom of this step for your reference. The picture of this step is an animated GIF I made about making an animated GIF. (whoa!)

I used Photoshop CS5, but this will also work with earlier versions. I started by doing an image search for some very simple images of a heart and bacon. Each image was opened to it's own browser tab. When I found the images I wanted I opened up Photoshop and made sure the layers window was open (F7)

open a new canvas (ctrl+n) and set to x pixels
use fill tool and make a white base layer
insert reference material on new layers above base layer
re-size / clean reference images as necessary
type tool input captil "I", re-size as necessary
from top to bottom layer order should be: type layer "I" > heart image > bacon image > white background layer
open window > animation
in animation window create 6 new layers
animation frames
- frame 1: show type layer "I" and white base layer (turn off heart and bacon images)
- frame 2: turn off type layer "I", leave white base layer on
- frame 3: show heart image and white base layer
- frame 4: turn off heart image, leave white base layer on
- frame 5: show bacon image and white base layer
- frame 6: turn off bacon image, leave white base layer on
crtl+click the text, heart, and bacon layers, then set the delay to seconds
ctrl+click the alternate white animation layers and set delay to seconds
file > save for web
set the animation to loop forever and save your animated GIF
save the entire project after as a Photoship file (.psd)

I ♥ bacon made with Photoshop
↓ download the I ♥ bacon Photoshop file

Step 4: Using GIMP

GIMP is a free direct competitor to Photoshop and does many of the same functions.

The GIMP file I created is available at the bottom of this step. (in GIMP_www.cronistalascolonias.com.ar - file GIMP_www.cronistalascolonias.com.ar) The animation looks slightly different than the Photoshop version, but could be tweaked with the timing to look about the same. In lieu of making another animated GIF of making an animated GIF with GIMP (as I did with Photoshop), I just attached the layers explaining the steps below in GIMP format. (in GIMP_www.cronistalascolonias.com.ar - fileGIMP_www.cronistalascolonias.com.ar)

I used GIMP , but this will also work with earlier versions. Do an image search for some very simple images of a heart and bacon. Each image was opened to it's own browser tab. When I found the images I wanted I opened up GIMP and made sure the layers window was open (ctrl+L)

This GIF uses white space between pictures.
open GIMP > new image: x px
insert reference material on new layers above base layer
right-click each layer and scale layer - make layer dimensions x px
type tool input capital "I", re-size as necessary
make new white layers and put them in between each image layer
from top to bottom layer order should be: bacon image > white layer > heart image > white layer > type layer "I" > heart image > bacon image > white background layer
right click on a graphic layers in the layer tab and edit attributes, add in brackets your frame duration in milliseconds - ex: (ms)
right click on white layers and add (ms) in their atttributes
in the dropdown choose filter > animation > optimize for GIF
a new window will open showing the newly optimized GIF (max screen that new image)
change the speed of the animation in filter > animation > animation playback
export the animation in file > export. Chose your save folder and name the file www.cronistalascolonias.com.ar and choose GIF from the dropdown menu. Select export.
After saving your animation as a GIF you can save the entire project as a GIMP file (.xcf)
After saving the GIF close both windows.

I ♥ bacon made with GIMP
↓ download the I ♥ bacon GIMP file

Step 5: Converting Video to GIF

To convert a video clip to animated GIF I use iWisoft Video Converter (PC only) - It's free and has plenty of options to crop, trim and edit your selection. iWisoft can also handle HD video files.

first find the videos you wnt to make into an animated GIF
open iWisoft Video Converter
drag video file into iWisoft Video Converter
on the bottom of the converter there is a Profile dropdown, select Picture - GIF Animation format(*.gif)
Next to the dropdown there is Settings, in settings you can define the output Size (GIF dimensions) and Rate (higher number of frames means a smoother animation)
Next choose the Output destination. This is the folder where your animated GIF will appear when done
Click Start and wait for the conversion to finish
You can view your animated GIF in any Internet browser

Aside from making animated GIFs, iWisoft is also a powerful video conversion tool that can convert most popular types of digital media. I can't say enough good things about iWisoft - did I mention it's free? It's free. You should grab it.

Step 6: Go Forth and Animate!

By using one or more of the above mentioned methods you should now be ready to tackle your own animated GIF project. Beyond the basics shown here there are other ways to make animated GIFs, and even different techniques used to create your own personal results.

Got a neat animation of your own? Share your animated GIF in the comments below!

Happy making :)

Be the First to Share

Did you make this project? Share it with us!

Recommendations

Plywood Challenge
Plastic Contest
Battery Powered Contest

40 Discussions

www.cronistalascolonias.com.ar link in step 5 does not go to the file anymore. I want to download it to gif animate a video and am unable to do it. possible to give me another link please?

Great guide, but how do you put a gif into an 'ible?

Instructables will display your GIF natively, as long as it doesn't have to be resized to fit. Try pixels wide :)

Ok, but do I enter the gif as a picture, or if I convert a video to a gif online do I add the link like a video?

Add the GIF as a picture. However you convert it, save it to your desktop then upload the GIF as usual to Instructables

Thanks for your help! I think I got it now.

I've made a gif file with a animator caled pivot stickfigure animator.

Rad GIF! Enjoy the Pro Membership.

Here is my GIF. The link is - www.cronistalascolonias.com.ar

I can tell it's a GIF, but it looks like it's not animating.

I don't need the membership, but wanted to say thanks for making this Instructable and share what it helped me make! This is for The Mooshroom Hat Instructable. (For some reason, the gif works on the Instructable, and using the gif's link, but not in the comments here.)

"I used GIMP When I found the images I wanted I opened up Photoshop "??

Good catch. It now reads "I opened up GIMP".
This was a tough project to write up, as the GIMP and PS methods are very similar. Thanks for looking out!

I had trouble with the image size, and searched your instructable for guidance. I then reduced the image and was able to successfully upload an animated gif to the website. Thanks!

mmm that looks tasty. Thanks for sharing, enjoy the membership and patch!

It's finished :D
www.cronistalascolonias.com.ar
Uploader isn't working for comments :(

Great work, Emily! The GIF really shows off how this works.
Thanks for sharing. Enjoy the patch and the membership!

Don't have photoshop, can't install Gimp, to the internet then

So, this tells me a lot about your feelings for bacon :P
Love the ible, gonna try it

Thanks, Emily.
Making GIFs is fun and pretty easy. To show how deep my passion for bacon runs, the digital patch I'm awarding to people that post their own GIFs here is the I ♥ bacon animated GIF.

Источник: www.cronistalascolonias.com.ar

Sample animated .gif file for download