...
Task: Creating an Order
Sketch:
Story:
This is the main starting page of the application. When a user wants to order a meal, they first pick a time slot. The time slot is the approximate time when the food will be ready for pickup. Each time slot closes 30 minutes before the delivery time to give the runner time to collect the money and pick up the food.
After selecting a time slot, a user will then add their order. Before doing so, they can see their previous orders as well as orders from other people. Instead of creating a new one, the user can simply tap the “+1” button to get the same thing. This list also displays who placed the order. This is useful when trying out new things.
If the user wants to add a new order to the time slot, they simply tap the “New Order” row in the list view. They then are shown a page where they can select the truck, their dish, and add any special instructions.
Learnability:
The UI is consistent with most iOS applications. There is a series of navigational views with a “back” button in the header. The user utilizes their existing knowledge of using iOS apps to guide themselves through the process. The biggest concern here is for new comers that are not familiar with how GroupOrder works. But even for them, the UI is so similar to other apps that they should not have a hard time using it.
Efficiency:
To make the interface more efficient, the user can simply tap the “+1” button that will place the same order for him. Additionally, a user can also select from a list of their previous orders instead of selecting the truck and the dish over again.
Safety:
If the user makes a mistake, they can always go back and edit their order or remove it entirely.
Task: Picking a Runner
Sketch:
Story:
After a user has added their order, they are asked if they are willing to be a runner. A runner will be the person that goes down to the trucks and picks up the food. They are presented with a simple three-option dialog box. This dialog is displayed after the user taps either the “Add order” or “+1” buttons.
Learnability:
The biggest concern here is that new comers may not be familiar with terminology. They may not know what a runner is. We will likely have to include some instructions if they have never been a runner before to help guide them.
Additionally, we could do something cool like if this is a user’s first time as a runner we pair them up with someone who has already done it before. That way, they can teach each other.
Efficiency:
The interface is pretty efficient. There are only three options to pick from. Changing your selection requires a bit more work (see the safety section below) but overall, even that is pretty straight forward.
Safety:
The main safety concern here is if the user accidentally taps “Yes” by mistake. Or, if they tap “Yes”, but then something else comes up and they can’t pick up the food. Their decision can be undone by tapping the “Runner” tab on the bottom of the application. The runner tab will show which time slots they are current the runner for. All they need to do is change their selection here.
Task: Collect Money
Sketch:
Story:
Once a timeslot closes, the runner will be sent a notification and asked to enter into a three part process: collect money, place orders, and notify eaters.
The screen above show the first part in this process. Notice the “dots” at the bottom of the screen indicating that this is the first in a three-part process. Runners can easily swipe back and forth between the steps.
In the first step, they are asked to collect money. A list is shown that displays how much easy person owes. It also lists the person’s location (typically their office number). The list is not sorted by the person’s name, but rather their location - thus making it easier for the runner to collect money from nearby eaters.
Once all of the names are checked off, the UI auto-advances to the next part in the process.
Learnability:
The UI is straight forward. There is a list of names with labels for their location, and the amount of money they owe. There is a “Got it!” button next to their name that the runner can use to keep track of who they have collected from.
Efficiency:
The interface is efficient by showing everyone in a single list. It also sorts the items by their location label, not their name. While this may not work in all cases, it will the runner track people down.
Safety:
The key concern here is accidentally indicating that a person has paid. This is easy to correct - all the user needs to do is hit the check box again and it will reverse the decision.
Task: Place Order
Sketch:
Story:
This is the second screen for the runner - indicated by the dots near the bottom of the UI.
The runner is now near the trucks and waiting in line. He needs to place the various orders at different trucks. This screen shows a list of the meals that need to be ordered organized by the truck. Once the runner places the order, he can simply tap a check box to help him remember which orders he has placed and which orders are pending.
Learnability:
The screen’s learnability is facilitated by its simplicity. The screen is simple a list of orders. The UI makes use of consistent iconography with a “checkbox” so it should be pretty obvious to new comers what is going on.
Efficiency:
To help the runner place orders more efficiently, all of the orders are organized by the truck. Therefore, all he needs to do is pick a line and just read off the list. As he reads, he can check off the orders.
Safety:
There really are no safety concerns with this UI. If the runner accidentally taps the checkbox on the wrong order, all he needs to do is tap it again to uncheck it.
Task: Notify Eaters
Sketch:
Story:
This is the last screen for the runner - indicated by the dots near the bottom of the UI.
Once the runner returns with the food, he is able to send out a notification to let everyone know that their food is ready. Obviously, the runner could personally deliver the food to each individual but that may be too much hassle. Instead, all the runner needs to do is type in where he is and tap “Notify”. A push notification will be sent to everyone who placed an order.
Learnability:
This screen is pretty self explanatory. It conforms to the typical iOS metaphors. To help guide new users, watermarked instructions will initially appear in the “location” text box. Once they tap on the textbox, the instructions will fade away.
Efficiency:
The text box on this screen defaults to the last submitted location. This is helpful if the runner always delivers the food to the same place - for example a lounge or kitchen area. Instead of typing in the location over and over again, all they need to do is tap “Notify”.
Safety:
*Given the fact that the text field defaults to the last message, a common error that may occur is that the runner just taps “Notify” out of habit and accidentally sends the wrong location. However, that is okay. The notification screen allows the runner to send out multiple notifications. If they make a mistake, all they do is send out another message saying, “Sorry - the food is actually on the kitchen counter”.*Alternate Scenarios
...