teatree design
SARA EIDELSHTEIN
Serving up independence in management tools
In a self serve era, customers are looking more and more for tools that allow them to manage their services without technical support. Our menu management redesign set out to provide an easy to use tool with efficiency and overall menu visibility at its core.
My role & responsibilities
SR. PRODUCT DESIGNER
-
Define pain points in the current tools
-
Conduct user research and outline areas of opportunity and goals of redesign
-
Plan information architecture for menu redesign
-
Design user experience
-
Run internal and external betas and iterate quickly for general release
-
Partnered with one product manager, 3 engineers, customer support, support and implementation teams, and the larger restaurant management design team
Campus dining
Not your average restaurant menus
University campuses are unlike regular restaurant dining businesses. Campuses have a complex dining ecosystem:
-
One dining management body in the university owns and manages all the restaurants within that ecosystem
-
Multiple cuisine types
-
Multiple methods of dining: dining halls, all you care to eat, retail, grab 'n' go, self serve, convenience
-
Multiple payment types: campuses have their own payment tenders
-
Many different types of users of different management levels
For our purposes, campuses are more than just universities, they can be any closed ecosystem: Stadiums, hospitals, hotels and resorts.
Menu management is often overlooked, namely the relationship between this management tool and our diner experiences. The tools used to manage menus directly impacts on the diner experience. A poorly built and updated menu results in a poor diner experience. That is why it's so crucial to give our campus partners a menu management tool that is easy to use and allows for them to maintain menus independent of our support teams.
The current tools
What are the issues
With campuses continuously asking to be able to do certain editing and setup functions on their own, it was decided to expose our internal tool created and used by our engineers as the backend method of menu management.
The had two tools in order to manage menus:
Basic Editor:
Menu tab in OneView management tool:
-
Iframe of the old OneView Menu tab: poor usability
-
Not structured in an easy to use way: breadcrumb structure for categories> items> modifier groups > modifiers
-
No overall view of the menu and the status of menu items: active, inactive, out of stock
-
Lacks many editing and create functionalities of the Advanced Editor
Advanced Editor:
An iframe within the iframe accessed in the Menu tab:
-
Iframe within an iframe: extremely poor usability
-
Not built for external usage: a legacy tool built by and for engineers
-
Confusing UI and extremely buggy
-
Permissioned access but still requires significant training: most users will not be able to use this tool due to risks of altering menus in a way that could incur significant financial loss
Around 1100 quarterly support tickets regarding menu updates
More than
30% of menu tasks can only be done by internal teams
Very poor NPS responses related to menu management
Menu requests continually delayed due to tech & product debt
Self serve a key business strategy
Project goal
70% reduction in menu management related support tickets and 15% increase in NPS responses.
The current tools are so problematic that users have stopped trying to use them and are relying on our internal teams to build and maintain menus for them.
With hundreds of campuses and thousands of shops to manage the quality of menus has deteriorated. Campuses know best how their menus should be structured and what the current status of items is but due to the complexity of our tools, they are unable to do this on their own. They complain about the need to contact support teams and the constant issues they face with the management tools.
Our internal teams are not able to keep up with the amount of menu requests and it is not financially sustainable to hire support teams for this purpose. If we do not provide a self serve tool, campuses will move to a provider that will.
Backing it up
User types research
We started the discovery process for this project by conducting thorough user research. There wasn't any documentation about the dining management body and I used this opportunity to outline all of our potential users and core user types. This research was helpful across many other design projects as well.
Campus Dining Ecosystem Diagram
Store Manager User Type card/core user type
User research
We started the discovery process for this project by conducting top task analysis in order to understand what users are doing within these two tools and what are the most “popular” actions being taken.
In addition, I planned and performed a round of user interviews in order to understand the problem in depth first hand. We also did thorough competitive analysis. And that included considering using Grubhub's menu management tool (not for campus).
Read more about my research findings >
Walkthrough of the menu management tools
Redesign for major pain points
Overall menu structure
Does this resemble a menu that you would order from? This is a very complex system. It is designed and functions in the way that the engineers built it, but users don’t need to understand how a menu management system functions, rather the management tool should mimic the actual menu ordering experience in a sense. Main menu screen should provide an expanded overview of the menu itself.
Activity status
Each shop needs an overall view of what’s the current state of active/out of stock (OOS) for items quickly. Campuses use these functions in varying capacities. For instance, just because an item is OOS doesn’t mean you don’t want to show it on the menu, you just want it to be marked as OOS so that diners know that this item will be returning to the menu. Similarly, just because you want to inactivate, or hide an item from the menu, doesn’t mean that you necessarily want to mark it as out of stock.
Stock settings
The current stock settings tool requires that users input a reset time in order to set a current stock limit. However, most campuses don’t know the exact restock times of most items. The stock limits function, would allow a much needed improvement in canceled orders occurring due to items going out of stock after a diner has ordered them but before the shop staff has had a time to recognize this and mark it out of stock.
Availability & scheduling
Instead of coming in daily, even hourly to set up if items are shown or hidden on menus, they could set this in advance and not need to do these daily or hourly changes to the menu. We actually have this function but users are mostly unaware of it or how to use it. If used, it would reduce their workflows less and make them much more efficient.
No mobile solution
Having a mobile design for menu in OneView will allow users to make changes and view shop menus on the go, providing them flexibility and efficiency that they currently don’t have
Needs outside support
Requires too much assistance in order to use the tools. The tools are not intuitive and too difficult to use. Intuitive self serve experiences would allow campuses to manage their menus quickly without wasting time by contacting support and trying to navigate the two outdated platforms
The design
Main menu table
New Menu tab will include the most used capabilities and improved UX:
-
Update menu tab to use OneView design system
-
Improved menu structure to give overall view of the menu
-
Improved state of activity functionality
-
Image previews in main table
-
Bulk save changes
-
Show when price differentiation
-
Export
The design
Editing drawer
Keep the main editing inputs from the basic editor with some adjustments:
-
Reorder inputs based on top task analysis
-
Copy improvements
-
4 new inputs based on top task analysis
-
Improved stock settings
-
Improved availability and schedule
Rollout strategy
Focused on maintenance
New menu tab will first implement the editing capabilities while adding the most used capabilities of the Advanced Editor allowing us to phase out its usage and make OneView Menu tab the one source for menu management.
This project will be broken down into stages and will allow users to continue use of the Advanced Editor while we build out the full functionalities of the new Menu tab in order to reduce friction and ensure we are building for our customers needs. We will focus on editing/menu maintenance behaviors in the first stage before moving on to setup and menu creation as well as the more advanced editing functions.
Train for success
Due to the complexity of menu management and that many of our users do not complete a majority of the tasks on their own currently, we built training resources into a key part of our rollout.
We built a complete menu training guide to walk users through how to use the new menu tab and reference at any point. We are running betas with key campus partners in order to collect feedback on gaps in our product training in order to better prepare our campus users.
Mobile solution
Editing on the go
-
Mobile menu is a frequent request (currently no mobile solution)
-
Include the main behaviors users are looking to do on mobile: Show on menu and OOS
-
Keeping these main behaviors in mind, create mobile friendly version by simplifying the information shown
Launch
Beta testing
The new menu tab was released for beta testing in April 2023. The first release included testing for internal users. I conducted usability testing sessions remotely- observing how our support teams would accomplish tasks I gave them after being introduced to the new menu tab.
After two weeks of internal testing and quick iterations on a few bugs that came up, we released to our external beta users- 10 campuses that agreed to work closely with us as design partners and share feedback. I also conducted usability testing and feedback sessions with these users. After synthesizing the findings, we made some small design tweaks to areas that weren't as intuitive as we wanted and planned release to general audience in June 2023.
Initial feedback from our beta users
Very self serve!
This will give a lot of independence in managing menus to the campuses. It’s great
It's very intuitive. It’s structured in the same way a user would expect the diner app to be so it will be very easy for merchants to understand how it works.
Really happy to see developed features that customers have been asking for for such a long time
The outcome
Impact of redesign
Within 6 months of launching the menu redesign we saw thousands of daily users increase self-serve capabilities and reduced support costs, including:
-
88% increase in user engagement in new tool over old tool
-
20 % reduction in actions by support team
-
50% reduction in support tickets YoY, resulting in saving 111 hours/month, potentially $32K annually
What did we learn?
Users want to do more!
The success of the new menu tool prompted the decision to further implement functionalities and tasks currently only done by support teams or reserved to the Advanced Editor, including:
-
Menu creation
-
Structural edits to menus
-
Copy, move, arrange menu items
-
Remove menu items
-
Migrate advanced settings