Monday, December 20, 2010

Sketch-a-bit Fine Art

On December 13th, Sketch-a-bit hit 20,000 sketches!

Sketch-a-bit is a collaborative/evolutionary sketching app for Android that Adam and I made and launched back in March. Sketch-a-bit consists of an ever-growing pool of 'sketches' (now >20,000). A user downloads a random sketch, modifies/erases/enhances that sketch with a light or dark chalky pen tool, and then uploads the new sketch to the pool. Essentially, instead of starting from a blank white canvas, you get to start from someone else's doodle (or masterpiece). Since all images forever are saved and from the website, we can track how sketches evolve. Check out this tree, and its parents and children sketches.

Here's a picture of the 20,000th sketch evolving from The White Square... sketch #0.

So, lots of sketches! All black and white. Some really awesome. Some penises and other assorted human anatomy. A lot of stuff that's just sort of abstract or sketchy or doodley. The question is, can we make a poster that shows off a lot of the sketches at once? What would make the poster look as cool as possible?

Idea: Use sketches as pixels in a huge rendition of another sketch! 

spiral sketch made of more sketches

So we did! See a kind of reflective shot of the poster hanging up in my apartment. 


Step 1: Sort images by brightness. (Sum most/all pixels in either the original-sized images or thumbnails.) This yielded a gradient.

Step 2: For each pixel in the Chosen Sketch (i.e the above spiral, sketch #12), randomly pick a sketch in the right intensity range. This can lead to duplicates, either because the same random sketch is picked for the same intensity, or because someone uploaded a sketch without changing it and the sketch itself is a duplicate.

Step 3: Make a bigass mosaic. We used 128-pixel-tall JPEG thumbnails because the original 320x480 PNG images were a bit too hefty. Keep in mind that the Chosen Sketch has the same aspect ratio as the rectangular pixels, so to get things to work out, we actually just need a square NxN grid of little sketches. The other thing is that we wanted to print at 300dpi (dots or pixels per inch). This means that the little 128-pixel sketches get to be, at most, a little less than half an inch tall when printed. We used the Python Imaging Library (which used to go by PIL even though you import Image in python) to stitch all the images together and ended up with a rather large single JPG file just about ready for printing.

Step 4: Weed out the nasties... because these sketches contain all sorts of 'fun' things and I don't really want people's crappy sketches of genitalia hanging on my wall forever. Adam did this. He didn't catch everything, but he got nearly all of it. Also, there were only ~400 nasties out of 20,000 images. Just 2%! If you just want to enjoy the obscenities, here you go.

Step 5: Make it real. I opened the final JPEGs in Photoshop, made them the right size and right dpi, and then printed them. Originally, we planned to make a 40x60 print, and we asked a framing shop how much it would cost to frame. *cough* The answer: bizillions of dollars! I mean, >$400. They had a snazzy wooden laminate option, which wasn't any cheaper, but was really pretty. In the end, we bought a big 20x30 frame from Goodwill for $15. I just wanted to say that picture frame hardware is pretty interesting! Sproingy braces and other metal corner braces and hanging wires...

Here's one of the smaller (printed on a normal laser printer) final products:
Framed "whorls"

Finally, have at some of the files yourself!
-- 100x100 sketch tree (dirty): 51MB
-- 74x74 sketch spiral (clean): 35MB
-- 32x32 sketch whorls (clean): 2MB
-- flower, eye, and pen (1-3MB each)