Best way to display numerous dates on a data form?

Question

I've got the task of finding a way to display numerous (10) dates on a data entry form. They pertain to the dates that certain paperwork was received, acknowledged, evaluated, etc.

All the dates are pretty much as important as each other, so I can't really display the most important dates, and put the others in an expander panel, or similar.

Currently I just have 10 calendar pickers on the form, but this looks a bit cluttered.

Using WPF, so the sky is the limit with the type of control I could make, just lacking some inspiration.

Answer 1

Could you display them as markers on a timeline?

I see in my mind's eye all the not done yet markers sitting beyond the right edge of the line, waiting to be done.

Answer 2

Is there any way of classifying the dates? You could also analyse the workflow and see if there are sections that could be presented on different panels.

For example:

Received is something being done to you.

Acknowledged, evaluated are things you do that don't cause the paperwork to change hands.

Forwarded, delegated (if they exists) is something you do so someone else.

So each of these sets of dates could be presented on a different panel.

Another alternative is just to display the latest date/action pair so that you can see the paperwork's current state and when it achieved that state. The other dates would be available on a "more details" panel/flyout.

Answer 3

I'd say group the dates with other field controls (textboxes, textareas) along in the context of the groups (sent it out, recieved it). If you have some paper work of how the paper forms flow, you could follow that initially, then fix it up.

Answer 4

Sorry, just for clarification, are dates being entered in this form or are they pre-populated and just informational?

If they're being entered I would use a control like the JQuery date picker

If they're purely informational then I'd be inclined just to have a list with the name of the even on the left (possibly with an icon) and the date on the right.

Answer 5

I tend to try to look for different forms of visualisation when needing to put that many controls in one space. As whybird suggested, a timeline is probably a good idea. Here are some ideas of how to do that:

• Create a graph where the X axis is time and Y is the completion status, which would allow you to display the graph in a table and use different table rows. Users can put a pin on a point on the X axis and depending on which row they place it, the pin is associated with a certain status such as received, acknowledged, etc.
• Use a basic one dimensional timeline (eg. users can only position a point along one axis) and allow users to drop pins. When they drop the pin, pop up a control that allows them to define what kind of pin it is, and then color the pin accordingly. This is probably better than the first suggestion if you have high information density since it'll take up less space, but require more interaction when reading.
• For a keyboard friendly alternative, create a twitch/fire-forget form with 1 date input that takes any plain English date ("next Tuesday at 5pm") and has a dropdown or radio select for the different states. That way I could type something, hit tab, use left/right/up/down to select a state, and hit enter to enter data. Refocus the cursor in the date input afterwards so I can rapidly fire dates into the system. Inserted dates should probably appear on a timeline somewhere, though, it's just the best way to display the things!

Hope that helps.

Answer 6