top of page
Mock-up-001i.png

Mobile timesheet app for a pizza restaurant

Google Coursara Certificat Class

Duration: 1 month

Project Type: Personal Project

Designer: Todd Kemmer

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.

Mock-up-002b.png
  • 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 1

Restaurant managers struggle with accurate timesheet entries due to manual errors, leading to payroll discrepancies, increased administrative overhead, and potential disputes.

Pain point 2

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 3

Managers lack a streamlined system to monitor and report attendance in real-time, hindering informed staffing decisions and causing overstaffing or understaffing.

Pain point 4

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 efficinaly 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

Persona Image-002.png

Ann

Age:

Education:

Hometown:

Family:

Occupation:

22

Highschool

Maplewood

Lives with Parents

Waitress

Weekly Challenge 3, user journey.png

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

Site Map

I built user-focused flows to ensure that my personas could complete their key objectives while reducing the existing pain points.

Frame 2.png

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.

paper mockups.png
13j7glqWTpeyF5AjHD0fJ5OfqomrfijFrvdYXspruSnw.png

Easy access to all employees

Prioritized the edit function

1_LjIB2DDac07hirPQjS3UXh-paEai42_MMrni6gPYEM.png

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

112DqQkn1Dn8HjztTpVOJoeS5s650iANJI9jmttnYE30.png
1hnIlPK0IZVVfzSEqfBJGbQdGF4me1sVS2HBZCphIgEQ (1).png

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.

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.

1

Users want to verify that they are clocking themselves in and out to make sure they get paid correctly

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 timesheet?” — Kevin

After usability study

Before usability study

Before usability study

After usability study

Mockup-2-Update Submit.png

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

Refining the design

  • Mockups

  • High-fidelity prototype

  • Accessibility

Mockups

Based on insights from the usability studies, i applied design changes. These include adding more information on the practitioner profile and patient reviews

13j7glqWTpeyF5AjHD0fJ5OfqomrfijFrvdYXspruSnw.png
1WgcuOUvtn2_IH3SRGmtXyU5Q5rjshJMHBgJ2e4eYhc8.png
Before usability study
After usability study
1mE9uC1ZMpad2UEvaKrk4ZKxTMFRigmEGGTMbVkH4uyY.png
1WgcuOUvtn2_IH3SRGmtXyU5Q5rjshJMHBgJ2e4eYhc8.png
1S7-JMz36S2AyZLc6_a_5DbPkjrDwA_s4BXvoZonL_8c.png
1MFfBZLoA2QoUq586NCTvYICT4_iuMY6tK_D5CkYNgks.png

Low-fidelity Mockups:  Screen Size

1K8SZ3wyE-pddNFvOi7oS2kiltvSxr42lDTZhS0tw6-o.png
1fHes1uqtLwRswVaF0VqeoC1Nqgy6XWS85my3hRvMi9g.png
1K0WjYgNiHElJNh_JzUosZ7GgAvLTgsi2uvyPmUo5YDo.png
1vFgknsU1B0Yxfnfxh49Ow90ZUSsKJo2hsNn4n5dsY3Q.png
1p3CKQ8RQM96VXyBUIqEuIdwzeJjEhEkv5z6MehktJTI.png

Low-fidelity Mockups: Mobile Screen Size

12.gif

High-fidelity prototype

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

Research Questions
  1. How long does it take for a user to select and order a pizza in the app?

  2. Are users able to successfully order the pizza that they want?

  3. What can we learn from the steps users took to order a pizza?

  4. Are there any parts of the pizza ordering process where users are getting stuck?

  5. Is the payment process easy for the customer?

Methodology
  1. 25-30 minutes

  2. United States, remote

  3. Unmoderated usability study)

  4. Users were asked to order a pizza on a low-fidelity prototype

Participants
  1. 3 Females, 2 Males, age20-52

  2. Participants who are required to submit weekly timesheets in the last 6 months. 

bottom of page