What is it about time pickers?

November 20, 2009

I’ve come across a couple of ‘interesting’ time pickers recently. I don’t know the best solution for one of these widgets, but I’m pretty sure none of the ones below are it.

Of course, one of the dilemmas with a time picker is catering for users familiar with either analog and digital time displays (or both), as well as AM/PM, 12 or 24-hour clocks, and perhaps time zones and daylight saving/summer time. And do you allow text entry, with the potential for typos and other human error? If you allow text entry, then what sort of validation do you have to have on the text entry fields?

Here are some of the interesting ones I’ve seen:

time_picker01The one above allows text entry as well as picking a time from an analog-type display. Personally, I find it very confusing, and the color shading just adds to the confusion. Instead of the hands that you would have on a normal analog display, there are just numbers, including all the minute numbers, with an AM and PM selection option in the middle.

time_picker02This next one (from http://www.kpao.org/blog/2009/10/steal-this-idea-time-picker-wi.html) is similar to the first, but I think the interface is a little clearer. It has the same information on it as the first, but the numbering for the hours and minutes, as well as the AM/PM selection options appear to be less confusing than the first example.

Finally, there’s this one (from http://haineault.com/media/examples/jquery-utils/demo/ui-timepickr.html):

time_picker03This one requires you to click in the text box or on the clock icon. Doing so displays the hours (1 to 12), then as you hover over each numbered box for an hour, you get the quarter hour minutes, and as you hover over one of those you get the AM/PM choices. It’s a solution that  requires good mouse hovering skills and, as far as I could tell, you can’t access the times without using the mouse. You can’t type in the time — when I tried it on that web page, it wanted to display the little boxes.

Finally, two free downloadable screensaver ‘word’ clocks with a difference, from http://www.simonheys.com/:

Word Clock screensaver

[Links last checked November 2009; thanks to AB for alerting me to these]

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

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

%d bloggers like this: