"Your program is stupid. It doesn't work," my wife told me

The HSV colour wheel, based on barycentric coordinates, is my favourite colour selection device. It discourages picking unnatural looking saturated colours. Instead, it gives the realistic designer colours more space in the triangle. That's why I chose it for Zwibbler.com, my online Javascript sketching application.

I was working on the drawing tool one evening and my dear wife happened to start using it to draw stuff. I watched her and asked her to change the colour of what she had drawn to blue.

Naturally, she clicked on the blue outer portion of the colour wheel.

"This is stupid. It doesn't work," she complained. I love that I can always count on her for honest feedback!

The colour wheel works, of course. It works exactly the same way as Inkscape and other graphics design software. Clicking on the ring sets the hue. But when the saturation is zero, the hue component doesn't matter, because the absence of colour is always gray.

On Zwibbler, this always happens, because the default colours are black and white.

With one line of code, I made the colour wheel behave the way she expected, and eliminated a negative experience for first time users.

(Update in response to criticism.) The fix I made matches expectations of new users, as well as experienced designers. If the current colour has saturation level 0 (i.e. it's white/black/gray), and you click on the outer ring, then obviously your intention is to eventually increase the saturation. Otherwise what you are doing has no effect. The program sets the saturation component to 1.0 only in that specific case. Otherwise, it leaves your current position in the triangle alone, allowing you to rotate the hue value.

You might also want to read:

• Zwibbler: A simple drawing program using Javascript and Canvas
• Exploiting perceptual colour difference