WorkForce Website
Scheduling Website for Restaurants
WorkForce is a restaurant-scheduling website. It has a simple system for scheduling its personnel. This website also has a feature that allows you to notify everyone in your team when a new schedule is released. WorkForce makes scheduling simple, straightforward, and stress-free.
Project duration:
March 2022 to April 2022
The Problem:
The available online service has an extremely stressful and complex framework for creating personnel schedules. The majority of people who need to use this for better management are left out.
The Goal:
Create a user-friendly WorkForce website by providing easy navigation and a quick scheduling process with a stress-free user flow.
My Role
UX designer leading the WorkForce website design
Responsibilities:
Conducting interviews, paper and digital wireframing, low and high-fidelity prototypes, usability testing, accessibility considerations, iterating on designs, and responsive design.
Understanding the user
User research: Summary
To better understand the target user and their needs, I conducted user interviews, which I subsequently turned into empathy maps. I noticed that many target users regard scheduling as having high difficulty, indicating that they dislike making it; nevertheless, some of them did express the belief that there must be an easier way to do it. Many Scheduling websites, on the other hand, are intimidating and difficult to browse, which frustrates many target customers. This made an otherwise simple experience difficult for them, negating the objective of sticking to a timetable.
User research: Pain Points
Experience
Websites for online scheduling do not provide an enjoyable surfing experience.
.png)
Interaction
Small buttons on scheduling websites make item selection difficult, leading to errors and abandonment.
Navigation
Scheduling websites have a lot more options for providing more services, but this makes navigation more difficult for users.
Persona: Ken Withall
Ken is a manager at Sandwich Shop in Hamilton. He believes that new technology should make work easy. He wants to make all his employees happy and flexible with their schedules.
.png)
User Journey Map
Mapping Ken’s user journey revealed how helpful it would be for users to have access to a dedicated WorkForce Scheduling website.
Starting The Design
Sitemap
Users' frustration with website navigation was a major source of frustration, therefore I used that information to construct a sitemap.
My goal was to develop strategic information architecture decisions that would improve the overall navigation of the website. The framework I chose was created with the goal of making things simple and straightforward.
Paper wireframes
After that, I drew paper wireframes for each screen in my app, bearing in mind the user's navigation, browsing, and checkout flow pain points.
The home screen paper wireframe modifications to the right are centred on improving the user's browsing experience.
Paper wireframe screen size variation
Because WorkForce's customers use a variety of devices to access the site, I began working on designs for additional screen sizes to ensure the site was fully responsive.
Digital wireframes
It was simple to see how the redesign could assist solve user pain points and improve the user experience by switching from paper to digital wireframes.
An essential factor of my plan was to prioritize relevant button positions and visual dashboards on the home page.
.png)
Digital wireframe
screen size variation(s)
Desktop Version
Mobile Version
.png)
Low-fidelity prototype
I integrated all of the panels involved in the major user flow of adding and scheduling an employee, as well as the Publishing schedule, to produce a low-fidelity prototype.
Members of my team had given me input on my designs at this point. I made it a point to pay attention to what they had to say, and I put a few of their suggestions into action in locations where they were needed.
Usability study: Parameters
Study type:
Unmoderated usability study
Location:
Hamilton, ON Canada
Participants:
5 participants
Length:
15-20 minutes
Usability study: Findings
Finding
Users Can not find
The total number of employees they have.
Finding
Inserting back
Buttons at
Signing Up Pages.
Finding
Changing some Texts
With Icons to
Make it more clear.
Refining the Design
Mockups
I made improvements to the personnel scheduling based on the findings of the usability study. I added a name button that displays the total number of employees a user has in the system. This changes after you join someone.
Before Usability Study
After Usability Study
Mockups
Based on the insights from the usability study, I made changes to improve the site’s Navigation. I changed Some text buttons to Icons, I changed “copy” and “print” with new icons.
Before Usability Study
After Usability Study
Mockups: Original screen size
User find out all the information about the website.
User Add employee at this stage.
User find out all the information about the website.
Mockups: Screen size variations
Based on my prior wireframes, I included considerations for other screen sizes in my mockups. I believed it was critical to optimize the surfing experience for a variety of device sizes, such as mobile and tablet, to ensure that consumers had the best possible experience.
High-Fidelity Prototype
My hi-fi prototype followed the same user flow as the lo-fi prototype, and it featured design improvements made following the usability study, as well as a few suggestions.
View the WorkForce
High_Fidelity_Prototype
Accessibility Considerations
I used landmarks to assist users who use assistive technologies in navigating the site.
I built the site with alt text on every page for easy screen reader navigation.
For a clear visual hierarchy, I used headings with various-sized text.
Going Forward
Takeaways
Impact:
Our target users said the design was easy to browse, that the visuals were more engaging, and that there was a clear visual hierarchy.
What I Learned:
I discovered that even minor design changes can have a significant influence on user experience. The most significant takeaway for me is to always keep the user's real demands in mind when developing design concepts and solutions.
