The Problem
The Restaurant manager who needs to easly make sure his emplyees timesheets are accurate and approved becasue he is extreamly busy managing other areas of the resturant.
The Goal
Our Timesheet App aims to enhance accuracy in timesheet submissions, positively impacting managers responsible for approving timesheets. By sending timely reminders to team members and allowing for easy editing, the app will streamline the approval process. The effectiveness of this solution will be measured by the reduction in the average time taken for managers to approve timesheets.
My role:
This is an individual project that allowed me to plan and direct each step of the design thinking process and a UX strategic designer with mobile and web UI design experience.
Responsibilities:
-
Conduct user research
-
Define the problem and provide insight to inform the ideation phase
-
Define personas, user journey, empathy maps, and user flows
-
Visual design of low-fi and high-fi wireframes, prototypes, and user testing.
-
User research
-
Personas
-
Problem statements
-
User journey map
Understaning the user
User research: summary
To understand user frustration, needs, and requirements, I conducted a foundational research through interviews and user surveys for my project. My goal was to gain insights to understand the processes users go through to find and to manage their timesheets.
I used qualitative research methods due to time and cost constraints.
User research: pain points
Pain point
Restaurant managers struggle with accurate timesheet entries due to manual errors, leading to payroll discrepancies, increased administrative overhead, and potential disputes.
Pain point
Manually collecting, verifying, and processing timesheets is time-consuming and labor-intensive for managers, detracting from other critical operations like customer service and staff training.
Pain point
Managers lack a streamlined system to monitor and report attendance in real-time, hindering informed staffing decisions and causing overstaffing or understaffing.
Pain point
Manual timesheet handling complicates payroll, causing delays and errors in compensation, leading to employee dissatisfaction and increased accounting workload, affecting overall productivity.
“I didn’t realize how difficult it was to manage and fill the schedule”
Goals
-
Make sure he doesn't let his boss down
-
Accurately tracking and approving time
-
Easily communicating updates
Frustrations
-
Addressing last minute scheduling conflicts
-
Quickly letting people know of changes
-
Recording time correctly
Recently promoted to manager John is not only learning his new responsibilities but also learning new software too. He runs a busy small italian restaurant where most of his employees are high school or college kids with inconsistent schedules and he needs to make sure he has enough staff stay open.
Problem statement:
John is a restaurant manager who needs to easily make sure his employee's timesheets are accurate and approved efficiency because he is extremely busy managing other areas of the restaurant.
Persona
John
Age:
Education:
Hometown:
Family:
Occupation:
34
Some collage
Oak Grove
Lives with girlfriend
Manage
“I need this job to help pay for school”
Goals
-
Help off set college cost
-
Enjoy her summer before college starts
-
Remembering to punch in or out
Frustrations
-
Remembering to punch in or out
-
The interface of the current system
-
Getting distracted
Ann is working at a local restaurant for the summer before going to college. She is hoping to save some money but also needs to spend money to hang out with her friends. She is tech-savvy but often distracted and forgets to punch in when arriving at work.
Problem statement:
Ann is a college student and waitress who needs to remember to clock in and make sure her timesheets are accurate because she is saving money to help pay for school.
Persona
Ann
Age:
Education:
Hometown:
Family:
Occupation:
22
Highschool
Maplewood
Lives with Parents
Waitress
Site Map
I built user-focused flows to ensure that my personas could complete their key objectives while reducing the existing pain points.
User journey map
By creating user journey maps, i wanted to illustrate the process of how John behaves, feels and what they they think while accomplishing their goals to address pain points or provide moments of delight.
-
Paper wireframes
-
Digital wireframes
-
Low-fidelity prototype
-
Usability studies
Starting the design
Easy access to all employees
Prioritized the edit function
Digital wireframes
To make the digital wireframes, I started by putting my ideas on paper. Then I began to work on the high-fidelity wireframes in Figma. After several iterations, I came up with these wireframes.
I also worked on digital wireframes for additional screen sizes to make sure the site would be fully responsive
Low-fidelity prototype
I created a low-fidelity prototype for the user flow diagram and wireframes to test functionality before incorporating it into the final design and to ensure accessibility for end-users.
Study type
Unmoderated usability study
Participants:
5 participants
Location:
United States, remote
Length
20-30 minutes
Usability study: Parameters
Write a short introduction to the usability studies you conducted and your findings.
Users want to verify that they are clocking themselves in and out to make sure they get paid correctly
1
If users can’t submit their timesheets they can’t get paid and our app will fail
3
Users want to ensure they were getting paid correctly by easily editing their timesheets before submitting
2
Usability study: findings
Write a short introduction to the usability studies you conducted and your findings.
Mockups correcting submission errores
Supporting evidence from the usability study.
-
4 out of 6 participants had trouble submitting their timecards.
“"Wouldn't it be easier to just have a button go directly to the current time sheet?”
— Kevin
After usability study
Before usability study
Before usability study
After usability study
Mockups clocked In changes
Supporting evidence from the usability study.
-
3 out of 6 participants wanted to verify they were only clocking themselves in and out.
“ hope that i punched myself in"
— Maria
Mockups
Based on insights from the usability studies, i applied design changes. These include adding more information on the practitioner profile and patient reviews
Before usability study
After usability study
Low-fidelity Mockups: Original Screen Size
Refining the design
-
Mockups
-
High-fidelity prototype
-
Accessibility
Low-fidelity Mockups: Mobile Screen Size
High-fidelity prototype
Link: Prototype Link
Takeaways
Impact:
I designed an app to streamline timesheet management for restaurant managers and employees, reducing errors and saving time. The intuitive interface simplifies logging hours for employees and expedites approval for managers.
What I learned:
As a UX designer working on a timesheet platform, I have gained valuable insights and knowledge through the design process. Some of the key things I have learned include:
-
Understanding user needs
-
Importance of simplicity
-
Accessibility considerations
-
User feedback
Paper wireframes
Using wireframes, I initially sketched my ideas on paper before creating high-fidelity versions. After numerous iterations, these wireframes best represented the user flow and met user needs.
Research Questions
-
How long does it take for a user to select and order a pizza in the app?
-
Are users able to successfully order the pizza that they want?
-
What can we learn from the steps users took to order a pizza?
-
Are there any parts of the pizza ordering process where users are getting stuck?
-
Is the payment process easy for the customer?
Methodology
-
25-30 minutes
-
United States, remote
-
Unmoderated usability study)
-
Users were asked to order a pizza on a low-fidelity prototype
Participants
-
3 Females, 2 Males, age20-52
-
Participants who are required to submit weekly timesheets in the last 6 months.