twice two . com

Smeary Paint applet

This browser does not have a Java Plug-in.
Get the latest Java Plug-in here.

(Drag with the left mouse button to paint, with the right mouse button to smear.)

This little processing applet lets you smear paint around. Old hands will recognize this as the "Drip" drawing mode from Painter. The left mouse button draws color and smears, while the right mouse button smears alone. The number keys select different colors of paint.

How It Works

The technique is fairly simple. The painting of color is done first; that's just a simple circular gradient used as an alpha channel with a color. The smear effect is simple in practice, but difficult to describe. Basically, you warp the underlying picture in the direction of mouse motion. If <dx, dy> is the direction of mouse motion, then for every pixel under the brush we do dest[x,y] = source[x - a*dx, y - a*dy] where a is the alpha value of the brush at (x,y). This makes the smear effect weaker at the edges of the brush.

This code has not been optimized, and thus runs pretty slowly. If you move the mouse too quickly, you'll end up with a series of odd-looking "bubbles", rather than a continuous smeary stroke. A large part of the un-speediness is due to the bilinear sampling done by the warping routine. This is needed to make the result nice and smooth, but has the disadvantage of not allowing any of the normal optimizations for traditional bilinear filtering.

Download Processing Source