(WEB_PORTAL) Improving Leave Request Form UX — Time Selection and Multi-Date Requests

Overview

Based on feedback from users who actually used the leave request form, we improved two things. One was the way time is selected, and the other was the way multiple days can be requested at once.

Key Implementation Points

1. Separating Hour and Minute Selection

Previously, time had to be chosen from a single combined dropdown, which made the list long and hard to scan. We split it into two separate dropdowns — hour (e.g. 08–19) and minute (in 00/30-minute increments) — reducing the number of items in each list so users could find the time they wanted more quickly.

2. Multi-Date Requests

Requesting several consecutive full days of leave was common, but it was tedious to have to submit a separate request for each day. We changed the form so that specifying a start and end date automatically requests every day in between at once, and when multiple dates are selected, the time-selection UI is hidden and the request is fixed to a full day.

On submit:
    Are multiple dates selected?
        Yes → generate one request per date (all full-day)
        No  → single request (time can be specified)
    Send each item to the API in sequence

We also added a message like "This will be submitted as N consecutive full-day leave requests" so users could preview the outcome before submitting.

Retrospective

• When designing forms, feedback like "there are too many options, it's inconvenient" is often better solved by breaking the selection into smaller, separate controls rather than reducing the number of options outright. Splitting hour and minute selection was a good example of this.
• We reconfirmed that bundling a repetitive task (submitting one day at a time) into a single operation (specifying a date range) can meaningfully improve perceived usability.