Jacob Berchem

Timesheets Redesign

At the University of Wisconsin-Madison, the Student Center is a widely used application to register for classes, fill out timesheets, and more. Despite its essential utilities, the application's interface is notoriously egregious and fundamentally unusable. My team was challenged to reconsider students’ experiences submitting their timesheets.

Understanding

To identify the existing problems, our research began with a series of contextual inquiries. These one-on-one interviews highlighted a few key take-aways. First, the context surrounding their completion of timesheets is crucial. Participants entering their hours at home, long after their shift, put in more effort and were often inaccurate. Participants overwhelmingly cited forgetfulness as the reason they didn't enter their hours at work. Additionally, an overload of information on each page caused breakdowns in each participant's process. The system lacks appropriate feedback, so tasks are often completed without confidence. Without feedback (confirmation), many participants failed to submit their timesheets for approval. A final round of contextual inquiries involved the managers of several of the initial participants. These interviews offered our team additional relevant insight after timesheets were submitted.

Ideation

After completing the contextual inquiries and compiling the data, a few initial solutions emerged. A punch-in, punch-out button offered a solution to many of the existing problems. It simplified the process of adding time, provided much-needed feedback and increased accuracy. All ideas focused around leveraging a smarter system that could learn over time and predict user’s needs. One participant entered the same times each week, as scheduling rarely changed. To streamline this process, our solution could predict and offer suggestions as a user manually enters time based on history. The visual design and layout focused on legibility and organization. Excess input fields and information should be accessible, but not always visible.

Solution

The final solution addresses the four major issues identified in the user research. First, the redesign combats the previous application's excessive information. Only the essential fields appear on screen. Due to technical requirements, identified when interviewing supervisors, all other fields are still accessible. Second, reduced page clicks and use of "human" language eases any previous navigation issues. In the original application, feedback caused a majority of the breakdowns. Now, all status changes (saved, deleted, etc.) are obvious and clear. An intentional color palette and icon system creates consistency. Finally, two features reduce the pain of entering the same information each day or week. A punch-in, punch-out button completes the simplest tasks with a single click. Auto-populated data, based on previously entered timesheets, helps students with fixed, regular hours. This automatic data appears as a suggestion to the user, which allows for flexibility.

The original application required three new windows, and a minimum of four new pages to submit a single timesheet. This solution requires no new windows and only two new pages. Simplifying this sequence and reducing clicks saves users time and confusion.

Participants provided positive responses to prompts and feedback in familiar, human language.

A punch-in, punch-out button completes the most essential task in the application. It also makes recording breaks or work events a cinch.

Results

Several tools, Axure (wireframes), Sketch (design) and Invision (user testing), were used to arrive at the final solution. Additional user testing prompted a few minor adjustments. Feedback was positive. Distinct behaviors among new and frequent users melted away. Users found the new system clear and accessible. Leveraged design patterns from the rest of the "MyUW" experience were crucial, turning what was once a confusing, fallible system into an efficient and encouraging one.