We are building an internal tool to apply for and track leave. We have discovered that choosing what days to take off can be ambiguous. We've thought of two different ways to ask for a set number of days off (wire-framed below). Which of these would be easier for you to use?

Note: any holidays or weekends that fall in the time period are not to be counted as leave days.

Leave request page mockup

  • 19
    First day of leave and last day of leave makes more sense to me.
    – JamesRyan
    Commented Feb 5, 2015 at 12:02
  • 12
    Why are you using "First day back in office" instead of "Last day of leave" (and use 9 Feb instead of 10 Feb)? I always assume ranges are inclusive when doing paperwork.
    – Bakuriu
    Commented Feb 5, 2015 at 12:13
  • 11
    I would only note that the right-option is particularly likely to be annoying/unhelpful, because it will make people have to play around to figure out what days are weekends, holidays, etc. It seems like psychologically people will know what days they want to not be at work, and the job of the app should be to tell them how much leave that will cost them.
    – BrianH
    Commented Feb 6, 2015 at 4:57
  • 1
    @Bakuriu: Maybe ranges are inclusive when doing paperwork, but I for one tend to find that paperwork annoying exactly because ranges are inclusive. Sometimes. Maybe there is no generic best answer here. Commented Feb 6, 2015 at 15:04
  • There is some programmers' bias here: half-open ranges are the default in many languages (Python especially), and feel more natural to developers. Commented Feb 7, 2015 at 9:02

3 Answers 3


I would go with this kind of UI, reasoning:

  • Users only select the dates that he/she is applying leave for without having to think about first day of leave and first day of work.
  • Leave balance is not displayed on the same screen as it might get too cluttered and might confuse the users. For "leave balance" checking, I would suggest to make it accessible from the main menu on a separate screen. (Since this might include, leaves pending for approval, days left, days already taken etc)

enter image description here

  • 1
    This is similar to Expedia's interface for when you're leaving and when you're coming back. This definitely works!
    – UXerUIer
    Commented Feb 5, 2015 at 14:04
  • 7
    What's this look like when the desired range spans months, or is more than a month long?
    – Phil Frost
    Commented Feb 5, 2015 at 14:28
  • 2
    @PhilFrost - I want to work at your company if leave spans more than a month... :)
    – DaveAlger
    Commented Feb 6, 2015 at 0:51
  • 2
    @DaveAlger Try working in Europe.
    – Phil Frost
    Commented Feb 6, 2015 at 2:06
  • 3
    @Ades: Leaving aside the weird date "February 31", which seems to exist in your calendar, how about a simple two-day vacation from Feb 31 to Mar 1? Or from Jan 30 to Feb 2? Commented Feb 6, 2015 at 15:13

I’ve considered the question recently due to travelling and booking hostels. The same problem appears there, since whether you book the night or the day can be confusing indeed.

For usability reasons, the left one is a better choice since the user doesn’t have to do the maths. In this case, the best way to help the user is to be clear in the definition of the date: write “check-in” and “check-out” for an hostel or, as you did, “first day back in the office”.

In a more visual way, displaying the calendar — as in Google’s or Apple’s calendars — and colouring the day away from the office allows the person to clearly picture weeks and week-ends when booking.


The way Airbnb does it is great. When picking you would have the "First day of leave, First day of work" option. And when tapped, the calendar shows in an infinite scroll starting today and onward, in your case you could even color differently the days that don't count as leave days. They mark the leave days in the calendar nicely, even if they start one month and end the next one, and what airbnb does is that after they have selected both dates it waits a second and then closes the calendar, just leaving the two headers with the correct dates showing. And you could add the how many leave days are counted.

enter image description hereenter image description here

This way is clear:

  1. When their leave starts.
  2. Which day is their first day back to work.
  3. How many leaves day they are taking, both in by the number after they selected it (i.e. "Leave day: 5 days") and by the color in the calendar.

And is not even taking much space, look how clean Airbn looks!

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.