Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/ycaihua/awesome-gif

A curated list of awesome gif tools & scripts
https://github.com/ycaihua/awesome-gif

List: awesome-gif

Last synced: 3 months ago
JSON representation

A curated list of awesome gif tools & scripts

Awesome Lists containing this project

README

        

# Awesome GIF [![Awesome](https://cdn.rawgit.com/sindresorhus/awesome/d7305f38d29fed78fa85652e3a63e154dd8e8829/media/badge.svg)](https://github.com/sindresorhus/awesome)

A curated list of awesome gif tools and scripts : libraries, utilities, and short examples. For more awesomeness, check out [awesome](https://github.com/sindresorhus/awesome).

- [Awesome GIF](#awesome-gif)
- [General Tools](#general-tools)
- [Utilities](#utilities)
- [Libraries](#libraries)
- [ActionScript](#actionscript)
- [C++](#c++)
- [C\#](#c\#)
- [Haxe](#haxe)
- [Java](#java)
- [Javascript](#javascript)
- [PHP](#php)
- [Objective-c](#objective-c)
- [Swift](#swift)
- [GUI](#gui)
- [Hosting](#hosting)
- [Online tool](#online-tool)
- [Search Engine & communities](#search-engine-and-communities)
- [3rd Party](#3rd-party)
- [Scripts](#scripts)
- [Frames to gif](#frames-to-gif)
- [Gif to frames](#gif-to-frames)
- [High quality gif](#high-quality-gif)
- [Optimize gif](#optimize-gif)
- [Lossy gif compressor](#lossy-gif-compressor)
- [Making gif from video](#making-gif-from-video)
- [Cinemagraphs](#cinemagraphs)
- [Perfect loop](#perfect-loop)
- [Youtube video to gif](#youtube-video-to-gif)
- [Speed](#speed)
- [Grabbing each frame of an HTML5 canvas](#grabbing-each-frame-of-an-html5-canvas)
- [Miscellaneous](#miscellaneous)

## General Tools
- [FFmpeg](https://www.ffmpeg.org)
- [ImageMagick](http://www.imagemagick.org/)
- [GraphicsMagick](http://www.graphicsmagick.org/) - *GraphicsMagick is usually faster than ImageMagick*
- [MoviePy](http://zulko.github.io/moviepy/) - *Python module for video editing*

## Utilities
- [Gifify](https://github.com/jclem/gifify) - *convert screen recording into GIF*
- [Gifsicle](https://github.com/pornel/giflossy) - *lossy gif compressor*
- [Gifs](https://github.com/jglovier/gifs) - *storage place for gifs* - [demo](http://gifs.joelglovier.com)
- [Gifshot](https://github.com/yahoo/gifshot) - *create animated GIFs from media by Yahoo* - [demo](http://yahoo.github.io/gifshot/)
- [Gifsockets](https://github.com/videlalvaro/gifsockets) - *Real Time communication library using Animated Gifs as a transport*
- [X-gif](https://github.com/geelen/x-gif) - *a web component for flexible GIF playback*
- [gifme](https://github.com/holman/gifme) - *generate animated GIFs*
- [GifW00t](https://github.com/yaronn/GifW00t) - *javascript web recorder*
- [gif-machine](https://github.com/lelandbatey/gif-machine) - *gif creation from Youtube videos*
- [gifstreaming](https://github.com/jbochi/gifstreaming) - *Live video streaming server*
- [Screengif](https://github.com/dergachev/screengif) - *Create animated gif screencasts*
- [vnc-over-gif](https://github.com/sidorares/vnc-over-gif) - *Serves screen updates as animated gif over http*
- [gifdeck](https://github.com/jaipandya/gifdeck) - *Convert your SlideShares into animated GIFs*
- [Gifbot](https://github.com/schuyler/gifbot) - *GIF search for Slack*
- [Gif-camera](https://github.com/FuzzyWobble/GIF-Camera) - *create animated GIFs using webcam*
- [Gifline](https://github.com/zehfernandes/gifline) - *Chrome extension to put GIFs in your emails*
- [Gifdrop](https://github.com/markjaquith/gifdrop) - *Create a repository for your collection of gif images*
- [Gh-gif](https://github.com/node-gh/gh-gif) - *NodeGH plugin for commenting on pull requests/issues using GIF reactions*
- [Tty2gif](https://github.com/z24/tty2gif) - *record scripts and their outputs into both binary and gif formats*
- [Giftoppr](https://github.com/desktoppr/giftoppr) - *Sync your favourite gifs with Dropbox*
- [Gifit](https://github.com/Fauntleroy/GIFit) - *Chrome extension to make a GIF from a YouTube video*
- [Ccapture.js](https://github.com/spite/ccapture.js) - *Capture animations created with HTML5 canvas*

## Libraries
### ActionScript
- [Flash Animated Gif Library](https://github.com/theturtle32/Flash-Animated-GIF-Library) - *AS3 library for playing Animated GIFs in Flash*

### C++
- [Node-gif](https://github.com/pkrumins/node-gif) - *C++ library to make Gif*
- [Gif-h](https://github.com/ginsweater/gif-h) - *C++ one-header library for the creation of animated GIFs*
- [OfxGifEncoder](https://github.com/jesusgollonet/ofxGifEncoder) - *C++ openframeworks addon to export animated gifs*

### C\#

- [WpfAnimatedGif](https://github.com/thomaslevesque/WpfAnimatedGif) - *A simple library to display animated GIF images in WPF*
- [XamlAnimatedGif](https://github.com/thomaslevesque/XamlAnimatedGif) - *A simple library to display animated GIF images in XAML apps (WPF, WinRT, Windows Phone)*

### Haxe
- [Gif](https://github.com/snowkit/gif) - *Haxe gif encoder*

### Java

- [Android-gif-drawable](https://github.com/koral--/android-gif-drawable) - *Views and Drawable for displaying animated GIFs on Android*
- [gifanimateddrawable](https://github.com/Hipmob/gifanimateddrawable) - *Use an animated GIF as an Android Drawable*
- [GifView](https://github.com/RoiSoleil/GifView) - *android library to deal with Gif*
- [Gif Movie View](https://github.com/sbakhtiarov/gif-movie-view) - *Android View widget for displaying GIF animations*
- [GifImageView](https://github.com/felipecsl/GifImageView) - *Android ImageView that handles animated GIF images*
- [Gif-animation](https://github.com/extrapixel/gif-animation) - *Processing library to play and export GIF*
- [Android-gif-encoder](https://github.com/nbadal/android-gif-encoder) - *animated GIF encoder for Android*
- [GIFDroid](https://github.com/quackware/GIFDroid) - *Android video to GIF converter*
- [Android-GifStitch](https://github.com/CaptPhunkosis/Android-GifStitch) - *create and share animated gifs*

### Javascript
- [Gif.js](https://github.com/jnordberg/gif.js) - Javascript - *create GIF from the DOM*
- [Omggif](https://github.com/deanm/omggif) - Javascript - *GIF 89a encoder and decoder*
- [Animated_GIF](https://github.com/sole/Animated_GIF) - *Javascript library for creating animated GIFs*
- [Gifffer](https://github.com/krasimir/gifffer) *JavaScript library that prevents the autoplaying of the animated Gifs*
- [Gifplayer](https://github.com/rubentd/gifplayer) - *jquery plugin to play and stop animated gifs*
- [Jsgif](https://github.com/shachaf/jsgif) - *JavaScript GIF parser and player*
- [node-gify](https://github.com/tj/node-gify) - *Javascript convert videos to gifs using ffmpeg and gifsicle*
- [Gifencoder](https://github.com/eugeneware/gifencoder) - *Server side animated gif generation for node.js*
- [Gif-video](https://github.com/hughsk/gif-video) - *Javascript Convert a GIF image into an HTML5-ready video*
- [Gif-player](https://github.com/apankrat/gif-player) - *On-demand GIF loader/player in Javascript*
- [GifgifLab-face](https://github.com/Viral-MediaLab/gifgifLab-face) - *Facial-emotion detectors*

### PHP
- [GifCreator](https://github.com/Sybio/GifCreator) - *PHP class that creates animated GIF from multiple images*
- [Spacer.gif](https://github.com/msng/spacer.gif) - *PHP script offering spacer.gif 1x1*
- [GifFrameExtractor](https://github.com/Sybio/GifFrameExtractor) - *PHP class that separates all the frames of an animated GIF*

### Objective-C
- [AnimatedGIFImageSerialization](https://github.com/mattt/AnimatedGIFImageSerialization) - *decodes an UIImage from Animated GIFs image data*
- [UIimage from GIF](https://github.com/mayoff/uiimage-from-animated-gif) - *UIImage category that loads animated GIFs*
- [GIFRefreshControl](https://github.com/cyndibaby905/GIFRefreshControl) - *"Twitter music" and "Yahoo! Weather" like pull-to-refresh control*
- [UIImageView-PlayGIF](https://github.com/yfme/UIImageView-PlayGIF) - *UIImageView category/subclass for playing GIF*
- [FLAnimatedImage](https://github.com/Flipboard/FLAnimatedImage) - *Gif engine for iOS by FlipBoard*
- [Animated-GIF-iPhone](https://github.com/arturogutierrez/Animated-GIF-iPhone) - *Support for Animated GIF on iOS*
- [UzysAnimatedGifPullToRefresh](https://github.com/uzysjung/UzysAnimatedGifPullToRefresh) - *PullToRefresh using animated GIF to any scrollView*
- [iOS AnimatedGif](https://github.com/scspijker/iOS_AnimatedGif) - *Animated GIF library for iPhone*
- [SvGifView](https://github.com/smileEvday/SvGifView) - *iOS load and display Gif*
- [GifHUD](https://github.com/cemolcay/GiFHUD) - *iOS progress hud for displaying only animated gif images*
- [Video-Background GIF](https://github.com/ElvinJin/Video-Background-GIF) - *iOS Video Background GIF*
- [AnimatedGifExample](https://github.com/kasatani/AnimatedGifExample) - *iOS animated and transparent gifs*
- [OLImageView](https://github.com/dtorres/OLImageView) - *iOS OLImage and OLImageView support for animated GIFs*

### Swift
- [Gifu](https://github.com/kaishin/gifu) - *animated GIF support for iOS in Swift*
- [SwiftGif](https://github.com/bahlo/SwiftGif) - *UIImage extension with gif support*

## GUI
- [Glyph](http://www.glyph.video/) - *tool for generating seamlessly looping GIFs and cinemagraphs from videos*
- [Qgifer](http://sourceforge.net/projects/qgifer/)
- [GIFs](https://github.com/orta/GIFs) - *Mac App for finding GIFs*
- [VineGifR](https://github.com/esten/VineGifR) - *Mac app to turn Vine videos into gifs*
- [GifPro](https://github.com/unixpickle/GifPro) - *Gif encoder for Mac*

## Hosting
- [Gfycat](http://gfycat.com) - *Maximum gif/video length: 15 seconds. Maximum file upload is 300Mb*
- [Imgur](http://imgur.com) - *Maximum file upload is 50MB*

## Online tool
- [Vid2gif](http://imgur.com/vidgif) - *Video to Gif by imgur*
- [EzGif](http://ezgif.com/) - *Online GIF maker and image editor*
- [Giflr](https://giflr.com/) - *A web app for making or remixing animated GIF's*
- [Gif.gf](http://www.gif.gf/labs/face) - *Provide a matching GIF for your face*

## Search engine and communities

- [Giphy.com](http://giphy.com)
- [Gifme.io](http://gifme.io)
- [9gag.com/gif](http://9gag.com/gif)
- [Reactionsgifs](http://reactiongifs.com/)
- [Educational Gifs](https://www.reddit.com/r/educationalgifs)

## 3rd party
- [Starwars-dot-gif](https://github.com/LindseyB/starwars-dot-gif) - *Python script to generate gifs from star wars*

## Scripts

### Frames to gif

FFmpeg
```bash
ffmpeg -f image2 -i image%d.jpg animated.gif
```

Imagemagick
```bash
convert -delay 20 -loop 0 frames*.png animated.gif
```
Bash script (```frames2gif.sh```) for GraphicsMagick, ImageMagick, FFmpeg
```bash
#!/bin/bash
if [ $# -ne 5 ]; then
echo "please provide the moviename and directory where to store the frames"
echo "./frames2gif.sh [directory] [movie.mp4] [filename.gif] [gm|im|ffmpeg] [png|jpg]"
exit 1
fi
if [ "png" == "$5" ]; then
suffix="png"
else
suffix="jpg"
fi

CONVERT=$(which convert)
GM=$(which gm)
FFMPEG=$(which ffmpeg)
FFPROBE=$(which ffprobe)
FPS=$($FFPROBE -show_streams -select_streams v -i "$2" 2>/dev/null | grep "r_frame_rate" | cut -d'=' -f2 | cut -d'/' -f1)
echo "FPS: ${FPS}"
if [ "im" == "$4" ]; then # use imagemagick
FPS=$(echo "1 / ${FPS} * 100" |bc -l)
$CONVERT "$1/*.${suffix}" -delay ${FPS} -loop 0 "$3"
elif [ "gm" == "$4" ]; then # use graphicsmagick
FPS=$(echo "1 / ${FPS} * 100" |bc -l)
$GM convert "$1/*.${suffix}" -delay ${FPS} -loop 0 "$3"
else # use crappy gif-algorithm from ffmpeg
$FFMPEG -f image2 -framerate ${FPS} -i "$1/%08d.${suffix}" "$3"
fi
```
From [DeepDreamVideo](https://github.com/graphific/DeepDreamVideo), [source](https://github.com/graphific/DeepDreamVideo/blob/master/frames2gif.sh)

### Gif to frames

```bash
ffmpeg -i video.mpg image%d.jpg
```
```bash
convert -coalesce animated.gif image%05d.png
```

### High quality gif
with ffmpeg / based on this [article](http://blog.pkh.me/p/21-high-quality-gif-with-ffmpeg.html)

- Generate a palette :

```bash
#!/bin/sh
start_time=30
duration=3
ffmpeg -y -ss $start_time -t $duration -i input.avi \
-vf fps=10,scale=320:-1:flags=lanczos,palettegen palette.png
```
- Output the GIF using the palette :

```bash
#!/bin/sh
start_time=30
duration=3
ffmpeg -ss $start_time -t $duration -i input.avi -i palette.png -filter_complex \
"fps=10,scale=320:-1:flags=lanczos[x];[x][1:v]paletteuse" output.gif
```
[article](http://blog.pkh.me/p/21-high-quality-gif-with-ffmpeg.html)

### Optimize Gif

```
convert -layers Optimize output.gif output_optimized.gif
```

### Lossy GIF Compressor

```bash
./gifsicle -O3 --lossy=80 -o lossy-compressed.gif input.gif

```
[Lossy Gif](http://pornel.net/lossygif)

### Making gif from video

```python
from moviepy.editor import *

clip = (VideoFileClip("input.avi")
.subclip((4,00.00),(5,00.00))
.resize(0.3))
clip.write_gif("output.gif")

```
[article](http://zulko.github.io/blog/2014/01/23/making-animated-gifs-from-video-files-with-python/#converting-a-video-excerpt-into-a-gif)

### Cinemagraphs

Freezing a region

```python
from moviepy.editor import *

clip = (VideoFileClip("input.avi")
.subclip((4,00.00),(5,00.00))
.resize(0.3)
.fx(vfx.freeze_region, outside_region=(170, 230, 380, 320)))
clip.write_gif("output.gif", fps=15)
```
[article](http://zulko.github.io/blog/2014/01/23/making-animated-gifs-from-video-files-with-python/#freezing-a-region)

```bash
ffmpeg \
-ss ${starttime} -t ${duration} -i ${vidfile} `# body of loop` \
-ss TODO ${starttime} MINUS ${duration} -t ${fadetime} -i ${vidfile} `# lead-in for crossfade` \
-loop 1 -i ${stillfile} `# masked still image` \
-filter_complex "
[0:v]setpts=PTS-STARTPTS[vid]; `# speed adjustment - not needed here, so noop`
color=white,scale=3840x2160,fade=in:st=0:d=${fadetime}[alpha]; `# crossfade alpha, double length ahead of speed change`
[1:v][alpha]alphamerge[am]; `# apply alpha to lead-in`
[am]setpts=PTS+(${duration}-${fadetime})/TB[layer2]; `# speed adjustment and offset for lead-in`
[vid][layer2]overlay[oo]; `# overlay for crossfade`
[oo][2:v]overlay=shortest=1[out1]; `# overlay still image`
[out1]crop=w=${cropfactor}*iw:h=${cropfactor}*ih:y=${yoffset}*ih,scale=${outputwidth}:-1, `# crop and scale`
eq=gamma=${gamma}:contrast=${contrast}:saturation=${saturation},unsharp `# final adjustments`
" -an output.mp4
```
by [Roger Barnes](https://bitbucket.org/snippets/rbarnesatl/6jRB)

### Perfect Loop

```python
import moviepy.editor as mp
from moviepy.video.tools.cuts import FramesMatches

clip = mp.VideoFileClip("input.avi").resize(0.3)
scenes = FramesMatches.from_clip(clip, 10, 3)

selected_scenes = scenes.select_scenes(2, 1, 4, 0.5)
selected_scenes.write_gifs(clip.resize(width=450), "./outputs_directory")

```
[article](http://zulko.github.io/blog/2015/02/01/extracting-perfectly-looping-gifs-from-videos-with-python-and-moviepy/)

### Youtube video to Gif

- Download it via youtube-dl and then convert it.

```
youtube-dl https://www.youtube.com/watch?v=V2XpsaLqXc8
```

[Youtube-dl](https://rg3.github.io/youtube-dl/)

- with [vid2gif](http://imgur.com/vidgif) online - [source](https://github.com/jimgur/gif)

### Speed

[see this stackoverflow's answer](http://superuser.com/a/569967)

### Grabbing each frame of an HTML5 Canvas

using [PhantomJS](http://phantomjs.org/)

Example with this [canvas](http://www.effectgames.com/demos/canvascycle/?sound=0).

```javascript
var webPage = require('webpage');
var fs = require('fs');
var page = webPage.create();

var NB_FRAME = 100;
var current = 0;

page.open('http://www.effectgames.com/demos/canvascycle/?sound=0',
function(status) {
if (status === "success") {
var current = 0;
var grabber = setInterval(function () {
var frame = page.evaluate(function() {
return document.getElementById('mycanvas').toDataURL("image/png").split(",")[1];
});
fs.write("./frame-" + current + ".png",atob(frame), 'wb');
if (++current === NB_FRAME) {
window.clearInterval(grabber);
phantom.exit(0);
}
}, 1000);
}
});
```
or use [ccapture.js](https://github.com/spite/ccapture.js).

## Miscellaneous

[Webkit request : add a function to WebKit to stop all in-progress GIF animations](https://bugs.webkit.org/show_bug.cgi?id=23945)

![license](https://i.creativecommons.org/l/by-nc/4.0/88x31.png)