First Time Teaching Animated GIFs

I just blogged about the animated GIF I made while showing the Breakfast Club edition of ds106 how to make animated GIFs. What struck me after writing that post was that it’s the first since teaching this class that I actually taught any group of people how to make an animated GIF. There are a few reasons for that: 1) we have a few tutorials for this kind of thing, 2) I’ve never before taught ds106 in a classroom full of computers with Photoshop, and 3) I’m usually much lazier.

All that said, I had my chance today and I didn’t want to squander it. So I spent some time this morning consulting video guru Andy Rush so I could be sure I had a workflow that would make creating animated GIFs seamless even on lab computers that can be locked down and hostile to new programs. I think we came up with a pretty good formula, and I’ll sketch that out below for good measure.

We didn’t want the overhead of DVD ripping or any of that, so we decided to make them get the clips they want to work on from YouTube using pwnyoutube.com, in particular the File2HD option, and be sure to select the mp4 version of the YouTube clip (click the get files button, the big, honking Download buttons above and below are bad ads).

Once they had the clips with the scene they want to use I had them open MPEG Streamclip (which I installed on the lab computers beforehand, and it didn’t seem to need any special admin permissions in this lab). MPEG Streamclip allows them to select the precise in and out points of the short scene they want to animate and trim away the rest. Once they have done this they need to export it as an mp4 file (this is where these directions for PhotoShop diverge for GIMP which would require them to export the video as individual image files).

Finally, they import the video to Photoshop (we are using CS 5.5 on the PC) and it is Import–>Video to layers. After that they simply go to Window–>Animation and animate the GIF and save for the web.

It was amazing, I showed them how to do this process in about 15 minutes, and they spent the next hour and 15 minutes making GIFs, and I have to say I was very impressed. Their files were a bit bloated, and we talked about that, but over all there work so far has been amazing. I am blown away. Here are a few samples!

I love that this student figured out adding text to animated GIFs. #4life!

This one is a bit long and bloated for its own good, but I love it.

Game on college students, you need to bring your A-game to catch up with these Breakfast Club all-star ds106ers who are 4life in only 2 weeks!

This entry was posted in digital storytelling and tagged , , . Bookmark the permalink.

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.