Time Off Calendar Case Study
Year: Spring 2022
Background
The client is experiencing difficulty in tracking and approving employee time off requests. The current system displays the requests in a table format, which makes it difficult for supervisors to visualize how many employees will be taking the same day off. This resulted in multiple staff requesting the same day(s) causing a scheduling conflict. The goal is to create a calendar where supervisors can view and approve all time off requests in a weekly and monthly format.
User Research
To better understand the needs and pain points of the supervisors, I conducted user research through interviews and surveys. The findings revealed that supervisors prefer a visual representation of employee time off requests, as it enables them to quickly identify potential scheduling conflicts. Additionally, supervisors would like the ability to approve or deny requests directly from the calendar view.
Design Solution
Based on the user research findings, I decided to create a calendar view with a color-coded system to represent each employee's time off request. The calendar view would allow supervisors to see all the approved, pending, and denied time off requests for each day, week, or month. Additionally, I included the ability to filter requests by employee or department, making it easier for supervisors to manage their team's schedules
To ensure that the calendar view is user-friendly, I enabled an edit feature that enables supervisors to easily adjust employee time off requests. This feature allows supervisors to quickly identify and resolve potential scheduling conflicts. Furthermore, I incorporated a pop-up window that displays additional information about each employee's time off request, such as the reason for the request and the number of days off requested.
Lastly, the UX designer added an approval workflow feature, which enables supervisors to approve or deny an employee's time off requests directly from the calendar view. The approval workflow feature includes a notification system that alerts employees of the approval or denial of their request.
Requirements
The design had to have the following requirements:
Allow for Overlapping Time off
Multiple Requests per day
Staff name
Total Hours
Status
Approve and Decline Buttons
Date
Type of Time Off
Testing and Iteration
To ensure that the design solution met the needs of the supervisors, we conducted user testing and collected feedback. Based on the feedback received, I made several iterations to the design solution, including simplifying the filter system, and modifying the approval workflow feature.
Conclusion
In conclusion, I successfully designed a calendar view that enables supervisors to track and approve employee time off requests. The calendar view includes a color-coded system, pop-up window, and approval workflow feature, which all work together to make it easier for supervisors to manage their team's schedules. Through user research and testing, I ensured that the design solution met the needs of the supervisors and provided a seamless user experience.
Weekly View
In the final design for the weekly view where real estate is much more available, I had to carefully design each time-off area so it can fit all critical data regarding the request.
As you can see below the supervisor would open the Time Off Management screen and see all of their employees listed on the left. Each employee would have their own row, even if no time is being taken off. The advantage of listing each employee regardless of any time off request is that the supervisor can more easily deduct which staff are working or not in a given week since all staff is listed. I also relied on color to help portray the different types of time off. Green = PTO, Yellow = Sick Leave, etc. The user can easily see any requests that still need to be approved from the approve and decline buttons only being listed on newly requested time off.
For more information or to approve, decline or edit a request the user can simply click within the highlighted area to get these pop ups which clear up clutter and still provide all actions availale.
Another integral part of the design was the ability to filter by staff name. This filter needed to be dynamic so I included a search bar that would utilize incremental searching as shown below. The incremental search function would prove beneficial for high-ranking supervisors and executives who have a lot of staff reporting to them. The filter would first default to list all staff that directly report to you. Some executives who have several branches of staff beneath them can use the incremental search as demonstrated below.
Month View
In the final design for the monthly view where real estate is much more valuable, I decided that only essential information will be shown with a pop-up window displaying additional information. The primary information that I determined needed to be always visible were:
What day(s) is the time off?
Displayed by highlighting the request from the start date to the end date.
Which staff is taking time off?
Displaying the staff's name in the highlighted request
What type of time off are they taking?
Displayed based on the color of the highlighted request Green = PTO, Yellow = Sick Leave, etc.
What is the status of the request?
Displayed using an icon i.e. green checkbox for approved, etc
Immediately displaying these 4 requirements, the supervisor can know what days each staff has requested, the type of time off, and the status of the request.
When selected, a pop-up will display any additional information and provide available actions.
Incase there is more than 5 staff taking the same day off then the 5th row will be a show more button as shown below:
Prototype
