Yesterday, I read a great article by Nate Desmond on OKdork.com where he showed some pretty ninja tricks for analyzing website data using Import.io and Excel. Aside from the awesome ideas that he was sharing, I was also really impressed by his use of animated GIF images that showed exactly what he was doing on his screen (here’s an example).
Nate later revealed to me in the comments on GrowthHacker.com that he made these GIFs of his screen movements using a Free, open-source software called LICEcap. I soon noticed that a few other commenters were also curious about this feature, so I decided to try out the software and create this little demo to show how easy it is to create GIF screenshots .
I’ve gotta say that I was more than a little impressed with the software and how easy it was to use. (It only took me 15 minutes from my first Google search for LICEcap until I had my first image completed.) I’m sure this is going to quickly become one of my favorite new tools.
These kinds of animated images can be a super powerful addition to any how-to or tutorial articles that you write because they provide a really fast and simple way to show your steps without creating a full video. There reality is that most people don’t have patience to watch even a short video, but they will pay attention long enough to watch your 5-10 second animations.
OK, let’s get started with the tutorial…
Step-by-step guide for creating animated GIF Screencasts…
(Yes, I realize the irony that I don’t include any animated GIFs in my tutorial below, but I couldn’t figure out how to record the software itself in action.)
1) Download the LICEcap software and install it on your computer.
(Comment – The software was a little buggy at first when I installed it on my MacBook Pro and all my recordings came out black. However, after a few minutes, the problems seemed to sort themselves out and everything worked great.)
2) Open LICEcap and size the screen capture window over the part of your screen that you want to record in your GIF.
3) Click on the Record button in the lower corner of the window.
4)After you click Record, the software will ask you to name your file and pick a location where you want it to be saved. It also provides the options to select certain features such as if you want your recording to track your mouse clicks.
5) Time to record – After you click Record, you will now be recording your screen. Do whatever actions you want to record, then click Stop.
6) That’s it! Your animated GIF screencast image will now be saved in the location that you selected in step 4 above.
As you can see, this is a super easy process and only take a few minutes.
How can you use animate GIF screencasts?
We all know that in content marketing, images are super important. So if a picture is worth a thousand words, then animated images should be worth an easy 10K or more.
Especially, in the case of how-to articles, this technique can be a lot more effective than including a series of still image screenshots.
This is also a great way to grab people’s attention on social networks like Google+ where everybody loves a good animate GIF.
How do you plan to use GIF Screencasts in your content. Leave a link to your new Animate GIF in the comments below.
Very Handy shared with 5 people in the company.
Cheers
Hey Aaron,
Great job! The whole time I was reading that article that was my #1 question.
Cheers,
Amit
Thanks Aaron,
I have seen these GIF screencasts used in a few other posts recently and I was wondering how to make them.
Great to see that it’s not too hard, although I don’t know how I would have ever found that software.
Glad I read the comments of that article.
Nice article Aaron,
Thank you very much!
Thanks for writing this up Aaron. Came here from Nate’s post on OKDork. Really daisy chaining up some great tools/techniques today!
Hey Tim, Thanks for visiting. Glad you enjoyed the post.
Thanks Aaron, I’ve invested in Screenflow for my professional screencasts, but this will be an awesome utility to fill in those gaps with normal articles. Much appreciated.
Kudos! This is great. I finally had a reason to use it and it worked like charm!:)
Right on! Post a link so we can see your new GIF in action.
Great article aaron…..It’s powerful for create engaging content.Thanks..
I think invision have a good post on making animated gifs also. They also use them excellently across the site, including the homepage I believe.
Nice post!
Thank you for these instructions, really helpful!! I always use Acethinker Screen Recorder to make screencast and export as GIF file, works fairly well. It is a free online tool that lets you record your screen right from the browser. Share it here as an alternative method.