Instagram Unshredder


  1. This is an answer to the Instagram Unshredder challenge.
  2. It takes a shredded image in as input and (generally speaking) outputs an unshredded and reconstituted image.
  3. Implementation is in JavaScript using HTML 5 Canvas. It has no dependencies. You can save the html and image and "run" it wherever. It also runs nicely on the iPhone, but not IE :)
  4. The Unshredder algorithm is an array muncher. It works by selecting the left most shred, comparing the shred edge, on both sides, to each other shred, scanning for the area of minimal difference, and then matching it to the shred where the minimum is minimal. This is repeated until all shreds are placed. Naturally there exist formal ways to get similar (or better) results.
  5. There is an interesting emerging phenomenon. If the shredded image has a frame, the Unshredder, unaware of the "frame is on the sides" concept, will act as a "frame in the middle" filter. See: This. If the shredded image has no side frame, the Unshredder will produce something different. See: This. This is the original unshredded Instagram for reference.
  6. You can download the shredded image. Downloading unshredded image is not implemented here. But This works.
  7. Life is like a shred of hope.

ver 0.1, November, 14th, 2011