Layout Mockup - adayton1/budgeting-app GitHub Wiki

Start Screen

Start Screen

  • From here a user can sign up or sign in by clicking either Register or Sign In, respectively.
  • Users can also click Try It Out to go to the Home Screen. None of their budget data will be permanently saved.

Create Account Screen

create-account

  • This is arrived at by clicking the Register link on the start screen

Header

header

  • This header appears on every page once logged in
  • Edit Account link takes you to Edit Account screen
  • Sign Out link takes you back to start screen

Home Screen On First Sign-In

home-screen-no-budget

  • This is the home screen when a user first signs up and has no budget created.
  • All other pages can be accessed from here

Home Screen With Budget

home-screen-with-budget

  • This is the home page after a budget is created

Edit Account

edit-account

  • Arrived at from the link in the header
  • Clicking Save Changes takes you back to previous screen with changes to account saved
  • Clicking Cancel takes you back to previous screen without saving changes
  • Clicking Edit Password takes you to Edit Password screen

Edit Password

edit-password

  • This page is arrived at from the Edit Account screen
  • Clicking Save Changes takes you back to Edit Account and saves the password change if new passwords match and old password is correct
  • Clicking Cancel takes you back to Edit Account without saving any changes

Create Budget

create-budget

  • Arrived at from the Home Screen
  • Clicking Create adds the new budget and returns to the Home Screen
  • Clicking Cancel does not save the budget and returns to the Home Screen

Edit Budget

edit-budget

  • Arrived at from the Home Screen when a budget is displayed
  • Clicking Save Changes saves changes to budget and returns to Home Screen
  • Clicking Cancel does not save changes and returns to the Home Screen

Report Expense

report-expense

  • Arrived at from the Home Screen
  • Clicking Add with the Report Another checkbox unchecked adds the expense to the current budget and returns to the Home Screen
  • Clicking Add with the Report Another checkbox checked adds the expense to the current budget and loads a fresh Report Expense screen
  • Clicking Cancel does not save the expense and returns to the Home Screen

Report Income

report-income

  • Arrived at from the Home Screen
  • Clicking Add with the Report Another checkbox unchecked adds the income to the current budget and returns to the Home Screen
  • Clicking Add with the Report Another checkbox checked adds the income to the current budget and loads a fresh Report Income screen
  • Clicking Cancel does not save the expense and returns to the Home Screen