Project
MenuWise App Design
Role
Visual & UX/UI Designer
Duration
4 months
MenuWise is a mobile app for front-of-house training for restaurants, providing an efficient and customizable training platform focused on the well-being of employees and employers with the goal of providing paid training opportunities, resulting in faster fulfillment of open positions in the restaurant industry with the least effort.
PROBLEM STATEMENT
The restaurant industry has challenges like efficient training for employees and employers, and workplace exploitation and harassment.
SOLUTION STATEMENT
A customizable training platform can solve these challenges by prioritizing employee well-being, improving training processes, and boosting workforce productivity and engagement.
HYPOTHESIS
Traditional on-the-job training for food and beverage serving poses challenges. New hires lack compensation for time spent learning menus, ingredients, and job aspects, impacting engagement. Inexperienced hires face reluctance from coworkers due to physical demands, leading to inadequate training and higher turnover. Restaurants prioritize quick hiring over comprehensive training.
RELEVANCE
Drawing from my seven-year experience in the service industry, this project focuses on the challenges I faced, including unpaid training and exploitation as an immigrant worker. This highlighted the difficulties for new hires needing prompt payment and the pressure on employers to swiftly fill positions, resulting in added training responsibilities for workers. The objective of MenuWise is to explore how interactive training tools can boost employee engagement, productivity, and retention in the service industry.
STARTING WITH QUESTIONS
How might I streamline restaurant training for employers and employees via a mobile app?
How might I design a product that reduces employee exploitation in the industry?
How might I design customizable training programs for employers to suit their specific restaurant needs?
How might I create an app that provides a safe and inclusive environment in the restaurant industry?
INITIAL RESEARCH FINDINGS
At the beginning of this project, I conducted primary research to gain
a deeper understanding of the challenges faced by new hires in the service industry and to inform the development of this project.
The research methods used were participatory observation (observed and recorded interactions between employees, customers, and management) in a restaurant setting, also conducted surveys and semi-structured interviews with employees and employers to gain insight into their experiences and perspectives on training in the service industry.
SURVEY RESULTS
100% of the surveyors said that they were handed in a menu
and were told to study at home.80% of the surveyors think that studying the menu at home for free is not exploitation. However, they would love to be paid and it would be more encouraging for the basic training.
70% of surveyors left a note mentioning that training new hires is a burden for coworkers.
Results for “Have you ever been handed a menu and told that study the menu at home during your training?”.
Results for “Do you think that studying the menu at home (where you do not clock in and get paid for your training) is exploitation?”
I was wrong to assume that workers thought that they were exploited. These findings informed the project's development and implementation of interactive training tools.
EXISTING DESIGNS & MARKET RESEARCH
In the market research I conducted, I found out that all the employee training apps are for very broad industries. There is no app in the market specialized for restaurant industry.
The best app is Connecteam app in terms of branding, usability and practicality.
USER FLOW
In this project I focused on front-of-house employees as due to time constraints, I couldn't delve into back-of-house training, but I plan to explore opportunities and solutions for BOH in the future. Here are the employee and employer portals’ user flow, sketches and wireframes.
Employee
Employer
Employee flow sketches
Employer flow sketches
Employee flow wireframes
Employer flow wireframes
BRANDING
While I was working on digital wireframes, I designed the brand identity for MenuWise simultaneously. As branding was not the core of this app design project, I will not get into visual research for branding. In my visual research, I found that most of the restaurant industry-related apps use orange or red.
LOGO
The MenuWise logo is composed of the letters M and W in orange color. The M and W are creatively merged, forming a unified shape that is both unique and memorable, reminiscing a server waiting at the tables and carrying items. The logo represents the brand's primary mission to simplify the restaurant training process.
The logo has a modern and sleek design that is perfect for a mobile app.
COLORS
The MenuWise brand uses a distinctive color palette that is a combination of six colors. The white and light beige colors represent cleanliness and simplicity, which are essential values for the brand. The orange color represents warmth, friendliness, and hospitality, which are important for the brand's mission. The black color represents sophistication and professionalism, which are essential for a brand that deals with the restaurant industry. The bright yellow represents energy, enthusiasm, and optimism, which are necessary for a brand that seeks to simplify the training process. The bluish purple represents trustworthiness, confidence, and intelligence, which are crucial for a brand that aims to reduce the problems that plague the restaurant industry.
TYPOGRAPHY
Spoof Trial is the primary typeface. Spoof Trial is a modern and unique typeface that represents the brand's mission to simplify the restaurant industry. It is perfect for the brand's logo and headings.
Poppins is the secondary typeface. Poppins, on the other hand, is a versatile and readable typeface that is suitable for body text and subheadings. It has a clean and simple design that reflects the brand's values. Together, the two typefaces create a cohesive and consistent brand identity.
PROTOTYPING
The prototyping phase was the most challenging but fun part. While I was prototyping on Figma, some other questions come up such as:
How might I design different portal views and user flows for employees and employers?
How might I create a visual hierarchy while keeping my design sleek?
How might I insert some animations into my prototype?
USABILITY TESTING KEY FINDINGS
I conducted usability testing for the employee portal of the app.
During the usability testing of MenuWise, I gained valuable insights to enhance the user experience. Users encountered obstacles such as not understanding the need to clock out to unlock the portal and confusion with the "choose availability" feature on the schedule page. On the positive side, all users found the app easy to use and visually appealing. To improve, I plan to implement color coding for clocking out, increase opacity for the "locked portal," and reconsider the order of the schedule and availability pages.
User quotes highlighted the need for clearer instructions regarding clocking out. By addressing these findings, I aimed to create a more intuitive and user-friendly experience, streamlining front-of-house training and facilitating the fulfillment of open positions in the restaurant industry.
CHANGES IMPLEMENTED
The users were confused when they first saw the portal rather than the clock-out button. The visual hierarchy was fixed by better color use.
First iteration
Second iteration
The users were also confused about finding the availability section and mentioned that they wish they would be landed on the availability section first if they need to submit it to see their schedule.
First iteration
Second iteration
INTERVIEW KEY FINDINGS
I interviewed 3 restaurant owners to see what their needs are and to see if the flow I created was useful. From these interviews, I got valuable insights which are:
Employers would like to spend as little time as possible in building the portal and training.
Employers like to use templates because templates are time-consuming and easy to use.
CHANGES IMPLEMENTED
In the beginning, the solution looked like a customizable product would give users freedom. However, after conducting interviews with employers keeping customizable features of the app but giving the user the option of templates that are customizable ended up as a better design solution.
First iteration
Second iteration
