MY ROLE: Lead UX design, user research, usability testing & strategy
CLIENT: Human Resources, Government Compliance
TEAM: Software Engineers, Project Manager,
UX Designers
SCOPE: September 2017 - July 2018
Harris Corporation CHQ HR team (before merger with L3 Technologies) desired to have a new time keeping system as the application was made in people soft and was becoming out of date for the needs of the employees.
HR taking in multiple complaints and finding 59% of employees having various time keeping errors (clocking out after hours, not saving time entry and leaving page, entering wrong employee charge number for projects, etc.) the previous timekeeping system. The CHRO (Chief Human Resource Officer) requested the User Experience team services.
My goal was to not only redesign the Harris time keeping system but to also use the new Timecard 2.0 to showcase the fully branded capabilities of the Harris design system (now L3Harris Design System).
Create a new employee timecard to replace the original 10 year old application that also helps reduce employee timecard errors.
Requirements
Timecard Government compliance required that the timecard have several features:
The timecard must dynamically display either 7 or 8 week day edit boxes based on schedule (9/80 or M-F Regular)​
Must be able to make Labor (timekeeping) corrections
Provide numerous error messages and warning messages
Displays appropriate panels to support California and D.C. Labor Rules​
Displays appropriate Time Reporting Codes based on a matrix of employee type and business needs​
Approver Section
Redesign the company timekeeping application to be more intuitive and modern.
User Centered Design (UCD) process beginning with Discovery Research
TOOLS: Techsmith Morae Screen recorder, Axure 8, Balsamiq, Adobe Illustrator, Skype, paper, pencil, marker, whiteboard
During the discovery phase of the UCD process we conducted a series of brainstorms to capture some quantitative data from the employees to understand what features they wanted/ needed.
Comparative Analysis: To get inspired as well as understand how other platforms handle there timekeeping, we investigated a few platforms.
Strengths:
Clean modern UI.
Clearly labeled weekly schedule.
Highlevel view of different timekeeping hours.
Weaknesses:
Clicking into grid triggers popup to enter time making time entry sluggish.
Opportunities:
Enter time into rows instead of popup form.
Strengths:
Able to look into future pay periods
Able to search for past timecards.
Weaknesses:
Grid is a bit cluttered with data.
Opportunities:
Declutter and show/hide data by priority.
I conducted 15 user interviews and white boarded & sketched some ideas with several different employees to understand their pain points and needs.
After some affinity mapping with a group of employees and the project team we began to find some common themes and grouped them together this is was we found were common points of interest:
EMPLOYEE KEY TAKEAWAYS
App login (Single Sign On)​
Daily, Weekly view
Recent list of charge numbers (drop down)​
List of common times (with “custom” option)​
User preferences (as a button on time log screen)​
Approver section
Employee dependent views
Approver setup​
Notification setup (location based, time based, validation)​
During the design phase of the UCD process I reviewed the features the employees came up with and aligned them with requirements and created a prioritization of user stories.
Information Architecture
User Flow
Taking the sketches from the employee brainstorm, I created a simple wireflow to illustrate the steps an employee would take entering their time code and saving their progress for the day. Wireflows were created for each use case and validated with employees and government compliance.
After the wireframes/ wireflow were completed, the first iteration of the timecard was made and presented to the c-suite executives at the department IT All Hands meeting to build excitement for the new upcoming application.
The first concept after completing user interviews and brainstorm sessions with the team.
Mistake Proofing
Working with timecard compliance to understand I came up with several preventative popups to assist with limiting timecard errors. (reminder: 59% of employees were making errors on their timecards monthly). The result was four different notifications that require the employee to justify there reasons for the error. Adding these features along with the intuitiveness of timecard 2.0 helped contribute to reducing employee errors down to 20%
Timecard Errors
Incomplete Timecard Justification: When an employee didn't save time from previous day they have to notate why when next entering timecard.
Changed Hours Justification: Whenever an employee attempts to edit previously saved hours they have to enter a justification why.
Early Submission Justification: Occurs when employee is attempting to save/ submit timecard for approval days before the timecard is due.
Future Hours Justification: Occurs when an employee attempts to save/ submit hours in advance on timecard.
I conducted a series of usability testing and A/B tests throughout this project. Below are links from the 1st usability study and last
In the very 1st usability study I went over several tasks with employees and discovered observed several things. When asked to save their timecard, users ignored the red Save button and the approvers section in the red navbar section. The usability test also tested the newly integrated vacation request.
As a result, from the previous study I moved the approvers section out of the navbar and to the bottom footer and made the Save button from red to blue.
Results and Company Impact
The final usability study had a task success rate of 98% with task four revealing that we needed to make the icon to use previously used icons being adjusted to help employees understand what they need to select to use a timecode from the previous 90 days.
98% Usability Task Success Rate
97% Company wide approval rating
"This is extremely better than what we were using before"
"I love the fact that I can clock out from my phone"
"I love that we are able to save charge codes now"
"The new timecard makes clocking out so much easier now"
"I love that I can see easily approve my employees timecards ."
Timecard Final Mockup
After the wireframes/ wireflow were completed, the first iteration of the timecard was made and presented to the c-suite executives at the department IT All Hands meeting to build excitement for the new upcoming application.
The released version of the timecard
Takeaways and next steps
After launching the new timecard app. L3Harris gained a better understanding of why UX is important and what it can do for a product or service. This became one of the most visible applications enterprise wide that employees would see and understand real ROI and ultimately resulted in more projects coming to our team.
This was my first project at L3Harris, and one of the things I learned was to make sure I kept communication with the developers and project manager open. Early on, I would assume after a meeting discussion that my project team knew what deliverables I would be working on, but everyone had multiple projects they were working on so I learned to make sure to over-communicate my progress no matter how small or big, so everyone on the team was on the same page. The other thing I learned was to take pictures and document any and all whiteboard sessions before you leave the room for future discussions so I'm not relying on memory alone. It's not fun walking out a successful whiteboard session and sitting back at your desk to start wireframing out the solution and realize you need to see the whiteboard, but another team already erased your thoughts. (Shame on me).
Following the Timecard release, the next steps were to incorporate a new employee vacation request system. I will discuss that in a separate case study. :)