jifbox: A GIF photo booth for the Web


For many years, Sunlight has used a custom-built “photo booth” at events. People always seemed to like it, but it was a complicated set up: We’d set out an iMac that ran the UI in a browser, communicated with the web server via WebSockets, which called out to a native application that took a photo with the built-in webcam. Photo strips were assembled by the Web server and sent to the Sunlight Flickr account. What a mess!

jifbox logo

Since then, browser technologies have improved and no one cares for boring static images. We decided to replace our photo booth with something far better: jifbox, a browser-based GIF photo booth!

With the advent of media APIs, we can do all photo manipulation right in the browser. All of the photos can be taken with a bit of JavaScript. Even better, the browser lets you select the video input if you have external cameras attached. Once the photos are taken, we combine them all with a JavaScript GIF renderer. Except for the intial page load, all media capture and manipulation is done in-browser, no server required. Cool!

princess peach animated gif

Now that we have a rendered GIF, it needs to be sent somewhere. From the jifbox admin, you can use OAuth to connect a Dropbox or Tumblr account. The browser will send the GIF back to the server, which will push it out to your connected services. At Sunfright, our recent Halloween-themed open house, jifbox automatically posted all GIFs to a Sunfright GIFs Tumblr (I also sent them all to my personal Dropbox account for posterity and future blackmail).

We built jifbox to be as minimal as possible. All you need is a basic instance running on a server and a computer with a webcam and browser. Eventually we want to turn it into a hosted service so you don’t even need to run your own instance!

Give jifbox a try! Just click the button below to deploy your own instance to Heroku, for free.


The [jifbox code](https://github.com/sunlightlabs/jifbox) is open source on GitHub.