Natural Selection.

Longer study in progress. Best on desktop in webkit browsers. Click here to interact. 

Clicking a dot removes that dot and causes random remaining dot to reproduce. Reproducing dots spawn another dot with similar speed, size and color. If a player clicks all the big and slow dots then the dots will naturally evolve to be smaller, faster, and lighter—and harder to click.

The original (made in Flash way back when) was really quick to rough out, but little details have had a significant impact on how the work ‘reads’. It’s also reminded me of some larger questions, a couple of which I’ll note below.

Continue reading “Natural Selection.”

Don’t Get Any Big Ideas

60 min sketch. Click image to launch. Responds to click. Best in webkit browsers


Three thoughts:


I once had a nightmare of falling towards Jupiter, never arriving even as it grew larger than I could comprehend. It was terrifying and sublime and I don’t know how I’d ever capture the feeling. I wonder if this sketch touches it a little. It’s possible that the larger dark disk is mostly unapparent until a click, when the light circles draw attention to the edge and what was once the background becomes a figure of sorts. I wonder if that’s key to some sense of sublime—the ‘background’ (perceptually speaking) emerging as a singular entity. 

Continue reading “Don’t Get Any Big Ideas”

A Bad Procedural Argument (For Reducing Online Hate-Speech).

~60 min sketch. Best in webkit browsers. Click here to interact. 

This sketch allows a user to ‘reduce’ hate speech online by ‘limiting bandwidth’ with the obvious catch that the occurrences can’t be reduced in proportion to other kinds of speech, only speech overall can be limited. It presents the premise that hate speech is always in proportion to other kinds of speech and from this a kind of naïve argument that  limiting one kind of speech is just to limit all kinds of speech. (This description is admittedly very imperfect though  as there is nothing to indicate, procedurally or otherwise, that the purpose of the manipulable features is to affect the occurrences of “HATE”.)

Continue reading “A Bad Procedural Argument (For Reducing Online Hate-Speech).”

UX prototyping tool circa 2050

90 min sketch. Click image to launch. Responds to click and drag. Best on desktop in webkit browsers.


This is a cheeky response to one too many recent developments in prototyping tools that show off—with high energy music urging breathless anticipation—the ability to create and organize rectangles.

Underlying Framer X is React, a Javascript framework that allows (and proselytizes) collecting logic and presentation into a self contained component—a one-click feature found in Flash over 10 years ago and an idea that has existed for much longer but still incompletely implemented in contemporary web standards.

As a web-framework the presentation of a React component is still accomplished via HTML and CSS; a set of mechanisms built to present text documents in different shaped windows. As such, any React-based WYSIWYGish editor, despite building on contemporary hotness, will have similar tool-design challenge as Dreamweaver did in the 90s— allowing designers with an objects-in-space mental model to create procedural layouts. (The complexity of the problem has only grown as web standards have included layout systems (flex-box, grid). )

So long as we need to accommodate variations in screen sizes and our underlying procedural layout technologies churn,  we’re going to have new tools competing to address the same problem—organizing rectangles.

Black Hole

~60 minutes. Click image to launch. Responds to dragging and tossing. Best in webkit browsers (Chrome/Safari).

An experiment converting continuous location change into  discreet place change.

Cursor Container

60 min sketch. Click image to launch. Responds to dragging and clicking. Best on desktop in webkit browsers (Chrome/Safari).

This sketch doesn’t really fit my “be about something” criteria for this blog. It’s more a continuation of my MFA thesis experiments.

Brief thoughts on a sketch made in response to music.

The sketch above can be accessed here. ~100 minutes. Responds to the cursor. Best on desktop in webkit browsers (Safari/Chrome). 

An original rule for sketches on this blog was that they had to be ‘about something’. I’m not sure if the sketches in this post fit what I meant by this.

The sketch above is a quick response to Hiatus Kaiyote’s “Underwater”. It’s not really ‘about’ the song so much as it is an expression of sorts. I’m loathe to say it’s a “visualization” — something meant to be evocative of the experience of listening to whatever. If the music, or a part of the music, was a kind of inspiration, does that make the work ‘representative’?

Continue reading “Brief thoughts on a sketch made in response to music.”


Click image to launch. ~60 some minute sketch. Responds to clicks. Best in webkit browsers (Chrome/Safari).

The visual smearing is the result of GIF compression—sorry the actual sketch doesn’t look as cool.


Click image to launch. ~60 minute sketch. Responds to cursor movement. Best on desktop in webkit browsers (Chrome/Safari).

The Procrastination sketch was originally the first thing I made for this blog series. It’s  not great, though the idea is simple: The relationship between work obligation and attention is represented through the spatial relationship between a box and the cursor. The statement is, in essence, ‘avoiding work makes it larger and more demanding of attention’ (plus some nuance). Some of the details of the spatial relationship are more or less invisible though (if not the entire relationship). It’s also a 2D sketch for a 1D relationship. The reasons why these issues are issues though is interesting.

Continue reading “Procrastination”