Scenario introduction
It is a Sunday evening, and Anand is tired and hungry, after a long weekend of partying. Anand is a sophomore at MIT. He is burdened by his homework in 6.813, and needs to start PS2 soon. He lazily contemplates doing it, until he remembers that he can't think really straight unless he is full, so he decides to go to his favorite restaurant, Cinderella’s. He is really craving some Italian food today. When he arrives at the restaurant, he is seated by the host. The sign at Cindrella's says that the restaurant is newly enrolled in menu.io, and beta-testers can open up it up on their phone. Glad he signed up to be a beta-tester a month ago, Anand does not take the traditional menu from the containers available at the side of his table and opens up menu.io on his phone as he gets ready to decide what to order.
...
Task 1: Selecting a Restaurant
Design Selection: Search Bar
Scenario Part 1
Anand goes to menu.io and sees the search bar to find restaurants. He types in “Cinderella” because he does not feel like searching for the apostrophe on his mobile keyboard. Once he types in Cinderella, he is presented with a list of options. Because he is at Cindrella’s he picks it and not the other option of Cindrella Louveaunt, the French restaurant in Dorchester, MA. He is then presented with Cinderella’s main page with the menu attached to the bottom of page with several categories.
...
Task 2: Filtering the menu
Design Selection: Checkbox approach
Scenario Part 2
Anand wants to try some new food at Cinderalla's. Today, he's in the mood for pasts. He scrolls down to the menu, and sees the filter button. He clicks on the filter button and is presented with a standard checkbox filter. The checkbox filter has two different kinds of filters to be applied: ingredient-specific and item-specific. Because he wants be presented with vegetarian options (since he is vegetarian), he checks the vegetarian box. Next, he wants only pastas to appear. Currently, the item-specific box is checked All so all items appear. He unchecks All, and then checks Pasta-only, so only pasta’s appear. Then, he hits the back button, and return returns to the menu.
Learnability: The filter is learnable because most people are familiar with the checkbox affordance. They know the checkbox represents a choice, and can use it to turn certain features on and off. Some users might find it hard at first to understand the item-specific approach. With some iterations, however, they will get it right.
...
Safety: This design is safe in that errors are recoverable. If the user applies the wrong filter, the user can return, and fix the filter. Errors are also few because the checkboxes are clearly specified. However, it can be hard to the user to check what filters he has applied, if he applies the wrong filter. It may be hard for the user to distinguish between filters such as vegetarian or vegan, if the user applies one or the other by mistake.
Task 3: Viewing the menu
Design selection: Standard grid approach
Scenario Part 3
The menu is laid out in a grid. After filtering, the pastas are the only option left on the menu. Anand selects pastas, and is presented with a selection of vegetarian pastas. He selects mushroom raviolli, checks the ingredients, description, spicy and salty factors and is content. He then calls the waiter over to order.
...
Task 1: Selecting a Restaurant
Design Selection: GPS
Scenario Part 1
As soon as Anand opens up menu.io, the app presents him with 3 different options: Cinderella’s, Toscanini’s, and Desi Dhaba. These options are found through the GPS feature of Anand’s phone. These are the closest restaurants that use menu.io, based on Anand’s current location. Anand sees that if he wanted to explore another restaurant's menu, he could press the "Choose another restaurant" button. Anand selects Cinderella’s, and sits down to view the menu that the app has generated for him.
...
Safety: This design is not very safe, especially if there are GPS issues with the phone. This requires users to type in the restaurant that they are eating at, which causes an efficiency issue.
Task 2: Viewing the Menu
Design Selection: Icons on top with details in the center.
Scenario Part 2
The app presents Anand with a row of icons at the top of the screen. He can scroll back and forth between items and the center item is reflected in a larger detail view in the center of the screen. He is able to see a picture of the item along with price, details, and ingredients. Anand really likes that he is able to see up close what he wants to eat, because he is feeling hungry so he skips over all of the options which look like a small portion. Presented with all this information, Anand is able to make a much more educated choice about what he wants to eat.
...
Task 3: Filtering the Menu
Design Section: Drag filters to menu
Scenario Part 3
Anand is a vegetarian, and is usually frustrated that he has to scroll through all of the pastas to find the vegetarian ones. He decides to use the filters provided by menu.io. The filters are shown on the bottom of the screen, and he drags the vegetarian filter onto his menu view, and all of the non-vegetarian dishes disappear. He also knows he wants to eat pasta, so he drags the pasta filter onto his menu. If Anand ever wishes to remove one of the filters he has placed on his menu, he could click the corresponding filter on a new dialog that has opened on the top of the screen.
...
Task 1: Selecting a restaurant
Design selection: QR code
Scenario Part 1
When Anand opens up the app, he is greeted by the welcome screen to menu.io. A waiter points him to the QR code at the center of his table. Anand touches the “Scan QR Code” button and a QR reader appears. He scans the QR code which immediately pulls up the main page for Cinderalla’s. Anand touches the menu button to pull up the Cinderalla’s menu.
...
Safety: Sometimes QR scanners cannot locate the code because the angle is bad or the code is too far away. Assuming the restaurant places the codes in an appropriate location, the QR reader would be very safe because it would load the correct menu.
Task 2: View the menu
Design selection: Modified Lazy Susan/Scroll wheel
Scenario Part 2
The first page of the menu displays the different categories of food at Cinderalla’s: pasta, pizza, appetizers, drinks, salads, and more. Sample pictures of these categories are displayed in a circular around the main stage. The main stage displays the highlighted picture at the very top.
...
Task 3: Filter/compare the menu
Design selection: Comparison grid/table
Scenario Part 3
After clicking on the basket to compare his options, Anand is greeted by a screen with a large stage in the middle with three places to drop entrees. His choices (mushroom ravioli and fettuccine alfredo) are sitting at the top of the stage. He sees that if he decides he doesn’t want a dish he can always drag it into the trashcan in the upper right-hand corner to remove it from his basket. He also sees that if he wants to keep searching the menu he can click the menu button in the upper left-hand corner.
...