Sunday, July 27, 2014

Introducing window.js

Back at Sourcemap, we had a consistently inconsistent problem:  The shape of our tree diagrams could change dramatically depending on the type (and amount) of data being displayed.  This sometimes lead to the embarrassing problem of clients being unable to even find their data on the screen, much less make sense of it.

The solution was to increase the flexibility of our dashboard.  I'm a huge fan of tiling window managers, so I rushed out to make one in JavaScript.

The result was window.js, a tiling manager for web sites.  We hooked it up to our existing visualizations, did a bit of server-side magic to allow saving and loading, and voila-- 100% configurable, resizable, and sharable dashboards.

Check out the live demo here!

Sunday, July 20, 2014

HOPEX Retrospective

I'm tired enough that a list of bullet points seems good enough:

  • I don't like conferences very much.  I don't like amusement parks, Netflix, or night clubs.  I don't like packaged fun.  My fun must be difficult to contain.  I liked Hope.
  • Hope and The Hotel Pennsylvania have a weird, magical chemistry.  The hacker ethic (especially of the networking and A/V team) was the perfect foil for the laissez-faire management.
  • I was surprised how little coding happened.  There was plenty of show-and-tell, but not a lot of new stuff being worked on.
  • Remember to bring your inflatable couch from home.  There are no guarantees that you'll be able to find one near Penn Station.

Sunday, July 13, 2014

Introducing Sieve


In February, I set out to solve a problem with client-side data visualization:  How can I get data from the web into a format that my graph can use?

The usual answer is to scrape all of the relevant fields, parse them somehow, and store them in a database, then set up some interface for the graph to consume.  For a lot of projects, this makes a lot of sense-- But it introduces a lot of moving parts.  I started to wonder if a database was even necessary for small, one-off graphs.

I spent a few days mashing up Node, Request, and JSONSelect into a kind of proxy-plus-filter.  This meant I didn't have to worry about cross origin issues, and I could strip out unnecessary fields.  Sieve was born, and it was actually useful!

Over the next two months, I added the ability to combine multiple requests into one, stream results back via Websocket, cache, parse, and generally expand the list of probable use cases.  

Several months later, I've used Sieve for all sorts of things.  Not just data visualization, but all kinds of client-side applications.  Sieve has become phenomenally useful for me, and I suspect it might be useful for all kinds of web programmers.  Try it!  I'd love to know what you think.

Sunday, July 06, 2014

Introducing Elemental

Elemental is a tool to quickly audit all the visual elements on a page.

This project came into fruition because I needed to refactor a large amount of CSS on a series of, well, complicated pages.

It works by loading the page in PhantomJS, rendering every element on a page to a PNG base64 string, streaming the results back via websocket, and sorting by visual similarity.

Be gentle!  It's still an early beta.

Code here.