Page History

 
1) The login screen

 
2) The home screen, before a budget has been created

   
3) Editing a budget

   
4) Adding categories and amounts to the budget

 
5) The home screen after a budget has been
created and expenses have been added. There
are quick links to common features.
All tabs are now activated as well.

   
6) The budget editing page, where users can see how
much money has been allocated to each category,
and how much is unallocated.

   
7) Adding an expense. You may also add
multiple
expenses at once, or cancel one or all
of your
unsaved entries.

   
8) A summary page of budget categories and money spent in each.

   
9) Editing a previously saved expense

   
10) A pie chart depicting breakdowns of budget money by category.

   
11) The Share Budget page, where users
can see who
else can view their budgets and expenses.

   
12) Giving viewing permissions to another person.

 
13) Viewing someone else's budget.
Note that editing budget
and adding expenses have been disabled.

1. “Save” button in expenses was confusing for two of the three users at first. They did not realize that you could save many expenses at once and tried to save each expense sequentially (although caught on quickly)

Change the text of the button to “Save all” to increase learnability (what’s really interesting here is that this wasn’t a problem in paper prototyping, because users seemed to notice the “add another category” and deduce that the save button was for saving all the categories.  We should have done a better job of understanding the root of the confusion, rather than just doing the easy fix).

2. Toast messages that appeared when switching to viewing other’s mode and viewing your own did not provide enough feedback. 2 users said they did not notice it at all, the other instead noticed the text at the top of the screen.

Make the header text saying whose budget the user is viewing (user’s or other’s) more apparent, though this would give a large and potentially irritating header to the screen.  Could also flash a popup window as soon as the user started viewing someone else’s budget, rather than a toast message, which would be clearer (as it would be both larger and with a different color background).

3. The icon that lets users edit their budget total is not extremely noticeable. One user wanted to change his total, but had trouble figuring out how to change it.

Make the icon bigger.

4. Category picker text is too small.

Increase the text size (a reasonably easy fix).

5. When viewing someone else’s budget, the header in the category page still says “select row to edit”. This was confusing to the user because you shouldn’t be able to edit someone else’s budget. The icons are disabled, but that text makes it confusing.

Remove that instruction when viewing someone’s budget.

6. Pressing back more than two or three times (depending on the screen) brings user back to login screen, which was confusing.

This is a minor implementation bug that can (and should) be fixed in the next design iteration.

7. The Expenses tab was hard to find for 1 user (although the other two did not have difficulty).

We could try a different grouping of the tabs, maybe putting expenses in the 2nd layer, and use A/B testing to try to determine which is better. We can also try different icon designs for the Expenses tab to see if that would be more learnable.

8. One user thought you could edit an expense from both the summary screen and the edit screen

Change the label of “edit” to more explicitly state that it was an edit budget tab, not an edit expense tab.