This is my final independent assignment for User Interface Design, a graduate level course at the University of Toronto. Thus, this project will focus on product design, branding, and evaluation.
Have you ever...
If you answered yes to any of the above, you're not alone.
I surveyed 34 people who ordered food in the last three months and interviewed three participants to better understand their food ordering habits. Below are my findings.
Half of the respondents
have experienced trouble deciding on what to order at restaurants due to decision fatigue from menus.
What do these popular review apps all have in common?
Apps today rate restaurants overall, but people are more interested in reviews for particular dishes.
When I am ordering food from a restaurant I want to know that the dish I have chosen is good before ordering so I can avoid buyer's remorse.
I want to spend my money on good food.
I want to reduce menu decision fatigue.
What if the dish is better elsewhere?
What if the portion size is too small?
What if the actual food is not as advertised?
I hope the dish is not too spicy.
People need a way to...
Help them decide what to order from a menu.
Find the best dish to satisfy their craving in their city.
Reduce disappointment when ordering food.
Key Insights & Ideation
Low Fidelity Sketches
I made my first drafts on Balsamiq to share my work easily over Zoom to collect feedback before proceeding to the next fidelity.
Formative Usability Testing
I shared my low fidelity work with two participants from my questionnaire who met the screening criteria of having recently ordered food in the last three months. Here are their initial impressions:
- Can you search for restaurants too?
- It's not clear how the random feature would work.
- What would an example of a category be? Should it be bigger?
- How does it ask for my location to tailor my searches to restaurants nearby?
- Does this search look for restaurants or dishes - or both?
- The layout looks like UberEats. I feel like with how big the images are, I would be scrolling a lot if I was casually browsing.
- Changed text in search bar to "Search plate or restaurant" and added search filters for users to select what they want to look for.
- Added a screen to explain to the user how the random feature works.
- Made the categories bigger with icons for easy scanning.
- Added screens to show asking for permission and icon for adjusting location.
- Made the dish images smaller and horizontal scroll to fit more categories on the home screen.
Dish Search Result
- I think it might be nice to have more than just one big image for the dish at the top? Maybe a way to explore an album.
- It's not clear what the search process before this page would look like.
- Is there a way to sort, filter or search through the reviews?
- What if I liked what I saw from reviews and wanted to order now?
- Can you interact with other people's reviews? I think the Reddit upvote system would be nice for seeing the most useful reviews first.
- Added more photo previews to the top and a button to see more.
- Added order now button to screen.
- Added screens to show the search and filtering process for search results.
- Added screen to show the search and filtering process for reviews.
- Added a thumbs up "Like" feature to vote on relevant reviews.
- I am curious about how the "see menu" and "order now" screens would play out. Does this have an ordering system?
- Can restaurants be saved somehow too? Like a bookmark?
- A map might be helpful at this point, when they are considering the restaurant? I see the distance, but I think showing a map would be even more helpful.
- Added a screen for menu and what order now would look like if pressed.
- Added a bookmark feature for restaurants.
- Added a map to the top of the screen showing where the restaurant is relevant to your current position.
- How do you select the dish and restaurant?
- Does the "back" arrow cancel the review?
- Added preceding screens showing how the restaurant and dish are chosen for review.
- If the "+" button on the navigation is tapped while on a dish screen, it will automatically fill out to the restaurant and dish on the page.
- Added a cancel button at top.
- Is this the only screen where you can see what dishes you liked? What if you liked a lot of dishes and want to search through them?
- What if I wanted to see all of my reviews? Or search through them to revisit an old one?
- Added a bookmark/love button to navigation bar to organize and revisit what the user saves.
- Added a button to "See All" reviews by the user.
- Looking at reviews written by user will follow similar structure to browsing all reviews for a dish.
The design system below outlines the brand colours, typography, icons, buttons styles, form fields and other components.
Sans Serif Fonts
Greater legibility and use of iOS system fonts for greater compatibility.
Yellow is the brand colour because it represents optimism, energy, joy, and happiness. It also has strong associations with food. The best foods are yellow (fries, hash browns, and custard to name a few).
The rounded logo font and choice of bright yellow as the brand colour evoke a fun, joyful and happy mood. This is appropriate because the ultimate goal of RatePlate is to make sure you're happy with your order.
Accessibility: WCAG Contrast Requirements
WCAG 2.0 level AA requires at least 4.5:1 and level AAA requires at least 7:1.
Businesses also benefit from RatePlate.
Businesses get valuable dish-specific feedback directly from customers.
Remove poorly rated dishes and uncover opportunities for new menu additions.
Track the quality of dishes over time and investigate any changes in quality like a new cook or supplier.
For example, if "too salty" is a common complaint for a dish, the restaurant can adjust accordingly.
RatePlate Business Dashboard Mockup
I also designed a mockup for what a desktop dashboard that analyzes customer feedback and generates actionable insights for restaurant owners might look like.
Next Steps & Future Considerations
Speak to Users Throughout
This was an independent assignment and although I was working alone, I quickly realized how important it is to not design in isolation. The best ideas come from speaking to people, probing their mental models and gaining insight from hearing different perspectives. Speaking to people should occur throughout the design process with primary user research and frequent usability testing.
The Power of Design Critiques
In our second last User Interface Design class, we had a design critique session where we presented our ideas and had the chance to receive critique from other designers. When you spend hours pouring over the same few frames, you can miss obvious problems. Whether it's getting a second pair of eyes on your design or building on each other's ideas with new perspectives, speaking to other designers throughout this project was highly valuable.