Restaurant Payment System

 

Cognitive Walkthrough

 

We attempt to solve the problem of bill-splitting at a restaurant by providing an IPhone application, called IPayr, that can act as a bill-splitting calculator. It will have access to the bill, and allow users to manipulate items and amounts to allow for payment appointment.

To load all the prices and items, the user must enter a paycode. Users then split the bill using one of two modes. In the "divide bill evenly" mode, users review a set of default choices (15% tip, 4 customers), adjust them if necessary, and then allow IPayr to calculate an amount for each customer. In the "split by items" mode, users drag customers to items to appoint who ordered what. This, plus the tip adjustment, again produces a calculated amount for each customer. Provided with the calculated owed amount, the users can then decide how they will assign who pays what.

Open the Payr application by pressing its icon on the iPhone

 

Front page

    p1

     

    Actions

    • To enter paycode:
      • Select the textbox under "Enter PayCode."
      • Enter the PayCode using the keyboard that pops up. 
      • Return to the front page after entering the PayCode.
    • If an invalid PayCode is entered(the PayCode does not refer to any receipt), red text will appear underneath the textbox "Invalid PayCode".The keyboard will not go away until a correct paycode has been added.
    • If a valid PayCode is entered(the PayCode represents a receipt), no error message is displayed. Press "Next" to get to receipt confirmation page

Evaluation

    • Will the users be trying to produce whatever effect the action has?
      • The user needs to know what the PayCode is and where it is located.  This is helped by the image of a receipt pointing to where the PayCode is located on the receipt.
      • The user needs to know that they must type in their PayCode. The "Enter PayCode" label should help with this.
    • Will users be able to notice that the correct action is available?
      • The user needs to know that they can type into the text box by touching it.
    • Once users find the correct action at the interface, will they know that it is the right one for the effect they are trying to produce?
      • The user needs to know to tap keys in order to get text to appear in the text box.  This is a standard convention on the iPhone and supported throughout the program.
    • After the action is taken, will users understand the feedback they get?
      • When the PayCode is invalid, the user is alerted through a direct message.
      • When the PayCode is valid, there is no feedback (perhaps this should be changed)

 

Receipt Confirmation Page

    p2

     

    Actions

    • If the receipt is correct(the receipt matches what the customers ordered), select
      • "Divide Bill Evenly" to go to Divide Bill Evenly page
      • "Split by Items" to go to Split by Items page
    • If the receipt is incorrect(the receipt does not match what the customers ordered), select "Reenter PayCode" to return to the front page

Evaluation

  • Will the users be trying to produce whatever effect the action has?
    • The user needs to know that they should compare their paper receipt to the receipt on the screen. 
  • Will users be able to notice that the correct action is available?
    • The user needs to know that they can scroll the receipt to see the full receipt.  This should be intuitive if the receipt is cut off.
    • The user needs to know the difference between the two methods of going forward.  The wording should help with this but might not be enough(?).
  • Once users find the correct action at the interface, will they know that it is the right one for the effect they are trying to produce?
    • The user needs to know how to progress forward or back.  The shapes of the buttons
  • After the action is taken, will users understand the feedback they get?
    • The user should see that the next page appears.

 

Divide Bill Evenly Page

    p3

     

    Actions

    • If the default settings are preferred, select "next" to continue
    • To change the tip amount, drag the scroller to the desired amount.
    • To change the number of customers paying, click on the drop down menu and select the new amount.
    • If any previous changes are desired, select "Back"
    • To return to default settings, select "Reset"
    • When all settings are set, select "Next"

Evaluation

  • Will the users be trying to produce whatever effect the action has?
    • At this stage, users are used to selecting a tip amount, so selecting a tip amount should be intuitive.
    • The drag down menu for selecting customer number allows them to change the number of people paying
  • Will users be able to notice that the correct action is available?
    • The slide bar looks draggable (due to its size and the shape of the slider), so selecting the tip amount should be intuitive.
    • The number of customers dropdown has a down arrow next to it so it looks like it can be edited.
  • Once users find the correct action at the interface, will they know that it is the right one for the effect they are trying to produce?
    • The interface only contains options for tip changing and customer number changing, so it should be easy for the user to confirm that they are editing the intended part
  • After the action is taken, will users understand the feedback they get?
    • As the tip slider is slid, the percent and dollar amounts are updated on the slider.  Additionally, the tip and total amounts update as the tip updates.
    • When the number of customers is changed, the total per customer is updated immediately.

 

Split by Item Page

    p4

     

    Actions(Basic Drag and Drop Functionality)

    • To map the customers to their orders:
      • Scroll through food items by dragging food items horizontally
      • Drag customer to his/her ordered item
    • If there are unclaimed (unpaid) items, then a pop up appears with the text "There are still unclaimed items!" push "ok" to go back and finish the selection.
    • To clear all selections, select "reset"
    • To return to receipt confirmation and select a new split mode, select "Receipt"
    • To continue, select "Tips"
    p8

     

    Actions(Advanced Functionality)

    • Click the menu item to view the list of customers paying for it.
    p9

     

    • Click the customer to view the list of menu items the customer is paying.
    p10

     

    • To split remaining items, select "split unclaimed items"
      • select the customers who will share the payment for unclaimed items and push "ok."
      • or, if everyone split the unclaimed items, select "select all" and push "ok."
    p5

     

    • To add/delete customer or edit customer name
      • click "Add customer" to add a customer.
      • click the customer button to change name or delete the customer.
        • enter the name of customer using the popped up keyboards.
        • delete the customer by pushing the "Delete customer" button.

Evaluation

  • Will the users be trying to produce whatever effect the action has?
    • The users need to know that they should drag the customer icon to the food item icon
    • The users need to know that the list of food items should be scrolled horizontally to access all the items on the receipt
    • The users need to know that they can check the results of their actions by clicking on a customer or a menu item
    • The users need to know that they can add or subtract customers from the customer list
    • The users need to know that they can assign items to customers and then split the remaining unclaimed items evenly between all customers
  • Will users be able to notice that the correct action is available?
    • The customer icons must communicate their clickability and their dragability
    • The food item icons must communicate that they can be scrolled horizontally as well as be clicked on
    • The Receipt and Tips buttons must communicate that clicking on them will take you to the previous screen or to the next screen
  • Once users find the correct action at the interface, will they know that it is the right one for the effect they are trying to produce?
    • When the user places their finger over the icon of a customer, the icon will change in a way that indicates it can be dragged or clicked
    • When the user places their finger over the list of food items, the list will change in a way that indicates that it can be scrolled through horizontally or clicked
  • After the action is taken, will users understand the feedback they get?
    • If the user tries to advance to the next screen before all items are attributed they get visual feedback that they have not completed all necessary tasks
    • When the user clicks, scrolls, or puts their finger on an item, the item either acts or changes its visual representation to show that the item can be acted on

 

Tips and Confirmation page

    p6

     

    Actions

    • Slide the bars to select the amount of tips to give.
    • If a coupon is present, then:
      • select the textbox under coupons.
      • enter coupon code using iPhone keyboard that popped up.
      • return to the main screen.
    • To return to "divide by items", select "divide by items"
    • To return to default settings, select "reset"
    • To continue to confirmation page, select "confirm"

Evaluation

  • Will the users be trying to produce whatever effect the action has?
    • The users needs to know how much tip they are paying and the total amount they are paying.
    • The users needs to know if the coupon is valid.
  • Once users find the correct action at the interface, will they know that it is the right one for the effect they are trying to produce?
    • When menuvering the slider, the tip amount in $ and in % appears. The total amount for each customer also changes as the slider is moved, therefore notifying the customer the amount paid.
    • If the coupon entered is not correct or is invalid, then a red note in asterisks appears "invalid coupon."
    • The user needs to know how to progress forward or back.  The shapes of the buttons
  • After the action is taken, will users understand the feedback they get?
    • The user should see that the next page appears.

 

Confirmation exit page

    p7

     

    Actions

    • If the correct amount owed by each user is shown, select exit to confirm bill distribution
    • If the amount attributed to each person is incorrect, select tips to return to the tips page

Evaluation

  • Will the user be able to confirm that each person is attributed their correct portion of the bill?
    • The user needs to be able to know that the amount shown for each person adds up correctly
  • Will users be able to notice that the correct action is available?
    • Users need to notice the Tips button/arrow in the lower left corner of the screen
    • Users need to notice the Exit button/arrow in the lower right corner of the screen
  • Once users find the correct action at the interface, will they know that it is the right one for the effect they are trying to produce?
    • Users need to know that the tips button will return them to the tips page
    • Users need to know that the Exit button will exit them from the program

 

© Copyright Team Chartreuse 2009