How to Make Simple Animations For Social Media

How to Make simple animations (1)Have you seen any blog posts recently with animation videos that play automatically?

Did you notice that Twitter recently started supporting animated GIFs?

These kinds of animations are a great way of capturing attention, and also an effective way of explaining something, simply, in a few seconds.

In this article, we are going to outline how you can make simple animations for social media.

What is an Animated GIF?

GIF is an acronymn for Graphics Interchange Format.  An animated GIF is basically a graphic image that moves!

When you create an animated GIF, a series of images is replayed back to back, so it looks like a video recording.

Of course, you can do a video recording instead, but if you want something simple then the animated GIF is simple to create and will generally be small in size.

How Do You Create an Animated GIF?

The program we use is called LICEcap. It is completely free and is available for both Mac and Windows.

The first thing you need to do is download LICEcap to your local machine.  If you’re on a Mac, you may need to set the permissions for this application in System Preferences (security and privacy -> general -> allow apps downloaded from -> allow LICEcap).

When you open up LICEcap, you’ll probably be confused because it opens up a frame with nothing in it! This makes it looks like the software wasn’t installed correctly, but don’t be fooled: this is the window that you use to specify what you want to record.

You can see, in the example below, that I’ve put an orange box around the LICEcap window.  It’s transparent so that you can see the area you want to record (in this case Hootsuite) within the application box.

 

Animiated gif

You highlight the area of the screen you want to record

 

You can change the size of this box to cover the area you want to record.

When you are ready to record, hit the record button in the bottom right-hand corner.  Next, you will be asked to pick a file name and then you’re ready.

 

Hootsuite animated recording

These are the configuration settings

 

The configuration settings are as follows:

  • Title frame –  Before the recording is shown, you can display a title explaining the GIF.  You can select the length of time the title should be on the screen for
  • Title – You can display text within your title frame or leave it blank
  • Elapsed time – Enable this if you want to display in the recording how much time has elapsed
  • Mouse button press – do you want to record the pressing of the mouse button?
  • GIF repeat count (0=infinite) – when you arrive on the post, the GIF will keep replaying. If you want it to stop after a certain number of times, you can specify that number here
  • Control+Alt+P – To pause and restart the recording.

 

 

Scheduling in Hootsuite

An animated GIF on how to schedule content in Hootsuite

How to Add other Effects to Animated GIFs

LICEcap does what it does very well, but it is not great for adding effects. If you want something basic that you’ll have up and running quickly, then LICEcap is probably the most suitable tool for you.  But if you want to add other effects, you can use a tool such as Ezgif. This provides you with functionality such as the following:

  • Resize your GIF – You may need to do this at times.  For example, WordPress doesn’t automatically resize your GIF, so will display it at the size it was recorded at (or resized to)
  • Crop – If you want to cut bits off around the edges
  • Optimize – This will attempt to reduce the file size
  • Effects – You can add various effects, for example changing it to sepia, or even displaying it upside down!
  • Speed – You can speed it up or slow it down
  • Split – This splits up the GIF into single frames so you can edit each one individually
  • Text – You can add text to the top, middle or bottom of the GIF.

 

Which Social Media Platforms Can you Embed Animated GIFs On?

You can embed them on your website and on Google+, Pinterest and Twitter.  They are currently not supported on channels such as Facebook or Instagram.

In January 2014, Twitter started to support animated GIFs so, if you attach a GIF to a tweet, it gets played when someone clicks on the play button within the image.

 

When to use animated GIFs

If you want to explain something in a video that only takes a few seconds, or if you want to capture something short that is not worth doing any editing for, animated GIFs can be ideal.  Having the GIF play automatically on social media channels does catch the eye, so this alone is worth trying out.  People generally don’t want a really long animated GIF playing in a blog post, but a short, snappy one works.

Summary

Animated GIFs are just another way of displaying content within social media that attracts attention.  It’s not suitable for every occasion but for brief, eye-catching videos they can be very useful.

When you share your blog post on the social media sites that support it, you can also post the animated GIF. This will attract attention on Twitter and encourage people back to your blog post.

Would you use animated GIFs?   Do you find them annoying or useful?

 

Clapper image by Shutterstock

  • http://www.omkarmishra.com Omkar Mishra

    You just beat me to this post Ian :)
    I was thinking about any Chrome extensions which can help us to create gif directly via browser. Any free options there?

    • http://www.razorsocial.com/ Ian Cleary

      Cool!!! You can use Licecap within the browser and it’s free!

  • http://www.socialidentities.com Hugh Briss

    Cool idea. Too bad they don’t work on Facebook though. Lately I’ve been turning my animated GIFs into videos so I can upload them to Facebook but in this case perhaps it would make more sense to create a screencast video instead and then convert it to GIF to upload to blogs and Twitter. One obvious advantage would be that you could include audio in the video for places where video makes sense and then have a GIF version without audio for other places.

    Ezgif even has a video to GIF converter.

    • http://www.razorsocial.com/ Ian Cleary

      Thanks Hugh, yes I did look for a Facebook option but the tool appeared to be converting to video also!

  • Kim

    Thanks for this post Ian! I’ve been meaning to find tools for this purpose. I’ve used LICEcap but want to find a way to polish up the gifs. I’ll definitely check out Ezgif!

    • http://www.razorsocial.com/ Ian Cleary

      Thanks Kim!

  • http://robzie.wordpress.com/ Rob Zaleski

    This is awesome, @iancleary:disqus! I’m a firm believer that you can say anything with the right gif, so I’ll definitely be downloading LICEcap and checking it out. Have you seen the gifyoutube thing yet? You basically find a video on YouTube, add “gif” after the “www.” and it allows you to pull a section from the video, turning it into a gif. Who knows how long YouTube will let it last, but it’s a pretty cool website too.

    • http://www.razorsocial.com/ Ian Cleary

      I haven’t rob but I’ll definitely check this out. Thanks for sharing! Ian

  • http://www.coralcrue.blogspot.in/ coralcrue

    wow, i love these, never knew how to make them. must try! thanks

    • http://www.razorsocial.com/ Ian Cleary

      Thank you!

  • http://www.commun.it SharelOmer

    Great one Ian!

    • http://www.razorsocial.com/ Ian Cleary

      Thanks Sharel!

  • http://MedicalMarcom.com/ JoeHage

    Thanks. I gave it a shot, scrolling through some photographs. Invariably, the gif pixelated the images. Is there a way to control that with LICEcap?

    P.S. What kind of name is LICEcap?

    • http://www.razorsocial.com/ Ian Cleary

      Hey Joe, you’re right about the name! I’m not sure how to control the pixelation with images. The following was recommended for images, want to try it? http://www.giffysnap.com/. Would love to hear if this works better for images. Ian

  • http://www.hughosmith.com/ hughosmith

    Ian this is awesome and came at just the right time. Once again you’re on the money with the info you share. Thanks!!

    • http://www.razorsocial.com/ Ian Cleary

      Thanks so much Hugho

  • Rajesh SIngh

    Thanks @iancleary:disqus A GIF can be a good option for showing a short tutorial, let’s say 30 secs. Let me check what I can record and share :)

    • http://www.razorsocial.com/ Ian Cleary

      Thanks Rajesh