Menu and
Ordering App
This is a menu and ordering app designed for a modern pub that has a forgotten but important user group in mind: the older generations who have low confidence in using technology.
What
A pub, menu and ordering app that technophobes can use
Where
London, United Kingdom
When
May to June 2022
Role
UX Researcher and UX Designer
The Red Lion App
This project is part of my Google UX Design Professional Certificate. I was prompted to design a menu and ordering app for a modern pub. I completed the design process from the Empathise stage to the testing stage which gave me a holistic understanding of the UX design process. The journey included UX research, UI design and User Testing.
01
Competitor Audit
The use of menu and ordering apps in pubs exploded during the Covid-19 pandemic. Many of the chain pubs have well-designed apps, though there are some features that require more work. To get a better understanding of what users may want from a menu and ordering app I completed a competitor audit of chain pubs in the UK.
Greene King
Positives
Clear categories within the side menu
Knows in which pub the user is located
On-brand colour palette
Negatives
Busy, overwhelming home screen
Slow to load throughout the app
Very limited assistive technology
Wetherspoons
Positives
Simple, easy to use design
Menu filters, including vegetarian and vegan
Several methods of payment
Tutorial when first using app
Negatives
Limited use of imagery
Poor contrast in places
Information is wordy
Nicholson’s
Positives
Simple design that’s easy to navigate
Search feature available
Accessible design that includes assistive technology
Negatives
Some features are behind a log-in wall
Order lost if idle
Some text is very small and difficult to read
Youngs
Positives
On-brand, high-quality images
Navigation clearly labelled
Negatives
Log-in process frustrating
Most features behind a log-in wall
Most navigation is hard to reach when using one hand
Many pages linked to website
02
User Research
With a good understanding of current products, I spoke with people who occasionally visit the pub in 1-1, semi-structured interviews. The goal of the interviews was to better understand how users interact with a pub app and highlight the user's needs and pain points when using an app when ordering in a pub.
The semi-structured interviews generated a lot of data that guided the creation of empathy maps. These highlighted users’ frustrations and goals when using current menu and ordering apps. Along with the three pain points listed below, users felt current apps burdened them when ordering and that the enjoyment of being served had been lost.
Pain Point One
Downloading is Frustrating
Users get frustrated when they are asked to download an app to order in a pub. To simplify the process for the user I will design a web app so they do not need to download an app.
Pain Point Two
Information Input is Tiresome
Users did not like entering personal details, noting it was tiresome admin when they were meant to be having fun. I will limit personal information to a minimum and use payment options such as ApplePay and PayPal.
Pain Point Three
Lack of Confidence
Users fear that they won’t know how to use the app and will do something wrong when using it. I will ensure the app is simple and easy to use and have clear feedback to help build the users’ confidence in the app.
“If I order through the app I don’t want it to be more difficult than going to the bar”
03
Personas
Users were clearly frustrated with the technology and preferred having paper menus and bar staff taking their orders. To help understand these users, I built personas guided by the research I had already completed.
04
Wireframes
Now that I knew I wanted a simple design that helped build the users’ confidence in technology, I started to ideate. I started with paper wireframes, drafting several options for each screen and consolidating the best features from each into one design. I then transferred the design to a digital format using Figma.
05
Prototypes
My goal for the UI was to have a clean and classy design which aligned with what users expected as well as how gastro pubs portray themselves. As I progressed my designs from wireframes to prototypes I tested them with users. The goal of the usability tests was to understand whether users found the app simple to use and whether they could complete the process of ordering.
To aid familiarity, the colour palette replicated the white often seen on paper menus and a rich, royal blue that brings a tone of class to the design. The white also helps highlight the negative space that is used in abundance in the design which aims to help give a simple and clean feel. The goal within the UI was to avoid the users feeling overwhelmed by choices as they would already be frustrated having to use an app to complete their order.
Among other problems, the usability tests highlighted that some of the cues confused the users, particularly the wording of some Call to Action buttons. This was challenging as some users got stuck in places where others breezed through. I needed to include clear cues but keep the design clean.
The tests also highlighted the issues below.
Menu
Users found the menu design too busy so I made it simpler by removing the arrow cues and adding the ability to scroll up and down. I made it clear this was an option by having half a menu card visible before the fold.
The design was kept simple through a clear menu bar at the top of the page that listed the different categories of food and drinks. I also included a search bar as many users prefer to search when browsing options.
Customise Module
Users were confused about what actions were available on this module as they didn’t understand it allowed them to customise the dish they had just chosen.
To make this clear I made the ‘Plus’ button more prominent. I also animated the ‘Confirm Order’ button so ‘No Customisation’ was listed under ‘Confirm Order’. The button changed to ‘with customisation’ when something was added to the dish.
Review
This screen was well received by users for its clear design, helped by the hierarchy of the page which I achieved through different font sizes and typography styles. The negative space between each dish also helped the user easily read the list of items they had ordered. Additionally, the review screen helped to build users’ confidence, showing they have correctly added items to their order.
Final Screen
Users noted in my early research that it’s important they can trust the app. I achieved this trust by including clear feedback via the confirmation screen. The usability tests also highlighted users wanted clear cues to confirm the process was complete as they were concerned if they closed the screen the order would be lost. I added a supportive sentence to the final screen next to a ‘close’ button noting users can safely close the tab.
Impact
Impact
The impact of this app will allow older generations to confidently use an app to order food and drink in a pub. This goes beyond allowing older generations to drink in pubs. Pubs are central to local communities and where people socialise. If customers don't feel comfortable ordering then they will likely avoid the pub. Without a place to meet, people may not socialise which has an impact on a growing problem: loneliness. This app can help people feel more comfortable in a pub and therefore more comfortable meeting friends and socialising.
Next Steps…
Continue Testing
The main aim of this app is that it is accessible to all. I plan to keep testing the app to ensure all users can complete their orders.
Create On-boarding
To further build the confidence of the users I will design optional onboarding which will start when the app is opened.