Under the hood

These images were all made with a web-based drawing tool I created called fingerprint. In the last blog post I mentioned how disappointing it was not to be able to export vector-based representations of drawings made in Apple's Freeform application. fingerprint is my way of addressing that disappointiment. It is built on top of Dimitry Baranovskiy's raphael.js and a modified version of Ian Li's raphael-sketchpad and is the continuation of an earlier drawing tool I made, almost 10 years ago, called panels.

It is a single-page HTML5 web application for drawing closed paths (technically strokes that automatically close themselves) filled with a single colour (and opacity). The application has the ability to "undo" and "redo" individual paths as well the ability to remove individual paths by clicking on them (but I almost never use the feature). That's all it does, by design.

fingerprint remains a work in progress. It can run offline which is good but it is unable to zoom in and out of an image which is challenging on small devices, particularly when fullscreen web applications are unable to remove all the web browser's chrome (and the valuable screen real estate they occupy) in iOS. Its native file format is little more than a collection of SVG path elements which make rasterizing those images very easy. It is still a collection of line strings, rather than curves, which means there are frequently "steps" in the drawings.

I have done some initial investigations using Chaikin's line-smoothing algorithm and determined that it is both too slow to perform real-time, in a browser context, and even when applied after the fact doesn't meaninfully change the quality of the line work. So, it's back to the drawing board to think about alternative approaches but I am pleased to have a tool whose constraints I understand and which can be improved upon.