LB-lettermark for Litsa Babalis
Released in 2023
Client: Apple

How can I enter two week’s worth of hours on my timesheet…fast?

I improved the design of the timecard feature to enhance the efficiency and accuracy in tracking work hours and streamline the editing process.

Responsive view of timecards on mobile device
Role

Lead product designer

Paired with

UX Researcher, Content designer

Platform

Web, iOS, Android

A screenshot of an inline quick edit on a web platform
Inline quick edit on web

WorkJam is a SaaS solution for the frontline workplace and plays a pivotal role as the backbone of efficiency for organizations globally. At the forefront of this digital transformation is Apple Inc., utilizing the WorkJam app to streamline communication and enhance workforce collaboration across its extensive network of stores worldwide.

In this case study , I’ll delve into the process of enhancing WorkJam’s timecard functionality to address challenges and elevate the user experience for Apple employees.

The problem

After launching the MVP for WorkJam’s timecard feature, it was time to focus on some of the usability issues that were originally out of scope.

Users were limited to editing one entry at a time and for a happy path this would be ok, however after some user testing and client interviews, interesting circumstances emerged, revealing a significant user pain point: frontline workers often struggled with punctuality, leading to delayed or missed clock-ins. Consequently, they resort to catching up and correcting their timesheets just before the pay cycle ends. This process proved cumbersome and time-consuming, impeding efficiency.

To address this issue, our goal was to streamline the timecard editing process, making it faster and more user-friendly. Our aim was twofold: to boost efficiency for frontline workers and ensure accurate timekeeping without unnecessary hassle.

A screenshot of the Timecard edit user flow on mobile devices
Timecard edit user flow on mobile devices
Components of Employee timecard edit screen on mobile device
Timecard edit components for mobile devices

Research

In preparation for this project, I collaborated closely with a user research analyst to conduct a comprehensive investigation, employing a multifaceted approach that included client interviews and analysis of Google Analytics data.

During client interviews, we uncovered significant pain points among both managers and employees. One recurring issue was the prevalence of missed punches and inconsistencies in timecard entries. Moreover, managers expressed frustration over spending excessive time correcting their employees’ timecards due to the system’s complexity.

Our analysis of Google Analytics data corroborated these findings, revealing a high rate of user disengagement with the timecard feature. Specifically, we observed that 79% of users discontinued using timecards within five minutes of accessing the feature, primarily citing the prolonged editing time required to manage a high volume of punches.

These insights were pivotal in shaping our approach to improving the timecard functionality. Recognizing the urgent need to streamline the editing process and reduce user frustration, we prioritized the implementation of batch entry capability in timecards as a key solution.

Editing timecards one by one feels like a never-ending chore. Sometimes, I forget to clock in, or I'm just running late...

Sandy, Technical Specialist

Ideation

In addition to brainstorming sessions, we also utilized journey mapping to deepen our understanding of user experiences. By visualizing the entire user journey, from clocking in to editing timecard entries, we gained valuable insights into their interactions with the app.

This holistic perspective allowed us to empathize with users, identifying pain points and moments of frustration. Armed with this understanding, we approached our brainstorming sessions with a clear focus on addressing these challenges.

a screenshot of my process flow chart
Process flow chart

Testing and Iterations

As we moved into the testing phase, we knew it was time to put our ideas to the test and see how they held up in the real world. We gathered feedback from a diverse group of users, ranging from seasoned veterans to newcomers, ensuring we captured a broad spectrum of perspectives.

Watching users interact with our prototype was both eye-opening and humbling. We witnessed firsthand the pain points and the moments of delight as they navigated through the new features. With each round of testing, we took notes, identifying areas for improvement and tweaking the user experience based on the feedback received.

A screenshot of multiple timecard entry user flow in Figma
Multiple timecard entry user flow in Figma for web
A screenshot of adding a single timecard entry vs adding timecard entries in batches
Adding a single timecard entry vs adding timecard entries in batches

Learnings

Learning from this project encompassed a mix of positive and challenging aspects, providing valuable insights for future endeavors. Here are some key takeaways:

The analysis of data proved to be a powerful tool for making informed decisions. The identification of the 79% drop-off rate after five minutes provided a clear focus for addressing a critical usability issue.

Clear communication with stakeholders and managing expectations emerged as critical aspects. Learning how to convey the impact of proposed changes, potential delays, and the iterative nature of the development process became essential for fostering understanding and cooperation.