I'm building a configuration page for a web application and some of the parameters are durations. Most of these durations are in days but there are some that might be specified in weeks, hours, or minutes so granularity need to be taken into account.

Here is an example of some of the settings. They are presented in a table with three columns: the setting name, a description, and the input control.


Start of day           The earliest start time         [08:30]
End of day             The latest end time             [22:00]

Enable reminders       Whether reminders are sent      [x] // checkbox
Headline               The email subject               [Hello world] // text
Send at                When reminders are sent         [P1DT12H] before the deadline
Allow changes up to    When events are locked          [PT30M] after the end of the event

I'd like to avoid having 4 dropdowns for each unit (there's nothing that requires years or seconds) as it looks somewhat cluttered in comparison to the other types of inputs.

Asking the user to enter the ISO 8601 format to be used in DateInterval is a last resort. The target users aren't computer illiterate but they aren't developers either.

What is a good way for users to enter intervals/durations?

1 Answer 1


The simplest solution I can think of is a numerical text input followed by a drop down for unit size - something like this:


download bmml source – Wireframes created with Balsamiq Mockups

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.