Paid Time Off Management App

What if it was easier to request PTO?

Problem

Teams have deadlines and dependencies, which can make managing team PTO a headache.

 

Teams have deadlines and dependencies, which can make managing team PTO a headache. Employees often don’t even have visibility into the availability and PTO of their colleagues, so sometimes they accidentally request PTO at inopportune times. Without that visibility, it may be difficult for managers to make quick decisions and approvals as well. We had to design a mobile app for both personas.

IMG_4796.jpg

My Role

I worked with an IA and a visual designer to create a mobile app that helps employees and employers manage time off requests. On this project, I was the interaction designer. Below are a couple of annotated wireframes from the app.

pto-annotwireframes.png

We focused on two main user stories from the manager's point of view: to approve/decline requests easily and to be able to get an overview of their team's availability. Since there could be a myriad of reasons for taking leave and there is typically a throng of emails back and forth about the PTO, we included a field to allow notes. Some HR systems measure PTO by days, some by hours, so we included fields for both. Once you select the days, the hours field would prepopulate with 8 x (number of dayes) but can also be modified if needed.

Manager+User+Story.png

The manager’s view allows a calendar view to track how many people will be out so that she can avoid having too many people out at once. This calendar will be viewable to the employee as well so they can make that judgment call as well.

There are three ways to approve/decline based on how fast the manager wants to take action or how much detail she wants to see before making the decision.

Another visual designer took my wireframes and created high-fidelity screens. I compiled those screens into an Interaction Flow as a developer handoff artifact. This was to show the flow of the screens and the microinteractions.

Don't know what an IX Flow is? Read more here!

ix-flow.png
Previous
Previous

Interaction Flows

Next
Next

Cart & Checkout Redesign