Prototyping

Restaurant app concept that allows users to check-in, choose their table, order, review, and pay.

Contributors: Heather Cuthbert, Kiran Nizami, and Alexandra McNally

Background

 

Our team was tasked with creating a restaurant app that allows users to check-in, seat themselves, view the menu, order, and pay. The users also needed to be able to ask for help at any time.

We started by ideating the user flow. We used Figma to collaborate these ideas and made a list of important sections and features that should be included in the app.

From there, we each created a storyboard and then shared our storyboards with each other. We chose to use the storyboard that encompassed the feel of the app we wanted and built our wireframes based on the storyboard concepts.

We recorded the wireframes with two interactions; the seating feature and the menu/ordering feature.

INFO691-Team7-Assignment1-UserFlow-04142021.png

User Flow

This was the initial user flow we ideated on before creating the storyboard. It illustrates the possible actions a user would make from the time they enter the restaurant to completing a survey after paying.

This app will also send information to the restaurant staff including chefs and servers, to communicate the needs of the user. Some interactions the app will have with the restaurant staff will be sending the food order to the kitchen and notifying the server if the user needs something, such as a drink refill.

Storyboard

Storyboard

From our user flow, we were able to create multiple storyboards. We asked for feedback from people outside of our team. The feedback was as follows:

  • The end product should have a system that fully details the restaurant’s side of this process, including what happens once the user chooses a table and sits down at the restaurant.

  • This app could provide the ability for a user to search for a restaurant and select a restaurant based on food type, geographical location, price range, etc.

  • This app should note that options can be entirely customized by the restaurant’s offerings.

  • Potentially, add an option for "eat in peace" where the app completely silences all other notifications.

This was the final version of our storyboard which became the basis for our wireframe.

 

Wireframe

Taking cues from our storyboard, we were able to create our wireframe. This video shows the interactions with the seating feature, and menu/ordering feature.

 
 
Capture.PNG

Reflection

Looking back on this process, our team realized the value of collaboration and feedback from others. Together, we were able to ideate many more ideas than we would have alone, which helped this idea come together quickly. This left us plenty of time to get feedback from both UX professionals and potential users of this app. Once we received the feedback, we were able to refine our wireframe to ensure the smoothest experience possible.

Previous
Previous

UX Writing

Next
Next

Usability Study