Sketching sketch

I decided to start my final ICM project with the drawing interface, because it’s a discrete program in itself, and because I could actually sort of picture what it might look like. So I made a list of components—stroke palette, color picker, eraser, eyedropper, transparency picker, etc.—and decided to build them one at a time. At the same time, I joined forces on the Physcomp final with Diego, for his glove project that turned out to be a drawing tool, so I knew the interface might need to change, in order to work with that hardware.

It seemed like it had been weeks since I’d written sketch in Processing, so I started by rereading the chapters on objects and arrays from the book. Then I made the supersimple mouse-tracking line-drawer that we did at the beginning of the semester. And then I added a stroke-width selection palette to work with that. The first version is above. How it works:

The line turns on and off with a mouse click, so when the sketch opens, if you wave your mouse around, you get no line. Then you click once to turn the drawing tool—let’s call it a pencil—on, and you draw, draw, draw. You can click to turn off the pencil at any time, select a different stroke width, and click to start drawing again, from a new mouse position. The stroke that’s currently selected in the palette appears highlighted in green, with the line in black; all the inactive stroke sizes are gray.

What’s wrong with this interface:

  1. At program launch, it’s supposed to default to the thinnest line, in black. I forgot to set that up, so instead, if you turn on the pencil without selecting a stroke width first, you get the last line style that was drawn to make the palette, which is the 16-point version in gray. Oops.
  2. There’s no indicator showing whether the pencil is on or off. So a couple of times when I thought it was off, I moved my mouse and found that it was on.
  3. There’s no undo. If I could undo the previous stroke, problem 2 would be surmountable.
  4. There’s no eraser. This would also help with problem 2.
  5. The thicker lines are not smooth. I guess this is because I’ve got the stroke ends set to square, because it made the palette look neater; either round ends need to be turned back on for drawing, or I need to interpolate the pixels between the line segments.
  6. The focus highlighting on the fattest stroke in the palette isn’t wide enough.
  7. You shouldn’t be able to draw behind or over the palette.


  • Clicking to turn the pencil on and off is a bit confusing, perhaps. Maybe it should be click-and-drag, instead?
  • This stroke selector is probably too difficult to operate when you’re using a glove-mounted LED that’s being tracked by a camera, instead of drawing directly with a mouse. Maybe it should be a single slider, instead, for the PComp version. You basically need to be able to use this interface with mittens on.

So, obviously, I need to solve the various problems, of which #3 is probably the tricksiest. To make an undo command, I think I’ll probably save the drawing state every time the pencil is turned off. And “undo” should use the standard keyboard shortcut, of course, as well as having a button.

Once those issues are addressed, I think color is the next thing to deal with. The color picker may be so large as to have to be retractable, in which case saving the drawing state becomes even more essential.

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.