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

by fjania • 13 years ago

9 4 13 years ago

fjania2• 13 years ago

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.

baratunde• 13 years ago

w00t

abhayv• 13 years ago

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

fjania2• 13 years ago

Wand (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)

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

Related Stories