GIF JIF ZHAIF: Teaching an educational GIF workshop at RightsCon
We love animated GIFs because they let us communicate so much with so little. They’re visual, cyclical, and easy to share — powerful features for communicating unfamiliar concepts to an unfamiliar audience. This is why we think it’s important to learn how GIFs can be used strategically in education. We are all involved in online safety education and, following a session we co-organized on this topic at RightsCon, wanted to share what we’ve learned along the way in three posts:
Alright, so, how do you teach others how to make an animated GIF?
If you’re like us, you are:
1) interested in the potential of the animated GIF file format for educational purposes, and
2) ambivalent about how GIF is pronounced.
For the purposes of this blog post, please read “GIF” to yourself as an aspirated “h” like “hife”, rhyming with the long “i” of “strife”. Now that the pronunciation is established, we can move on to more important things, like sharing our lesson plan, which you can remix and repurpose however you like.
We tested out this lesson plan at RightsCon 2018.
Lesson length: 45–75 minutes, chunked into five main parts with flexible length.
Facilitators: Three, but you can have more facilitators or helpers, depending on the size of the group.
Audience size: Flexible.
Materials: Board for writing notes, markers, post-its for distribution, computer for showing examples (ideally a projector if you have one).
Learning objectives: Participants will see various examples of how GIFs are made using a few different tools. If there’s time, participants will make a GIF during the session to reinforce what they’ve learned.
Accompanying handout: Martin designed this accompanying How to GIF handout, which our friend Matt helped us print. Thanks, Martin and Matt! You can access the handout and remix it from this Google Doc.
Pre-session
We distributed our handouts. Optional: you can sing a song in the vein of You Say Tomato, I Say Tomato, replacing every single word with “GIF.” This is guaranteed to make people leave your session, and for those who remain, to groan loudly.
Part 1. Getting to know participants: What brought you here today? (2–3 minutes)
We handed out post-its to attendees and asked them to quietly take a minute or two to write down what they were interested in learning. What did they want to learn about GIFs? Did they want to make a GIF? What kind? We then asked them to pass the notes forward.
We also asked them to introduce themselves to the group, share their organization or group (if they so wished), and to share why they came to our session.
Why ask participants to write on post-its?
Asking participants to write provides some flexibility for introverted participants, who may feel less inclined to share aloud.
As facilitators, post-its are also quite useful for two reasons:
1. Given that this was the type of conference where people stream in and out of a room, we wanted to create a flexible lesson plan. We needed to quickly assess who was in the room, so that we could create appropriate groups for our later activity.
2. Post-its are nice because you can move them around on a surface easily, and group similar ideas together.
Part 2. Giving context: What is an educational GIF? (5–15 minutes)
We wanted to show a few examples of GIFs used in educational interventions. Dina led this discussion, showing some visual examples. You can check out our examples and educational GIFs we like in the post by Dina.
Part 3. How do you make a GIF? What are the need to knows? (10–15 minutes)
Martin and I gave a high-level overview of what a GIF is, as well as some popular software used for creating GIFs. For a more thorough explanation of LICEcap, FFMPEG and Giphy’s GIF Maker tool, check out the meta-GIF tutorial of how to make GIFs.
Martin demonstrated how to make a GIF from a music video, using LICEcap, a popular tool for screen-recording within a flexible-width window.
Simultaneously, we wrote the names of the software, and where to download each tool on the board.
Part 4. Splitting into groups and making GIFs. (20–30 minutes)
Wait, what about those post-its?
During a quiet period (e.g. while we were switching off speaking responsibilities and had some time to look at the post-its), we tried to group similar post-its with one another. We identified a few themes:
Video + quality GIFs: How do you make GIFs from existing video?
Tutorial GIFs: How do you show how to use a tool or interface?
Animation + designing GIFs: How do you make custom GIFs and characters?
Since there were three of us (myself, Dina and Martin), we decided to split up into groups of three, with each of us leading one group. Martin would lead the video + quality group, Dina would lead tutorial group, and I would lead the animation + design group. We determined these groups based on our level of comfort with the software (e.g., Martin had familiarity with FFmpeg, Dina had familiarity with LICEcap, and I had familiarity with Adobe software and alternative graphical tools).
In Martin’s group: Martin showed participants how FFmpeg works, and some commands to learn. They chatted about how to create high-quality, lossless GIFs from videos.
In Dina’s group: Dina showed participants how to use LICEcap to demonstrate using a tool. For example, if you’re showing people how to use a piece of software (like in a digital security explainer), how can you record your use of that software as you use it? How can you call attention to a feature of the software?
In my group: I asked participants what kind of custom GIFs they wanted to make. Each participant had a small project they worked on for the remainder of the time. If a participant didn’t know what to make, I suggested that they take a selfie video and turn it into a GIF, or record a video of something and turn it into a GIF.
On the fancy end, some participants had design software on their computers and wanted to practice using Adobe Illustrator and After Effects. Others had existing GIFs that they wanted to splice together and used the native tools on their computers to crop the GIFs to the right shared size, and combine the image sets. Others used free images like from the Noun Project, slideshow tools like Google Slides, and screen recording tools like LiceCap to create a slideshow that they timed, as they recorded part of their screen. Others used their smartphones to take a short video (like of them clapping), sending it to their computer, and submitting it to Giphy’s GIF Maker tool, and adding custom text to quickly convert it into a GIF.
Part 5. Reflection / sharing. (2–5 minutes)
In the last few minutes, we shared aloud what we worked on and talked about, with someone from each group sharing back. If folks had any things they learned, or wanted to share what they made, this was the space for it.
After the workshop
After some reflection on the session, and we came to the conclusion that we should have dedicated more time to actively making GIFs. So, if you are using our lesson as inspiration for your own workshop, we’d recommend spending less time showing examples, and more time supporting people with making GIFs that they’re excited about. Based on what we saw from my group and depending on what they wanted to animate, a first-time GIF-maker can make a GIF within 10–25 minutes.
And that’s it!
‘Tis the GIF’ing season. We’d love to see more educational GIFs out in the wild. Please feel free to remix this lesson however you see fit, and make lovely animated images with friends. If you taught others how to make GIFs, we’d love to hear about how it went.
