After setting up the Mozilla Foundation example app, a repository that has most of the build tools and automation in place to generate client-side apps based on React, using Nodejs, Gulp, Browserify, a JSX wrapper for JSLint, and a JSX wrapper for JSCS, I figured the best way to verify whether or not what we came up with was actually decent, was to use it for something completely unrelated.

It's definitely one of the more reliable ways to discover shortcomings or oddities with automation solutions like these (some issues were found, indeed), while at the same time giving things that can use a leg-up in the codebase department a productivity boost.

As such, I figured I'd Reactify some bits of Inkcyclopedia using the mofo-example-app as basis, and the result has allowed me to play with a few things. For instance, if you hit up http://mighty-lake-2303.herokuapp.com you can see the fountain pen inks arranged by colour, which is fairly standard, with ways to sort on other colour aspects (some useful, like ordering on hue, others kind of silly, like ordering on luma value), but the coolest bit is if you click on a colour... because then magic happens:

By using chroma-js and plotting colors at some distance-and-angle away from a reference color, where the distance is the Lab colour distances (the most accurate colour model we have right now for representing colours close together that the human eye experiences as close together) and the angle is simple colour hue, you can pick any colour, and then I can show you what the closest "sort of similar colours" are from a large set of known fountain pen inks. A simple shortest-distance heuristic search is enough to find visually similar colours, which means I can add in things like "if you show this code an image, it can do some rgb quantization and find you inks that should be similar to the colours in the image". That's pretty huge because it means zero-effort applications for things that would traditionally take forever, like "take a picture with your phone, and get a list of ink names back".

For many some colours, the results are incredibly obvious. For others... not so much so, especially neutrals and darks!

Give it a whirl: head on over to http://mighty-lake-2303.herokuapp.com and start clicking on things O_O

http://pomax.github.io/#gh-weblog-1423203721895