Socl Distortion

socl

An animated GIF search engine is born

 

post1Microsoft has released a public beta of their social posting site Socl. It's similar to Pinterest except the search is powered by Bing. Socl is basically a search engine where users can save results and other users can comment on them. I created 200 posts on my first day in order to fully understand what Socl had to offer, or exploit.  ***

Now, on to the gravy – Socl is built on TypeScript and uses Microsoft's CDN. CDNs are servers that send files to your browser very quickly where they get cached for reuse. But why does any of that matter? Because it's the only search engine that can display animated gif results – that I'm aware of. It's probably the most efficient image search for gifs. It does this by feeding the original gif into the CDN where it gets resized and spat back out. More importantly is how we can exploit this and have our own instant online gif resizer or skewer.

 

How to instantly resize or skew GIFs online 


Let's start with this gif image of mine located at http://www.anthonyantonellis.com/images/anigifs.gif

anigifs

When it gets funneled through the CDN at Socl and a quick look at the URL string shows something like this:

http://cdn.so.cl/handlers/thumbnail?h=100&w=100&url=http://www.anthonyantonellis.com/images/anigifs.gif

The string has three parts, the image url= and two modifiers, one for width and one for height, w= and h=. Width and height are a toggle that determines output pixel dimensions, and since both width and height can be assigned independently it's easy to do image skewing. One or the other can also be omitted, thereby maintaining the original aspect ratio.

Set to 100 x 400 in the URL it appears as

http://cdn.so.cl/handlers/thumbnail?h=100&w=400&url=http://www.anthonyantonellis.com/images/anigifs.gif

This isn't an image skewed in html, it's actually a whole new gif file with the dimensions 100 x 400 that can be downloaded and saved. I have tested up to 20,000 x 20,000 pixels and have not yet hit a maximum pixel limit; the larger the size, the longer it takes to generate. The minimum size can go all the way down to 1 x 1 pixel. ↘

http://cdn.so.cl/handlers/thumbnail?h=1&w=1&url=http://www.anthonyantonellis.com/images/anigifs.gif

Tumblr has something similar that they just launched this month. When a post is liked or reblogged it creates a small 75 x 75 pixel square version that appears on the dashboard html scaled to 26 x 26 pixels. Likewise, images on Google+ that are larger than the display window dimensions 497 x 373 pixels are compressed to a smaller file for the stream. 

tumblrpost

The original tumblr post: http://tumblr.anthonyantonellis.com/post/38196253941

Tumblr dashboard generated gif:

 tumblr mf7gn2i64t1qiiuvxo1 75sq 

Unlike Socl, I haven't found a way to exploit the compression on tumblr and Google+. However, there are some interesting uses for their glitches. Lastly, for some nice cross-pollination you can use the Socl CDN to resize your Google+ gifs so they upload to tumblr.

 

 

Quick reference Socl CDN link for copy/pasting:

http://cdn.so.cl/handlers/thumbnail?h=100&w=100&url=

 

 

Update:

Why so many tumblr image uploads fail


Tumblr could really benefit from an image compression method similar to Socl – especially on tumblr post archives. The 'reduced' 250 x 250 pixel gif generated for the archive page is actually 4 times larger than the original 400 x 400 pixel gif (204KB versus a whopping 904KB!). Tim Baker sent me a mail which pointed out this size change is due to anti-aliasing which triggered a palette expansion from the original 16 colors all the way to the maximum 256 colors. I thought this might explain why certain gifs fail to upload even when the original is well below the 1000kb size limit. I confirmed this suspicion by uploading a 999KB/256 color gif sucessfully, while a smaller 980KB/16 color gif was rejected. 

Original gif with 16 color palette, 204KB:

    original 16

 

Tumblr archive generated gif with 256 color palette, 904kb:

     256 fail

 

*** On December 4, 2012, I created an account on Socl up and titled my first post "YASN – Yet Another Social Network." A few minutes later Lili Cheng, general manager of FUSE Labs which developed the site, commented that Microsoft's Danah Boyd coined the expression YASN way before Facebook existed (which is half true, Boyd was quoting Clay Shirky).