Analog Time Chooser

Image of time chooser dialog The applet below demonstrates a new style of user interface widget for selecting a time.

Click the clock icon below to launch the time chooser dialog.
Usage: When the dialog opens, move the mouse over the hour ring and observe a color bar following the mouse pointer. Click the desired hour and the hour ring turns grey. Do the same thing to select a minute, then click AM or PM. The dialog closes and the selected time appears in the text field.
(The choices can be made in any order. The dialog closes automatically when all three values are selected.)
Click the icon again and the dialog reappears allowing the user to modify the selected time.
The text field can be manually edited and the time will be reflected in the chooser the next time it is opened.

Alternate usage:  Mouse over the AM or PM circle, move the mouse to the minute ring and hover over the desired minute.  Move the mouse to the hour ring and hover over the desired hour.  Move the mouse out of the circle and click anywhere to close the window.

Advanced tips: If you want to alter your choice after a selection has been made, click anywhere in a grey ring to make it active again. Use the Delete key to clear the selections.

Availability:  This widget is a custom Java Swing component (dialog) and will be available for free (binary) when it becomes stable.  Send me a note if you'd like to be informed when it's available.  

Background:  Many applications require the user to select a time.  Most of them require entering a time in digital form by either selecting from a drop down box or using spinners.  (For example, Adobe's Flex Time Chooser). These are awkward, inelegant, and imprecise.  The analog style time chooser is simpler, more aesthetic, and I believe more intuitive.  Let me know what you think. I'd be happy to hear your suggestions for improvement.     Send Anonymous Feedback.

Your opinion please: Should the dialog window be resizable to a larger viewing area to make it easier to make precise minute selections? Is there a better color than gray to indicate a selection has been made? Should the dialog be configurable to allow only 5-minute interval selections? A tool tip appears if the mouse is left stationary, until the first click. Is the tooltip annoying? Send Anonymous Feedback.


This page was tested with Firefox and the Java(TM) Plug-in 1.6.0_24.