Explore Dinemore
Maneesha Senaviratne

App

Dinemore

Dinemore app

Dinemore is a restaurant chain which serves mainly burgers, submarines, pizza’s and all other kinds of fast foods. It also serves a lot of local cuisines including rice dishes. Their services are focused on getting the foods served or delivered as quickly as possible.

Project Duration: July 2021 to September 2021

Problem: When ordering food, users have to go through many tasks in order to get their meal for the day and users with busy schedules are unable to manage the task in their day to day life.
Responsibilities: Conducting interviews, paper wireframing, digital wireframing, low and high fidelity prototyping, performing usability studies, accounting for accessibility and iterating on designs.
My role: UX Designer for the complete Dinemore Restaurant App.
Goal: To reduce the amount of time wasted when ordering, paying and getting meals.

User research summary

I conducted interviews with several individuals and created empathy maps in order to understand the users for which I’m designing the product for and also their needs. There were several types of individuals but a certain group stood out the most, and they were university students with part time jobs and working individuals who had busy schedules and therefore had trouble making their own food. There were also several other areas in which they thought an app might help them and the others in ordering food. Some of the areas were: waiting in queues for order placement and pickup/ delivery, restaurant menu browsing and also payments.

User pain points

1
Time
Students and working individuals have a very tight schedule and therefore is unable to prepare their own meals.
2
Unavailability
The busy schedules makes individuals make late orders and therefore at times the meals they want are unavailable.
3
Accessibility
Due to certain language barriers and disabilities, users expect platforms with accessibility features.
4
IA
Clustered menus take a lot of time when ordering a certain food item and at times makes it unable to find the meals.

User persona: Noah

Problem Statement: Noah is a hard working busy student who needs an easy to use and navigate, menu and payment app for a restaurant because he has to manage his limited time and focus more on his studies and part time job.
Maneesha Senaviratne

User Journey Map

Mapping Noah’s user journey showcased how helpful it would have been if there was a dedicated Dinemore Restaurant App to order and make payments.
Maneesha Senaviratne

Paper Wireframes

Several iterations of drafts for each screen was done until the best fitting design solution was found so that it aligns with the project goals. The image on the right shows five iterations for the home screen and the one which was finalized. The stars indicates the chosen components in the wireframe which was included to the final version.
Maneesha Senaviratne
Maneesha Senaviratne

Digital Wireframes

In the initial design phase, I made sure to focus on the user research findings and feedback.
Maneesha Senaviratne
Easy navigation and addition of the feature of language change as part of the use of accessistive technologies.
Maneesha Senaviratne

Low fidelity prototype

The wireframe screens connected with each other for the main and sub user flows so that the wireframe link can be shared to the users in order to perform a usability study. View prototype.
Maneesha Senaviratne

Usability study findings

I conducted two round of usability studies. In the first study, I used the app wireframes in order to guide those wireframes into mockups. For the second study, I used the mockups to pin point and identify where the design needed refining.
Round 1 findings
1. Users wanted more clearer cues when choosing meals.
2. Users wanted confirmation screens in certain areas.
3. Users wanted more clear cues when creating meal templates for themselves.
Round 2 findings
1. The users wanted an option to create meal templates just after an order.
2. Visible naming for all navigation bar items even when not selected.

Mockups

Early designs allowed for customization, but after the first set of usability studies, I added a confirmation screen just after the template creation process to let users clearly know that they have successfully created a new meal template.
Maneesha Senaviratne
The second usability study revealed that users had trouble navigating through the bottom navigation bar in the first time. Therefore, I changed the design so that the navigation icons have their labels even when they aren’t selected.
Maneesha Senaviratne
Maneesha Senaviratne
Maneesha Senaviratne
Maneesha Senaviratne

High fidelity prototype

The final high-fidelity prototype showcases cleaner and easy-to-use user flows for menu browsing, ordering a meal, checking out and the meal template creation process. View prototype.
Maneesha Senaviratne

Accessibility Considerations

Language change support feature is added to the design so that users language barriers navigating through the app can read content with ease.
Used clear and simple icons to make the navigation process easier for everyone. Labels were also included to guide users within the app.
All meals have the area to provide detailed information so that users can choose any meal item after reading without hesitation.

Takeaways

Impact:
The Dinemore app focuses on keeping users at the utmost center in order to meet their needs and live up to their satisfaction.

One quote from peer feedback:
“The app is fun, engaging and most importantly it features methods to save loads of time which helps busy people like myself. I would definitely use this app and recommend it to people to try it out.”
What I learned:
The first ideas once I started designing were just the start of a much larger process. Interviews, empathy maps, usability studies and peer feedback influenced almost each and every part of the app’s designs.

Next Steps

1
Conduct another round of usability studies to verify whether the pain points which were found earlier had been addressed and as a result improved the overall experience.
2
Conduct additional research and interviews in order to identify other new/ existing problems with menu and payment apps.
3
Conduct research, identify and add new and necessary accessibility technologies to the mobile app design so that more users can use the mobile app with ease.

Hope you enjoyed it!