

Show HN: gifyourself.in - A site for putting your face on GIFs - fjania
http://gifyourself.in

======
fjania
Some technical points of interest, perhaps.

The gif explosion / creation is done server-side using python Wand, Pillow and
the excellent images2gif script. Exploding the gif into frames was a giant
pain in the ass until I checked out StackOverflow, and the source for Wand,
and found the coalesce function a bit hidden. (There are _many_ ways to
recreate a gif from it’s exploded frames - coalesce handles all the
permutations as far as I can tell.)

For the creation tool specifically I tried out several of the Javascript only
gif creation libraries and wasn’t crazy about the colors they produced, and
was concerned about browser support, which in the end ended up being gated by
lack of support for either the Blob object, or webcam/getUserMedia on all but
Chrome and Firefox.

I haven’t given up on using the JS libraries entirely, but I wanted to get
this out there first and see what people thought. The requests to create a gif
a put on a celery queue and handled by worker nodes to keep the web app from
hanging on creation requests.

The live preview in the creation tool fakes a gif by drawing each frame to a
canvas, compositing the cropped/erased image to it, and just using a JS timer
set to the gif’s frame delay to flip-book through them.

All the gifs have been masked over with details of where, on each frame, the
face should be placed, how big it should be, and how much it should be
rotated.

That’s a part of the site that you don’t see which makes that not-so-magic
happen - the masking tool. This is a tool that uses the same cropping
interface as the creation tool to generate the set of coords/size/rotation for
the face on each frame. There’s some usability stuff there to help make
masking a (relatively) quick process too. The masking tool uses the same live
preview technique to see how the mask is coming along. Right now only myself
and some of the other people I work with have access to the masker, but we’re
considering how to give more people access. After masking a couple hundred
gifs, we’ve realized there is a craft to it, and that takes a little learning.
In the meantime we’re taking suggestions for new gifs to mask on twitter
@gifyourselfin.

We’ll also support multiple masks soon, so you could have a mask for anyone in
the scene if there is more than one person to put your face over.

------
abhayv
ImageMagick has some good tools for manipulating GIFs. We have an iPhone app
called Blippy which uses ImageMagick on the server side

~~~
fjania
Wand ([http://docs.wand-py.org/en/0.3.5/](http://docs.wand-py.org/en/0.3.5/))
is a set of python bindings for ImageMagick that was super easy to get set up.

In my experience with this project, it exploded the GIFs lightning fast, but
when it came to creating GIFs, it was about 3x slower than the images2gif.py
script that I ended up using. (Although those numbers were on a Mac
development machine and this runs on Ubuntu in EC2 - I have a to-do to try out
Wand/ImageMagick there and see if the performance issue carries over)

------
baratunde
w00t

