I'm currently sketching a report module.

The options for one value you can add are:

 - Object                ex New York Office
 - Device                ex My Awesome Weather Station
 - Value                 ex Ambient Temperature
 - Aggregation           AVG/MIN/MAX

You can add as many values as you wish.

You have to select one date range to generate your report for.

You can add as many date ranges as you want to. There will be one chart per date range.
Date Range pickers shall open a modal calendar.

This is my first try to get all under one roof without bloating the interface.

enter image description here

Hopefully it's already clear what you can do: First you select your date range. Then you can add a values within the table. Pressing the tick will add the value as text into the table and add a new row for adding a new value.

My actual question

What would be an intuitive way to add many date ranges?

The best idea I came up with is to reuse the table.

enter image description here

  • Is there a limit to the number of objects that can be added for a date range?
    – Brian
    Commented May 19, 2015 at 15:16
  • @Brian no limits at all. But you dont connect a specific object o an specific date range. Commented May 19, 2015 at 15:20
  • 1
    A really important question to ask is: how will this get used 90% of the time? The web app I work on has two datepickers for start and end dates on reports, default blank. Guess what most users do? They go back on the start date a few months and pick a day. Then they pick today for end date. It's a needless bit of user choice most of the time. We could (and should) specify today - 3 months and today. Whatever you do, provide a reasonable default value that takes no work from the user and covers the most common use case.
    – Marsh
    Commented May 19, 2015 at 23:02

2 Answers 2


I'd probably separate this out into two separate views: Viewing the date range data, and creating/editing date ranges.

The latter might use an accordion-style setup to create blocks for the dates and create some visual/logical separation:

enter image description here

...where the former would present the chart data with a date range selector and a link to the editor where one could create, delete, or edit the date ranges.

enter image description here

  • This is a very nice idea and I'm voting it up, but IMHO, despite the date ranges, you should need to separate by objects rather than dates, otherwise you'll get the values for different date ranges, but mixed objects
    – Devin
    Commented May 19, 2015 at 16:45
  • Thanks for your answer. I'll let the question open for a bit though. Commented May 20, 2015 at 12:49

I think it really depends on how often you are going to have to do this, otherwise it is no point in creating a custom control for a very specific purpose that doesn't actually get used very much at all.

One thing I thought of it to create a calendar-like widget that allows the user to click a start date and then an end date for the range, such that a single click selects or unselects the date, and a double click on the second date locks in the date range (when you have a start date selected). It would require some interaction design tweaks but I think there are plenty of airline or holiday booking website to reference from.

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.