I am building a tool to track out of office for my team. The main view is a month calendar view. Right now you get a certain amount of vacation (lets say 10 days). People can take full-day or half-day vacations.

Right now our request UI just shows 2 text boxes (with calendar dropdowns) for start date and end date.

This is obviously not good enough to support half-day vacations. Given that I have to make a choice of either:

1) Just adding a "half day checkbox" and after you click on it, a "AM/PM" radio button comes up


2) Adding time to start date and end date textboxes so a person can say that "I am out from Monday at 9AM to 2PM."

Option 2 seems more flexible, but might over-complicate things because I now need to translate hours into days off and that will allow people to take 0.675 days off. Also it's a global team so Option 2 would now need to start dealing with time zones and all of the other complications associated with time across regions. But Option 1 seems like it might be too constricting and less future-proof.

Also note, this tool might allow other events beyond vacation at some point so i want to avoid painting into a corner.

  • 1
    Do note that you can implement the option 1 technically with option 2. That way you can keep the UI simple while preserving the chance to change the UI at a later date.3
    – Illotus
    Commented Dec 9, 2012 at 21:49
  • @Illotus - agreed but then i have to start worrying about timezone, etc as people are in different regions
    – leora
    Commented Dec 10, 2012 at 1:22

5 Answers 5


Go with Option 2.
You say that Option 2 is problematic because it means you'll have to deal with time zones, but even if you deal only with full days you'll still need to deal with time zones. For example, a worker who is out for the full day on January 1st in Alaska will need to be shown to workers in Japan as being out for the day of January 2nd.

Also, depending on culture, it could be quite common for users to want to take only part of the day off. A parent picking a child up from pre-school two days a week may need to register as taking off an hour or two early on both those days; they can only do this if you allow entry of time by hour.


Beyond a doubt, to keep it simple and intuitive, I'd definitely go with a variant of version 1, but I'd do away with text inputs, options, checkboxes and such, and replace them with a couple of calendar interactions to cover the different input possibilities, clearly explained beneath the calendar:


download bmml source – Wireframes created with Balsamiq Mockups

  • I can see s problem with double-tapping. Which part of the day I will select by it? I think that it is possible to increment/decrement by half of the day via a single tap: tap once to select a first half of the day, tap again to select a full day and again to select a second half of the day. Commented Dec 19, 2012 at 19:59

I will start with an assumption that an employee is allowed to take consecutive full days off work.

Have a switch for "Full day" and "Hours".

When "Full day" is selected, present a horizontal list of days with an option to scroll to the right (future) for the next 6 months. Have draggable handles on the left and right so the user is able to select multiple days and visually understand what has been selected. Here's the interaction I'm describing http://www.google.com/finance?q=NASDAQ%3AGOOG&ei=Kk7FUND0CMOvkAWi0wE look at the bottom of the chart to see the ability to select a period of time by dragging.

When "Hours" selected, allow user to select a day and then present a horizontal list of hours and have the functionality described above but for selecting hours as oppose to days.


Seeing as you have a calendar UI already built. Give the user two small icons. Just two small circles. One filled half way the other all the way. Each represent how much time is going to be taken off. When a circle is selected. Bring up a small modal window near the circle. The user then selects the time in either am or pm or even split. Once saved the modal disappears with the opposite circle almost transparent. It's still selectable thus allowing the user the ability to change their mind and/or make edits.

Later on you could write in a filter at the top of the page that would allow you to select all half-days or full-days of people being out. It would also be an easy visual indicator to other employees who's doing what.

  • And the negative was for?
    – Tony
    Commented Dec 15, 2012 at 19:07

Adding the option of picking the time you are out for a specific day is much more straightforward than checking a box.

The option would allow the employer to identify the time that the employee will be out. If you just have a general check box that says they are taking a half day, how do you identify whether it was the first have, or second half of the day? I'm sure HR would have an input on this.

Hope this helps! :)

  • 1
    please re-read my question. i state "after you click on it, a "AM/PM" radio button comes up"
    – leora
    Commented Dec 9, 2012 at 18:57
  • 1
    @leora But what if someone were to work some in the morning, and some at night, which is very typical for a corporate environment. (AM & PM would be the same)
    – HeyCameron
    Commented Dec 9, 2012 at 21:25

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.