We have a list of items, with one of the attributes being a time duration. (Imagine users, and avg time between certain activities).

Most of the time, this duration will be in the 0->120 second range. Some times, it will jump into minutes, possibly hours, ... and rarely (but it's possible) the duration could be in the days.

Where we're at now is a display like "2h 43s", "2d 15h", "21s", "8d 2h".. But, if you put all those into a list, a problem arises because it's not immediately clear that you have a long duration sitting in the midst of a bunch of shorter ones, since "2d 15h" is the same length as "2h 43s"

Adding seconds/minutes to the "2d 15h 00m 11s" seems right to ensure the days "stick out" and keeps all the elements aligned.. But I'm not sure. That's a lot of added noise.

  • 1
    so fill up the missing bits at the right with blancs or any other means to make the days, hours and minutes line up: for example "2d ... ..." and ".. .5h 40m" (uses dots here because browsers will squish multiple whitespace) Oh and use a monospaced font or always add the "d", "h" and "m" (even for blank values) or your alignment will still look scruffy. Commented Sep 9, 2013 at 16:15

2 Answers 2


You can use some cues for hours and days. As those are more rare, the icons don't create much visual noise.
enter image description here

  • Thanks - this makes sense. BTW, first time over on the UX side of SO, so I'm not sure what setting your opinion (which is awesome) as the "answer" actually means. Commented Sep 9, 2013 at 21:33
  • @JamesBoutcher It's no different here. From what I've seen UX doesn't encourage opinionated answers any more than SO. Commented Sep 11, 2013 at 1:57
  • @JamesBoutcher very interesting view. Simple, clear I will remember Commented Sep 11, 2013 at 4:14
  • Do you think there's a benefit to vertically align days, hours, minutes and seconds? So that, by just looking at complete/blank columns, the user knows what magnitude of time he's looking at. (Or, on the other way, does that add visual noise?)
    – Alpha
    Commented Sep 14, 2013 at 7:44
  • @Alpha alignment are good only for seconds, as it is most frequent range. Otherwise there will be too much blank spaces, reserved for minutes, hours and days. To avoid it those rare ranges have own distinguishable icons. So the icons are magnitude indicators, not the spaces. Commented Sep 14, 2013 at 7:54

I would use a simple hh:mm:ss format (appropriately localized), omitting most-significant components when they are zero.


The resulting variation in size will give a good visual indicator of the magnitude and right-aligning will ensure they are easily comparable.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.