How to Reverse an Animated GIF

By  on  

Modifying visual media via code has always been a fascination of mine. Probably because I'm not a designer and I tend to stick to what I'm good at. One visual effect I love is seeing video reversed -- it provides a sometimes hilarious perspective on a given event.

Take this reversed water effect for example:

To reverse an animated GIF or video, you can use the ImageMagick library:

convert water-forward.gif -coalesce -reverse -quiet -layers OptimizePlus  -loop 0 water-reversed.gif

If you're interested in media engineering, check out my previous ImageMagick tutorials. These awesome media libraries are as close to an artist I will ever get!

Recent Features

Incredible Demos

  • By
    Create Your Own Dijit CSS Theme with LESS CSS

    The Dojo Toolkit seems to just get better and better.  One of the new additions in Dojo 1.6 was the use of LESS CSS to create Dijit themes.  The move to using LESS is a brilliant one because it makes creating your own Dijit theme...

  • By
    JavaScript Copy to Clipboard

    "Copy to clipboard" functionality is something we all use dozens of times daily but the client side API around it has always been lacking; some older APIs and browser implementations required a scary "are you sure?"-style dialog before the content would be copied to clipboard -- not great for...

Discussion

    Wrap your code in <pre class="{language}"></pre> tags, link to a GitHub gist, JSFiddle fiddle, or CodePen pen to embed!