Zach’s ugly mug (his face) Zach Leat­herman

The Perfect GIF

Watch in 12 minutes 1k 07 September 09, 2014

Last year at Barcamp Omaha, I did a tongue-in-cheek talk on Impostor Syndrome. This year, I was floundering on picking a topic for Barcamp—until Derek Eskens suggested I do a talk on GIFs. With only two days to prepare, I think it turned out fairly well.

A photo of the audience watching the talk

In the talk I discuss: pronunciation, GIF sources, how to create your own GIFs, and GIF search and workflow. If you listen closely, you can hear the audience (playfully) boo when I finally pronounce GIF for the first time in the talk.

Watch on YouTube: The Perfect GIF

Watch on YouTube

I did not post slides for this talk, given the loss in fidelity with an unanimated deck. But I’ve included below the list of referenced resources.

Sources

Utilities

  • LICEcap to create GIFs
  • gifwit to catalog/search GIFs
  • HoverZoom for easy inline previews of animated GIFs (not mentioned in the talk, but still worth including).

Animated GIFs used (in order of appearance)


< Older
W3C Status Banners
Newer >
Better @font-face with Font Load Events on Dev.Opera

Zach Leatherman IndieWeb Avatar for https://zachleat.com/is a builder for the web at Font Awesome and the creator of Build Awesome (née IndieWeb Avatar for https://www.11ty.devEleventy/11ty), an award-winning open source website generator. He measures website performance with speedlify and at one point became too fixated on web fonts. He has given 89 talks in nine different countries at events like Beyond Tellerrand, Smashing Conference, Jamstack Conf, CSSConf, and The White House. Formerly part of CloudCannon, Netlify, Filament Group, NEJS CONF, and NebraskaJS. Learn more about Zach »

7 Comments
  1. Avatar for remybach
    remybach Disqus
    10 Sep 2014
    Ha ha... can't say I agree about the pronunciation of "gif", but great talk :)I realise you don't use Android but for anyone that's interested, I created an app for my gif workflow: http://remy.bach.me.uk/blog...
  2. Avatar for jmhobbs
    jmhobbs Disqus
    10 Sep 2014
    Gifsicle is a killer tool for fine tuning timing on gifs and optimizing them too - http://www.lcdf.org/gifsicle/And, of course, I have to plug http://dun-dun-duh.com/ and http://gifmebro.herokuapp.com/
    1. Avatar for zachleat
      zachleat Disqus
      10 Sep 2014
      gifmebro is amazing! Can it do a variable length gif?
      1. Avatar for jmhobbs
        jmhobbs Disqus
        10 Sep 2014
        It's just a dumb little thing. Would be totally possible to configure it up. I'll put the code on jithub.
      2. Avatar for jmhobbs
        jmhobbs Disqus
        10 Sep 2014
        1. Avatar for jmhobbs
          jmhobbs Disqus
          10 Sep 2014
          It's pretty hairy in there, I didn't clean it up much before putting it up.
        2. Avatar for zachleat
          zachleat Disqus
          11 Sep 2014
          Awesome!
Shamelessly plug your related post

These are webmentions via the IndieWeb and webmention.io.

Sharing on social media?

This is what will show up when you share this post on Social Media:

How did you do this? I automated my Open Graph images. (Peer behind the curtain at the test page)