I made the application more accessible with larger buttons, easier to reach navigation, and simple pop-ups to request and accept shift coverage,
View Prototype
I chose to redesign the UKG app after listening to my coworkers at Anthropologie complain about it for 9 months. We have over 40 individuals employed at the store at any given time. Based on what I gathered from informal conversations with users I was able to identify the customer problem, problem statement, and user personas.
I made the application more accessible with larger buttons, easier to reach navigation, and simple pop-ups to request and accept shift coverage,
View Prototype
Is hard to navigate with confusing buttons, requires users to move through many pages to achieve something that should be simple, is so frustrating that some users email managers instead of logging changes in the app.
Problem Statement
How might we make it easier for employees to view their work schedules and make changes to their hours?
User Personas
I based each of these user personas off of co-workers after I realized that most of the part-time employees fit into two main categories.
Works >15 hours per week
Uses time off requests to take advantage of extended school holidays
Focuses primarily on her hours and schedule
Maggie
Age: 22
Location: Richmond
Occupation: College Student and Anthropologie Associate
Devices:
User Story
Behaviors
Needs
As a part-time cashier, I want to quickly check my future work schedule, so I can plan my time off.
Easy access to her schedule
Reminders of her shift coming up
Fast way to add her upcoming shifts to her other calendars
This user was frustrated by the number of steps that needed to be taken to see a larger number of scheduled days. The user also disliked the amount of uneccesary information on each of the pages.
Nancy
Age: 65
Location: Richmond
Occupation: Retired Nurse and Anthropologie Associate
Devices:
User Story
Behaviors
Needs
As a part-time fitting room attendee, I want to change my availability, so I can be available to go on a trip.
Works >10 hours per week
Struggles with mobile systems and smaller fonts
Travels frequently to visit family and to take advantage of retired lifestyle.
A fast and easy way to submit an availability change
An easy way to request someone to cover her shift
Clear information about if her request is approved.
Easy to read application
This user was frustrated by the confusing process of changing availability. It was not clear which buttons needed to be selected and it was hard to know if you were selecting the correct day. She ould sometimes email her supervisor instead of using the app.
Round 1
During the first round of this redesign, I made small adjustments to the current week, monthly, weekly, and schedule change pages. I also added a pop-up features to make it easier for the user to quickly view their hours and to eliminate the number of steps that had to be taken,
I developed a design system based on the existing application.
Current Week
Weekly View
I changed the layout so that the entire day could be seen without needing to scroll. I also adjusted the day labels to make them more scannable.
Monthly View
I made the icons to indicate a shift larger and eliminated the different colors of the icons that had no purpose.
Pop-Up
Time Off Request
I added an all day feature to make it easier for users to take an entire day off.
Feedback
User E
“I just saw one icon, so I just clicked on here, but it is not clear to me what this is going to do… I did not like this icon because it is not giving me information about what it is going to do. It seems like a back icon to me"
User C
“I think I would love if there was a quicker way…you know how there are emails about people who need coverage and everything…I wish there was something in there so that we could put that in… and someone would say “dibbs” and then the manager would still have to do an approval”
User D
“I don’t think it should be an x icon, only because to me visually it makes me think I can close it out or get rid of this tab if I click it.”
Round 2
In the second design round, I focused more on making easier to recognize for new users, on adjusting the layout of the weekly/monthly page header, increasing the size of certain buttons and adding a faster shift coverage option.
Current Week
Adjust the arrow button to make it more clearly show that it will take the user to a monthly view and add a scrolling feature.
Weekly View
I increased the size of the navigation buttons and made the text larger.
Monthly View
Increase the size of the navigation buttons.
Pop-Up
I increased the size of the navigation arrow and added a way for the user to quickly and easily request coverage for a shift.
Time Off Request
The x on the availability shift page was misleading so I changed it to a sliding availability indicator.
User B
“It took me a second to realize its not like an infinite scroll and it won’t keep going”
User A
“I think the first time I interacted with this it was a different icon…. I really like this change! It is very very apparent that if I click on this I know it will move to the right and change the button. And I like now that after I do that then these come up and I can further customize my availability change”
User B
“I think what throws me off is when you get to the top menu… it feels all bunched to the right and the alignment is not the same for every line. Maybe you could try spacing it out all the way across”
User C
“I can see you have different color icons for picking up a shift and submitting coverage for other people, if these color codes could be reflected somewhere to show that this color is for this and this color is for that.”
Round 3
During the final round of the redesign process, I focused on accessibility with increasing the sizes of buttons, moving menus to the bottom so that they are easier to reach, and refining each stage of the process.
Current Week
Change the “My schedule” header to “this week” and include “weekly”, and “monthly” tabs.
Limit information to include 7 days.
Remove info icon and add another monthly view button to the bottom of the scrolling feature.
Weekly View
Remove the arrows on each shift bar.
Adjust the menu alignment and space things out more.
Shift the new request menu to the bottom to make it easier to reach and to open up the top of the page.
Monthly View
Add a color key at the bottom to indicate what each color square means to new users.
De-clutter the monthly view page by removing extra icons and moving the menu to the bottom.
Have the current week, monthly, and weekly view as tabs at the top.
Pop-Up
Add information about manager approval to make sure that the shift coverage is approved by the manager
Time Off Request
Remove one of the added screens to confirm changes and add a pop up that says your availability request was submitted instead.
Old Version
New Version
