I need to make some kind of date rule designer in a web project. What does this mean? Imagine that the user has a date A, which is basically a dynamic date, and has to set up a second date (B) based on the first.

Imagine something like this: Send an email to my client 2 workdays after my client receives package. (Package receive date = Date A, Email sent date = Date B)

I will give out a few examples:

  • Date B should be defaulted to Date A + 10 days
  • Date B should be defaulted to Date A + 10 workdays
  • Date B should be defaulted to Date A + 2 weeks
  • Date B should be defaulted to Date A - 10 days
  • Date B should be defaulted to Date A - 10 workdays
  • Date B should be defaulted to Date A - 2 weeks

Thing is, that there is actually multiple dates that B can depend on, so what we did until now looked (ugly) something like this:

Textbox1 + Dropdown1 + Dropdown2 + Dropdown 3

  • Textbox1 was where the user specified the difference
  • Dropdown1 was for : day / weekday / month / week / year
  • Dropdown2 was for : before / after
  • Dropdown3 was for : select date A / C / D / F (also in here we added a few other values, like first day of month, second monday of month, n-th day of month etc etc)

Did anyone ever see anything like this? I wonder if we can make this somehow a lot more user-friendly than it is right now with the "4 web control" version.

1 Answer 1


Ok so if I get what you're saying it would look something like this. See below.

enter image description here

The best way to proceed would be to reduce the number of dropdown menu's used.

Drop-down menus are often more trouble than they are worth and can be confusing because Web designers use them for several different purposes. Also, scrolling menus reduce usability when they prevent users from seeing all their options in a single glance.

Source: Drop-Down Menus: Use Sparingly

Try something like this. See image below.

  • Reduce cognitive load by having a pre-fill text with the most common input (>90%).
  • The second dropbox has only two options so replace it with a picker
  • Maybe try and use only one text field where the user enters the complete sentence and your system analyses and processes it in a way Slack(bot) handles new reminders.

enter image description here

Source: Slack Help Center

enter image description here

  • This (your 2nd image) is interesting, and I personally really like it. I actually had built something like this. The reactions were not as I expected. The problem was when the textbox was empty, user "might not know what to write in them", because all this is like "writing code, user has to learn programming language". I do not agree with that, I would really prefer this way, but I was told otherwise.
    – Ash
    May 2, 2017 at 15:32
  • Your 3rd image seems a lot more complex than my idea (your 1st image). Thanks for the help though !
    – Ash
    May 2, 2017 at 15:33
  • @Ash I get that. For the second image you need some context for the user. Guide him while filling out the text field by either having a placeholder of subtitle text. May 2, 2017 at 15:47

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.