CASE STUDY
![case-study-hero-beige.jpg](https://static.wixstatic.com/media/f347a1_e6d1cefd18734ee1ab9488c6d6b40121~mv2.jpg/v1/fill/w_980,h_748,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/f347a1_e6d1cefd18734ee1ab9488c6d6b40121~mv2.jpg)
CASE STUDY
![ENGAGE editing timesheet mockup.png](https://static.wixstatic.com/media/f347a1_461be0b478d44165ba127d034b718982~mv2.png/v1/crop/x_0,y_0,w_1400,h_834/fill/w_863,h_514,al_c,q_95,enc_avif,quality_auto/ENGAGE%20editing%20timesheet%20mockup.png)
The client
Designing Timesheet Automation Software to Save Employee Time and Company Resources
My employer, 3Pillar Global, a product design agency commissioned this tool for internal use.
The problem
Filling out and submitting weekly timesheets is an unnecessary drain on worker time and resources. 5 minutes every week multiplied by ~50 weeks a year equals roughly 4 hours of billable time that could have been spent more productively. At a company with 2,000 employees, this amounts to about 8,000 wasted labor hours a year across the workforce.
The solution
My role
Design a system that allows users to set-and-forget their timesheets so they submit automatically on a weekly basis, creating affordances for the accommadation of all possible edge cases (national holidays, PTO, unexpected overtime, and more.)
I was the sole designer on this project, working with two PLs and a dev team from ideation to delivery.
![Portfolio-divider.png](https://static.wixstatic.com/media/f347a1_b5388cead4cb4182ae3c44344f3385a3~mv2.png/v1/fill/w_608,h_240,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/f347a1_b5388cead4cb4182ae3c44344f3385a3~mv2.png)
Discovery
01 Starting the process
Over the course of my time at 3Pillar, the company had used two different HR time tracking products, and neither was particularly user-friendly. Preparing to design this new product, I was especially able to empathize with the needs and pain points of the end-users because one of the real end-users was me.
​
After meeting my collaborators, the main PL stakeholder shared a draft of a specs document a sketch illustrating some of his ideas for the product.
The PL's original sketch and an excerpt from his high-level product requirements.
02 Defining high-level goals
The problem sounded simple enough, but these things are always complicated than they seem, so I sought out to define the scope of the project from first principles by creating a user flow for review with the PLs. The timesheet product was live within a set of internal tools called ENGAGE – we knew what we wanted it to do, but we still had to define what actions the user would take, where they would take them, and in what order.
![Engage timesheet user flow 1.png](https://static.wixstatic.com/media/f347a1_634851f6103f40c1bd53192d951616c8~mv2.png/v1/fill/w_933,h_315,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/Engage%20timesheet%20user%20flow%201.png)
A flow I made in one of our earliest meetings, ensuring we were all on the same page regarding the functionality we expected.
03 Defining user flows
In the above diagram, we came up with four separate user flows that the product would need to serve: setting up automation, editing a template, turning off automation, and viewing a timesheet from a past week. I used more comprehensive user flows in order to determine how each of these should work.
Excerpts from an early "Automation is set up, user overrides for a specific week" user flow.
![Portfolio-divider.png](https://static.wixstatic.com/media/f347a1_b5388cead4cb4182ae3c44344f3385a3~mv2.png/v1/fill/w_608,h_240,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/f347a1_b5388cead4cb4182ae3c44344f3385a3~mv2.png)
Wireframing and usability testing
04 Lo-fi mockup
One tricky part about this project was the fact that timesheet automation would be opt-in, so that it would not totally replace 3Pillar's manual timesheet software. Indeed, managers would still approve timesheets manually through that other product regardless of whether they were automated or not. As a designer, I had to make sure the timesheet automation product was seamlessly interoperable with the manual entry product.
![Timesheet automation lofi wireframe.png](https://static.wixstatic.com/media/f347a1_c098c5f7d43e448f986acc3f2a5c303f~mv2.png/v1/fill/w_933,h_583,al_c,q_90,usm_0.66_1.00_0.01,enc_avif,quality_auto/Timesheet%20automation%20lofi%20wireframe.png)
An early wireframe that ultimately bit off more than it could chew – the "Submitted," "Approved," and "Rejected" tabs were removed later because the manual entry product already covered their utility.
05 Usability testing
After we aligned with PLs on a set of initial wireframes which reflected the goals and direction for the Choose a Template project, we moved into testing with real client users in order to see how the designs could be further improved. I created the prototype, created the narrative, and wrote the questions for the script used in the interviews.
I mocked up this prototype illustrating the product's main features; it's what I shared with users during usability testing.
![Portfolio-divider.png](https://static.wixstatic.com/media/f347a1_b5388cead4cb4182ae3c44344f3385a3~mv2.png/v1/fill/w_608,h_240,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/f347a1_b5388cead4cb4182ae3c44344f3385a3~mv2.png)
Final designs
06 Applying new insights
While we found that the vast majority of users we tested with were able to use the software without serious issues, there were a couple areas where I improved the UI copy in order to make complex backend processes and limitations easier for users to understand.
Getting the UX writing correct
PTO and Holidays are imported from one application, while the user is used to manually submitting timesheets through a separate program. The copy had to explain how everything related, clearly, all the time.
DESIGN UPDATE
Accomadating unexpected edge-cases
3Pillar is an agency, and sometimes contracts end. How should the system communicate this event? What should it display if the user is viewing a week which switches from one month to another on a Wednesday? How should a timesheet template apply to a week split into two timesheets?
DESIGN UPDATE
Try to keep things as simple as possible
Because the backend payroll infrastructure uses three separate products, it's easy for the user to get confused. Given these unchangeable technical constraints, how can we make confusing parameters as straightforward as possible for busy users with many other tasks to accomplish?
DESIGN UPDATE
More projects
Revamping a Complex Government Services Platform from the Ground-Up
Redesigned core functionality for a platform that serves hundreds of municipalities across the country.
Combining 15 Distinct Dataset-Specific Applications in a Single Integrated Platform
Designed a robust dashboard for a Fortune 500 SAAS offering.
Creating a Core Service for a Leading Consumer Intelligence Services Company
Redesigned a curated, cross-functional directory of data analytics resources for a SAAS offering.
My Writing
My background as a journalist informs my designs: it helps me think through tough questions and deduce actionable conclusions.