Just like the date picker but for a time field
Not to hijack this, which is a good idea all by itself, but for bonus points it'd be nice to be able to specify a comparison field so that for example, when the "start time" is 5 PM, your selection could start at 5 PM, and show duration from the start time to the end time you're entering. I've managed to do this with virtual list and so forth, but it's clunky and not always worth the hassle. If it were a standard feature I'd use it more often and I think our solutions would be more robust for it.
particularly because a value list does not work on a time field!
disabled_mrw-old-account-do-not-use: Not sure what you mean. I use value lists on time fields in FMPro. Do you mean it's just not effective for the interface? (I'd agree with that.)
Decent UI I lifted from an iOS app
I would suggest an interface such as Android has:
Once the hour has been selected, the UI automatically changes to minutes. It's a very elegant UI me thinks. I've created a popup for FM that does the same thing.
Just my humble opinion, but I think this interface is confusing and restrictive, and also a screen real-estate hog.
I, for one, would settle for hour, minute and am/pm boxes with up and down arrows, sort of like you see on the FMS admin console.
Alternately, the ability to have a drop-down list where you specify start time (optionally, otherwise use the existing entry as start time), and increment (5 minutes, 15 minutes).
To enter time using dropdown menus or (worse) up down arrows requires many more clicks than a well designed UI.
To use your example, to enter a time with a hour, minute and am/pm drop down, requires 3 clicks just to access those dropdowns. That's without selecting any data. Selecting an hour and minute requires another two clicks. Then there's a 50% chance you have to change am/pm which needs another 2 clicks. And that's best case. What if the dropdown scrolls off the screen? Then you have to click and drag.
Both iOS and Android also have the scrolling UI elements, where you swipe up and down to select hour/minute. Hate that. And then there's the older up/down arrow UI's where you end up clicking/tapping up and down until you get to the hour/minute you need. Brrr.
In both rivet's and my UI (which btw are no screen realestate wasters as they are only displayed when needed) one click is needed to open the picker, and then 2 further clicks in rivet's UI to select the time, and three in my UI. You could opt to automatically close the picker after the last selection, or use a button to close it, which requires another click. Minimal clicks is key to good UI design. Bonus if it works well for both keyboard/mouse and touchscreens.
I think rivet's UI suggestion is confusing though it uses minimal clicks. My UI suggestion, afaik designed by Google, is what people are used to seeing. Clock faces have been around for centuries, people are familiar with it and know pretty well how to use it. Google's design is by far the best I've come across so far.
It can be adapted to 24hr display and could even incorporate something similar to rivet's UI suggestion, though that would probably get cluttered.
From Google Calendar:
What also helps this interface is that if you type, say, 1230, it works. Likewise, it'll take things like "5p". FM is really good at accepting dates, but not so much on the times.
Where I'd be okay with three fields with up/down arrows, it isn't that I'd expect to click through each and every option. Often, the minutes I want are somewhere near where I started (because most time pickers start at now, or at a "start time" from another field), so perhaps just a click away. Most importantly, though, you can tab through hours, minutes and AM/PM and type the individual parts,without syntax. Not ideal, but I did say I "would settle".
In the interface you've shown (which is much easier to understand than the one rivet presented, I'll admit) if I could just have the top row where "10" is highlighted (presumably you can tab to the minutes and am/pm?) then I can enter a number without further interface help, tyvm.
The challenge, to me, is that users have trouble getting the colons and spaces correct when they are free-typing. A timestamp compounds the problem. Heck, half the time I can't type in a timestamp without getting some punctuation or spacing wrong.
The challenge is not that the user doesn't know how to enter a number, or doesn't know what number of minutes to pick, so spreading the numbers out in creative ways, or making them look like an analog clock, doesn't seem especially helpful, unless the user is used to describing time as "the little hand is on the..."
A calendar drop-down isn't useful because it looks like a calendar hanging on my wall (which would be a relic in the first place). It's useful to spread out dates in that particular way because I can see what day is two Tuesdays from now, or the fourth Wednesday in April, or next Monday. I don't need to "figure out" what's two hours from now, and if I did, a clock picture wouldn't be all that helpful. I might need to figure out when a meeting's going to end if it's three and a half hours long, which is where that duration in parentheses is helpful.
"Good UI design" is, I believe, more than just "less clicks". Otherwise, a field with free text wins hands down. It's also about allowing users to enter something easily.
In the user's head, 3:15 PM is already "3:15 PM", so I wouldn't make a user interpret that into "second row second box, last row fourth box, moon" or even "big hand on the 3, little hand on the 3, circle in the lower-right-hand corner". Just help them enter "3:15 PM". They already have a good idea what that looks like. They just need help entering it without flubbing the colon, space, etc.
YouTube : FileMaker Timestamp Picker
GitHub : Genecom/FileMakerSampleSolutions > TimestampPicker
The challenge we have nowadays though, is that we're not only developing interfaces for keyboard/mouse users, but also touch users. And at some point in the future some will be using some form of virtual reality. For data entry tabbing through input boxes is hard to beat. Try doing that on a tablet, phone or touch desktop though. A good visual UI element that makes data entry easier goes a long way. Just having the picker available means you can choose to use it or not. Like the calendar picker, you don't have to use it. It's not always appropriate.
Interesting how you've implemented the picker. Using the webviewer though, has problems as the webviewer is a memory hog. Clicking on the different popovers will slowly increase the memory used by FM. Without doing anything in the popovers. Clicking on a date in the date picker spawns another FM process which crashes complaining it can't find the Timepicker DB. This might be due to language difference (My FMAv13 and workstation is in English) or OS differences (I use Win7).
This thread encouraged me to explore another approach, please give it a whirl - http://goo.gl/X4HNpc
How about 2 or 3 slider controls? (hours, minutes, seconds) Easy enough to use those on either touch or click/drag. Perhaps not as easy as direct typing data, but avoids problems with punctuation or typos. (Only to be replaced by problems with granularity of the slider, I suppose.)
Retrieving data ...