Banking

User Interface Design
27 November 2007 11:27:14

Copyright © 2007 Caretta Software Ltd All rights reserved

Banking.pdf

Project: Banking

Contents
1. START HERE 2. BalanceInfo 2.1. BalanceInfo 2.2. "Balances" Web Panel 3. Footer 4. Header 4.1. Header 5. LeftMenu 5.1. LeftMenu 6. _BLANK 7. DirectDebits 7.1. DirectDebitsStart (Design) 7.2. DirectDebitsView (Design) 8. LoggedOut 8.1. LoggedOut 9. LogIn 9.1. LogIn 9.2. Error Message 10. LogOut 10.1. LogOut 11. MoveMoney 11.1. MoveMoney 12. OtherServices 13. Payees 13.1. PayeesStart (Design) 13.2. PayeesView (Design) 13.3. PayeesView_Pending (Design) 13.4. PayeesAmend (Design) 13.5. PayeesAmend_Pending (Design) 13.6. PayeesConfirm_Pending (Design) 13.7. PayeesConfirm (Design) 13.8. PayeesAmended (Design) 13.9. PayeesCancelled (Design) 14. Payments 14.1. PaymentsStart (Design) 14.2. PaymentsConfirm (Design) 14.3. PaymentsProcessing (Design) 15. Pending 15.1. PendingStart (Design) 15.2. PayeesView_Pending (Design) 15.3. PayeesAmend_Pending (Design) 15.4. PayeesConfirm_Pending (Design) 15.5. PayeesAmended (Design) 15.6. PayeesCancelled (Design) 16. StandingOrders 16.1. StandingOrdersStart (Design) 16.2. StandingOrdersView (Design) 5 6 6 7 8 9 9 11 12 14 15 16 17 18 19 20 21 22 23 24 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52

Page 2 of 103

Banking.pdf 17. Statement 17.1. Statement 17.2. Account Options 17.3. StatementAdvanced (Design) 18. Summary 18.1. Summary 19. DirectDebitsStart 19.1. DirectDebitsStart 20. DirectDebitsView 21. MoveMoneyProcessed 21.1. MoveMoneyProcessed 22. PayeesAmend 22.1. PayeesAmend 23. PayeesAmend_Pending 23.1. PayeesAmend_Pending 23.2. Day Of Month Options 23.3. Month Options 23.4. Year Options 24. PayeesAmended 25. PayeesCancelled 26. PayeesConfirm 27. PayeesConfirm_Pending 28. PayeesStart 28.1. PayeesStart 29. PayeesView 30. PayeesView_Pending 31. PaymentsConfirm 31.1. PaymentsConfirm 32. PaymentsProcessing 33. PaymentsStart 33.1. PaymentsStart 33.2. Day Of Month Options 33.3. Month Options 33.4. Year Options 33.5. Payee Options 33.6. Payment Account Options 34. PendingStart 34.1. PendingStart 35. StandingOrdersStart 36. StandingOrdersView 37. StatementAdvanced 37.1. StatementAdvanced 37.2. Month / Year Options 37.3. Statement Number Options 37.4. Day Of Month Options 37.5. Month Options 37.6. Year Options 38. StatementNormal 38.1. StatementNormal 38.2. Month / Year Options

Project: Banking 53 55 56 57 58 59 60 61 62 63 64 65 66 67 68 70 70 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 85 85 85 86 87 88 89 90 93 95 95 95 96 96 97 98 99

Page 3 of 103

Table 40.1. Table 40.3.1.pdf 39. StatementResults 39. StatementResults 40. "Form Title" Rectangular Text Shape Project: Banking 100 101 103 103 103 103 Page 4 of 103 .2.Banking. Table 40.

START HERE Design File Last Modified Uses START HERE.pdf Project: Banking 1.gui 29 October 2007 13:12:19 Pages\LogIn.Banking.gui Page 5 of 103 .

gui Description A common pop-up window that appears on many pages when the user hovers over the information icon.gui 23 November 2007 15:12:47 Pages\Statement.gui Pages\StandingOrders\StandingOrdersStart.pdf Project: Banking 2. This one provides a note about displayed balances.gui Pages\Payees\PayeesAmend.gui Pages\Payees\PayeesView.gui Pages\Payees\PayeesView_Pending.gui Pages\Payments\PaymentsConfirm.gui Pages\DirectDebits\DirectDebitsStart.1. BalanceInfo Actions From BalanceInfo ID Condition Mouse Over Action Toggle Window Target "Balances" Web Panel Page 6 of 103 . 2.gui Pages\DirectDebits\DirectDebitsView.Banking.gui Pages\Payees\PayeesConfirm.gui Pages\Payees\PayeesStart.gui Pages\Payees\PayeesConfirm_Pending.gui Pages\StandingOrders\StandingOrdersView. BalanceInfo Design File Last Modified Used By Masters\BalanceInfo.gui Pages\Payees\PayeesAmend_Pending.

Banking.pdf Project: Banking 2.2. "Balances" Web Panel Actions From Close Button ID Condition Click Action Close Target Page 7 of 103 .

gui Pages\Payees\PayeesStart.gui 20 November 2007 10:02:52 Pages\_BLANK. Footer Design File Last Modified Used By Masters\Footer.gui Pages\Payees\PayeesView.gui Pages\StandingOrders\StandingOrdersStart.gui Pages\LogIn.pdf Project: Banking 3.gui Pages\MoveMoney\MoveMoneyProcessed.gui Pages\Payees\PayeesAmend.gui Pages\OtherServices.gui Pages\Payees\PayeesAmend_Pending.gui Pages\Statement.gui Pages\Payments\PaymentsProcessing.gui Pages\LoggedOut.gui Pages\DirectDebits\DirectDebitsStart.gui Pages\Pending\PendingStart.Banking.gui Pages\Payees\PayeesAmended.gui Pages\MoveMoney.gui Pages\DirectDebits\DirectDebitsView.gui Pages\Payees\PayeesConfirm_Pending.gui Page 8 of 103 .gui Pages\StandingOrders\StandingOrdersView.gui Pages\Payments\PaymentsStart.gui Pages\Payees\PayeesView_Pending.gui Pages\Payments\PaymentsConfirm.gui Pages\Summary.gui Pages\Payees\PayeesCancelled.gui Pages\Payees\PayeesConfirm.gui Pages\LogOut.

gui Pages\Payments\PaymentsConfirm.gui Pages\Pending\PendingStart.gui Pages\StandingOrders\StandingOrdersView.gui Pages\LoggedOut.gui Pages\Payees\PayeesAmend_Pending.gui Pages\Payments\PaymentsStart.gui Pages\MoveMoney\MoveMoneyProcessed.gui Pages\StandingOrders\StandingOrdersStart.gui Pages\Payees\PayeesConfirm.gui Pages\Payees\PayeesAmend.gui Pages\Payees\PayeesConfirm_Pending.gui Pages\Payees\PayeesView_Pending. Header Design File Last Modified Uses Used By Masters\Header.Banking.1.gui Pages\MoveMoney.gui Pages\Payees\PayeesStart.gui Pages\Payees\PayeesAmended.gui Pages\Payees\PayeesView.gui 4.gui Pages\DirectDebits\DirectDebitsView.gui Pages\LogIn.gui Pages\LogOut.gui Pages\Summary.gui Pages\Payments\PaymentsProcessing.gui Pages\Payees\PayeesCancelled.gui Pages\OtherServices.gui Pages\DirectDebits\DirectDebitsStart.pdf Project: Banking 4. Header Page 9 of 103 .gui Pages\Statement.gui Pages\_BLANK.gui 19 November 2007 21:44:03 Pages\LogOut.

pdf Project: Banking Actions From Text Link List : "Log Out" ID Condition Click Action Replace Top Window Target LogOut (Design) Page 10 of 103 .Banking.

Banking.pdf

Project: Banking

5. LeftMenu
Design File Last Modified Uses Masters\LeftMenu.gui 23 November 2007 20:55:28 Pages\Summary.gui Pages\Statement.gui Pages\Payments.gui Pages\Payees.gui Pages\StandingOrders.gui Pages\DirectDebits.gui Pages\Pending.gui Pages\MoveMoney.gui Pages\OtherServices.gui Pages\_BLANK.gui Pages\LogOut.gui Pages\MoveMoney.gui Pages\OtherServices.gui Pages\Statement.gui Pages\Summary.gui Pages\DirectDebits\DirectDebitsStart.gui Pages\DirectDebits\DirectDebitsView.gui Pages\MoveMoney\MoveMoneyProcessed.gui Pages\Payees\PayeesAmend.gui Pages\Payees\PayeesAmend_Pending.gui Pages\Payees\PayeesAmended.gui Pages\Payees\PayeesCancelled.gui Pages\Payees\PayeesConfirm.gui Pages\Payees\PayeesConfirm_Pending.gui Pages\Payees\PayeesStart.gui Pages\Payees\PayeesView.gui Pages\Payees\PayeesView_Pending.gui Pages\Payments\PaymentsConfirm.gui Pages\Payments\PaymentsProcessing.gui Pages\Payments\PaymentsStart.gui Pages\Pending\PendingStart.gui Pages\StandingOrders\StandingOrdersStart.gui Pages\StandingOrders\StandingOrdersView.gui

Used By

Page 11 of 103

Banking.pdf

Project: Banking

5.1. LeftMenu

Actions
From "Your Summary" Link "Your Statement" Link "Payments / Transfer" Link ID Condition Click Click Click Action Replace Top Window Replace Top Window Replace Top Window Target Summary (Design) Statement (Design) Payments (Design)

Page 12 of 103

Banking.pdf
"Your Payees" Link "Standing Orders" Link "Direct Debits" Link "Pending Payments" Link "Move Money" Link "Other Services" Link Click Click Click Click Click Click Replace Top Window Replace Top Window Replace Top Window Replace Top Window Replace Top Window Replace Top Window

Project: Banking
Payees (Design) StandingOrders (Design) DirectDebits (Design) Pending (Design) MoveMoney (Design) OtherServices (Design)

Page 13 of 103

Banking. _BLANK Design File Last Modified Uses Pages\_BLANK.pdf Project: Banking 6.gui Masters\LeftMenu.gui 31 October 2007 20:15:17 Masters\Header.gui Masters\Footer.gui Page 14 of 103 .

gui Pages\DirectDebits\DirectDebitsView.gui Pages\Pending\PendingStart. From there. Note: The flow for deleting Direct Debits has not yet been done.gui Description This shows the basic flow control for Direct Debit management. Page 15 of 103 .gui Pages\Payees\PayeesStart. Selecting a specific Direct Debit within the table takes the user to the details page for that Direct Debit.Banking. they can delete it. DirectDebits Design File Last Modified Uses Used By Pages\DirectDebits.gui 23 November 2007 15:01:30 Pages\DirectDebits\DirectDebitsStart.gui Masters\LeftMenu.pdf Project: Banking 7.

Banking.1.pdf Project: Banking 7. DirectDebitsStart (Design) Actions From DirectDebitsStart (Design) : "Insurace Company" Text ID Condition Click Action Replace Top Window Target DirectDebitsView (Design) Page 16 of 103 .

Banking.pdf Project: Banking 7.2. DirectDebitsView (Design) Actions From DirectDebitsView (Design) : "Previous" Web Button ID Condition Click Action Navigate Back Target Page 17 of 103 .

LoggedOut Design File Last Modified Uses Pages\LoggedOut.gui Masters\Footer.gui Pages\LogOut.gui 23 November 2007 15:02:39 Masters\Header.Banking. Page 18 of 103 .gui Used By Description At this point. the user is logged out and may either log back in or take advantage of the service offers being promoted.pdf Project: Banking 8.gui Pages\LogIn.

Banking. LoggedOut Elements # ID 1 Name Log In Image Description This replaces the "Log Out" link that appears on all other pages. Actions From Log In ID Condition Click Action Replace Top Window Target LogIn (Design) Page 19 of 103 .pdf Project: Banking 8.1.

Banking.gui START HERE.pdf Project: Banking 9.gui 23 November 2007 21:19:58 Masters\Header. LogIn Design File Last Modified Uses Pages\LogIn.gui Masters\Footer.gui Used By Description This is the Home page for Internet Banking where the customer logs into their online account.gui Pages\LoggedOut.gui Pages\Summary. Page 20 of 103 .

pdf Project: Banking 9. Submits the login information for validation."Clear" Web CLR Button 2 BTN-LOGIN."Submit" Web SBMT Button 3 TXT-SQ Security Question ¨ ¨ Place Of Birth Mothers Maiden Name User defined "Memorable Question" User defined "Memorable Answer" 4 EDT-SA Security Answer The user must enter the correct answer to the security question presented. LogIn Elements # ID Name Image Description Clears all security entry boxes and any error message so that the user can start from scratch.Banking. A random security question is presented from the following: ¨ ¨ 1 BTN-LOGIN.1. Actions From "Clear" Web ID Condition Action Hide Window Target Error Message BTN-LOGIN-CLR Click Page 21 of 103 .

Error Message Page 22 of 103 .2.Banking.pdf Button "Submit" Web Button BTN-LOGINSBMT Click AND Correct Details Hide Window Replace Top Window Click AND Show Window Incorrect Password or Security Answer Project: Banking Error Message Summary (Design) Error Message 9.

gui Masters\Header. Allow the user to confirm the log-out in case they clicked the link accidentally. It's purpose is to: 1.Banking.pdf Project: Banking 10. Remind them of their activity during the log-in session and allow them to verify any transactions or correct mistakes.gui Masters\LeftMenu.gui Pages\LoggedOut. 3.gui Used By Description Log Out links on all other pages arrive at this page.gui 20 November 2007 18:30:39 Masters\Header. 2. Subtly present the user with special offers before they log out so that they don't have to log back in again if they want to take up an offer. Page 23 of 103 . LogOut Design File Last Modified Uses Pages\LogOut.gui Masters\Footer.

It should include all account views. Actions From Log Out ID Condition Action Replace Top Target LoggedOut Page 24 of 103 .1. 10. This shows all of the logged activity during the current log-in session.Banking. LogOut Elements # ID 1 BTNLOGOUT#1 2 TBLACTIVITY Name Log Out Confirmation Activity Summary Table Image Description Confirms log out and performs the log out operation. payment or transfer transactions and any changes to the account.pdf Project: Banking NOTE: If a session timeout occurs then the user will be logged out without seeing this page.

pdf Confirmation "Log Out" Web Button "Previous" Web Button BTN-LOGOUT#1 Click BTN-LOGOUT#2 Click Click Window Replace Top Window Navigate Back Project: Banking (Design) LoggedOut (Design) Page 25 of 103 .Banking.

gui Masters\LeftMenu.gui Used By Description This page provides a quick and easy way for customers to move funds between their accounts. Page 26 of 103 .Banking.gui Masters\LeftMenu. Such transfers occur immediately after submission.gui Pages\MoveMoney\MoveMoneyProcessed.gui Masters\Footer.pdf Project: Banking 11. MoveMoney Design File Last Modified Uses Pages\MoveMoney.gui 23 November 2007 20:56:45 Masters\Header.

Banking. 56.Move Money AMT Amount ¨ ¨ ¨ ¨ ¨ 48.70 63. MoveMoney Elements # ID Name Image Description Decimal point entry is optional when the pennies are zero. The following are all valid entries: ¨ ¨ 1 EDT-MOVE.7 Actions From "Submit" Web Button ID Condition Click Action Replace Top Window Target MoveMoneyProce ssed (Design) Page 27 of 103 .00 56 56.0 63.1.62 56.pdf Project: Banking 11.

gui Used By Description This page contains links to services that are used infrequently by the customer and therefore don't need to be on the main navigation menu.gui Masters\LeftMenu.gui Masters\Footer.gui 23 November 2007 18:55:24 Masters\Header.Banking. Page 28 of 103 . OtherServices Design File Last Modified Uses Pages\OtherServices.pdf Project: Banking 12.gui Masters\LeftMenu.

gui Pages\Payees\PayeesAmend.pdf Project: Banking 13.gui Pages\Pending. Payees Design File Last Modified Uses Pages\Payees.Banking.gui Pages\Payees\PayeesAmended.gui 23 November 2007 18:56:58 Pages\Payees\PayeesStart.gui Pages\Payees\PayeesConfirm_Pending.gui Pages\Payees\PayeesView.gui Used By Page 29 of 103 .gui Masters\LeftMenu.gui Pages\Payees\PayeesAmend_Pending.gui Pages\Payees\PayeesCancelled.gui Pages\Payees\PayeesConfirm.gui Pages\Payees\PayeesView_Pending.

1. Note: Not all flows have been defined yet.Banking. 13.pdf Project: Banking Description This shows the flow for basic Payee management. PayeesStart (Design) Actions From PayeesStart (Design) : "Gas Company" Text PayeesStart (Design) : "Some Person" Text ID Condition Click Action Replace Top Window Replace Top Window Target PayeesView_Pendi ng (Design) PayeesView (Design) Click Page 30 of 103 .

PayeesView (Design) Actions From PayeesView (Design) : "Amend" Web Button PayeesView (Design) : "Previous" Web Button ID Condition Click Action Replace Top Window Target PayeesAmend (Design) Click Replace Top Window PayeesStart (Design) Page 31 of 103 .2.pdf Project: Banking 13.Banking.

3.Banking.pdf Project: Banking 13. PayeesView_Pending (Design) Actions From PayeesView_Pendi ng (Design) : "Amend" Web Button PayeesView_Pendi ng (Design) : "Previous" Web Button ID Condition Click Action Replace Top Window Target PayeesAmend_Pen ding (Design) Click Replace Top Window PayeesStart (Design) Page 32 of 103 .

Banking.pdf Project: Banking 13. PayeesAmend (Design) Actions From PayeesAmend (Design) : "Next" Web Button PayeesAmend (Design) : "Previous" Web Button ID Condition Click Action Replace Top Window Replace Top Window Target PayeesConfirm (Design) PayeesView (Design) Click Page 33 of 103 .4.

Banking.5. PayeesAmend_Pending (Design) Actions From PayeesAmend_Pen ding (Design) : "Next" Web Button PayeesAmend_Pen ding (Design) : "Previous" Web Button ID Condition Click Action Replace Top Window Target PayeesConfirm_Pe nding (Design) Click Replace Top Window PayeesView_Pendi ng (Design) Page 34 of 103 .pdf Project: Banking 13.

pdf Project: Banking 13. PayeesConfirm_Pending (Design) Actions From PayeesConfirm_Pe nding (Design) : "Previous" Web Button PayeesConfirm_Pe nding (Design) : "Submit" Web Button PayeesConfirm_Pe nding (Design) : "Cancel" Web Button ID Condition Click Action Replace Top Window Target PayeesAmend_Pen ding (Design) Click Replace Top Window PayeesAmended (Design) Click Replace Top Window PayeesCancelled (Design) Page 35 of 103 .Banking.6.

7.Banking. PayeesConfirm (Design) Actions From PayeesConfirm (Design) : "Previous" Web Button PayeesConfirm (Design) : "Cancel" Web Button PayeesConfirm (Design) : "Submit" Web Button ID Condition Click Action Replace Top Window Target PayeesAmend (Design) Click Replace Top Window PayeesCancelled (Design) Click Replace Top Window PayeesAmended (Design) Page 36 of 103 .pdf Project: Banking 13.

pdf Project: Banking 13.8.Banking. PayeesAmended (Design) Actions From PayeesAmended (Design) : "Your Payees" Web Button ID Condition Click Action Replace Top Window Target PayeesStart (Design) Page 37 of 103 .

PayeesCancelled (Design) Actions From PayeesCancelled (Design) : "Your Payees" Web Button ID Condition Click Action Replace Top Window Target PayeesStart (Design) Page 38 of 103 .pdf Project: Banking 13.Banking.9.

gui Masters\LeftMenu.gui 23 November 2007 18:57:49 Pages\Payments\PaymentsStart. Payments Design File Last Modified Uses Pages\Payments.Banking.gui Used By Description This shows the basic flow for setting up Payments.gui Pages\Payments\PaymentsProcessing.pdf Project: Banking 14.gui Pages\Summary.gui Pages\Payments\PaymentsConfirm. Note: Not all flows have been defined yet.gui Pages\Pending\PendingStart. Page 39 of 103 .

pdf Project: Banking 14.1. PaymentsStart (Design) Actions From PaymentsStart (Design) : "Next" Web Button ID Condition Click Action Replace Top Window Target PaymentsConfirm (Design) Page 40 of 103 .Banking.

pdf Project: Banking 14. PaymentsConfirm (Design) Actions From PaymentsConfirm (Design) : "Submit" Web Button PaymentsConfirm (Design) : "Previous" Web Button ID Condition Click Action Replace Top Window Target PaymentsProcessin g (Design) Click Replace Top Window PaymentsStart (Design) Page 41 of 103 .Banking.2.

Banking.pdf Project: Banking 14. PaymentsProcessing (Design) Actions From PaymentsProcessin g (Design) : "Account Summary" Web Button PaymentsProcessin g (Design) : "Make Another Payment" Web Button ID Condition Click Action Replace Top Window Target Summary (Design) Click Replace Top Window PaymentsStart (Design) Page 42 of 103 .3.

Page 43 of 103 .gui Pages\Payees.gui Used By Description This shows the basic flow for managing Pending Payments.gui Pages\Payees\PayeesAmended.pdf Project: Banking 15.gui Pages\Summary.gui 23 November 2007 19:00:24 Pages\Pending\PendingStart.gui Pages\Payees\PayeesView_Pending.gui Pages\Payees\PayeesCancelled. Pending Design File Last Modified Uses Pages\Pending.gui Pages\Payees\PayeesConfirm_Pending.gui Masters\LeftMenu.Banking.gui Pages\Payees\PayeesAmend_Pending.

1.Banking. PendingStart (Design) Actions From PendingStart (Design) : "Gas Company GC-1234567" Text ID Condition Click Action Replace Top Window Target PayeesView_Pendi ng (Design) Page 44 of 103 .pdf Project: Banking 15.

Banking. PayeesView_Pending (Design) Actions From PayeesView_Pendi ng (Design) : "Amend" Web Button PayeesView_Pendi ng (Design) : "Previous" Web Button ID Condition Click Action Replace Top Window Target PayeesAmend_Pen ding (Design) Click Replace Top Window PendingStart (Design) Page 45 of 103 .pdf Project: Banking 15.2.

Banking.pdf Project: Banking 15.3. PayeesAmend_Pending (Design) Actions From PayeesAmend_Pen ding (Design) : "Next" Web Button PayeesAmend_Pen ding (Design) : "Previous" Web Button ID Condition Click Action Replace Top Window Target PayeesConfirm_Pe nding (Design) Click Replace Top Window PayeesView_Pendi ng (Design) Page 46 of 103 .

pdf Project: Banking 15. PayeesConfirm_Pending (Design) Actions From PayeesConfirm_Pe nding (Design) : "Previous" Web Button PayeesConfirm_Pe nding (Design) : "Submit" Web Button PayeesConfirm_Pe nding (Design) : "Cancel" Web Button ID Condition Click Action Replace Top Window Target PayeesAmend_Pen ding (Design) Click Replace Top Window PayeesAmended (Design) Click Replace Top Window PayeesCancelled (Design) Page 47 of 103 .4.Banking.

PayeesAmended (Design) Actions From PayeesAmended (Design) : "Your Payees" Web Button ID Condition Click Action Replace Top Window Target Payees (Design) Page 48 of 103 .5.pdf Project: Banking 15.Banking.

PayeesCancelled (Design) Actions From PayeesCancelled (Design) : "Your Payees" Web Button ID Condition Click Action Replace Top Window Target Payees (Design) Page 49 of 103 .6.Banking.pdf Project: Banking 15.

From there.gui Masters\LeftMenu.pdf Project: Banking 16. Selecting a specific Standing Order within the table takes the user to the details page for that Standing Order. Page 50 of 103 .Banking. StandingOrders Design File Last Modified Uses Used By Pages\StandingOrders. they can delete or amend it. amending and deleting Standing Orders have not yet been done.gui Pages\Payees\PayeesStart.gui Pages\StandingOrders\StandingOrdersView.gui Description This shows the basic flow control for Standing Order management. Note: The flows for creating.gui Pages\Pending\PendingStart.gui 23 November 2007 15:01:30 Pages\StandingOrders\StandingOrdersStart.

StandingOrdersStart (Design) Actions From StandingOrdersSta rt (Design) : "Friends Of The Earth" Text ID Condition Click Action Replace Top Window Target StandingOrdersVi ew (Design) Page 51 of 103 .Banking.1.pdf Project: Banking 16.

Banking.pdf Project: Banking 16.2. StandingOrdersView (Design) Actions From StandingOrdersVi ew (Design) : "Previous" Web Button ID Condition Click Action Navigate Back Target Page 52 of 103 .

gui Pages\Summary. this page shows a statement including the most recent transactions of the last 30 days.gui Masters\LeftMenu.Banking. Statement Design File Last Modified Uses Pages\Statement.gui 23 November 2007 21:04:23 Masters\Header.gui Pages\Statement\StatementNormal.gui Masters\LeftMenu.gui Masters\Footer.pdf Project: Banking 17.gui Masters\BalanceInfo. Page 53 of 103 .gui Used By Description By default.gui Pages\Statement\StatementAdvanced.

pdf Project: Banking Options allow the date range to be changed so that the customer can examine the entire history of their account.Banking. Page 54 of 103 .

pdf Project: Banking 17. Statement Page 55 of 103 .Banking.1.

2. 2 Account Summary Displays summary information about the chosen account. Page 56 of 103 .Banking.pdf Project: Banking Elements # ID 1 CMBACCOUNT Name Account Choice Image Description Allows the user to select a different account to show a transactions statement for. Actions From Account Choice StatementNormal (Design) : "Show Advanced Options" Text ID Condition Action Modal Choice Popup Show Window Target Account Options StatementAdvance d (Design) CMB-ACCOUNT Click Click 17. Account Options Description Contains a list of all the user's accounts for which a statement can be provided. Different accounts may have been set up at different times so the available date ranges may differ between them.

StatementAdvanced (Design) Actions From StatementAdvance d (Design) : "Hide Advanced Options" Text ID Condition Click Action Close Target Page 57 of 103 .3.Banking.pdf Project: Banking 17.

gui Masters\LeftMenu.gui Pages\LogIn.pdf Project: Banking 18.gui Pages\Payments.gui Pages\MoveMoney\MoveMoneyProcessed.gui Masters\LeftMenu.gui Pages\Pending.gui 23 November 2007 15:11:15 Masters\Header. Page 58 of 103 .Banking.gui Used By Description This page is shown as soon as the user logs in.gui Pages\Statement. giving them a summary of their account balances and net worth. Summary Design File Last Modified Uses Pages\Summary. Selecting an account from the table displays the latest Statement of activity for that account.gui Masters\Footer.

1.pdf Project: Banking 18. Summary Elements # ID 1 TBLACCOUNTS Name Accounts Table Image Description This contains all of the user's accounts including their current balance and any Overdraft facilities set up on them.Banking. Shows a summary of the net worth of all the accounts and Overdraft facilities. 2 TBLAccount ACCOUNTS.Totals TTLS Actions From "Current Account" Text "Pending Payments" Text ID Condition Click Click Action Replace Top Window Replace Top Window Target Statement (Design) Pending (Design) Page 59 of 103 .

Banking.pdf Project: Banking 19.gui 23 November 2007 16:11:58 Masters\Header.gui Masters\Footer. there is no account choice box on this page. DirectDebitsStart Design File Last Modified Uses Pages\DirectDebits\DirectDebitsStart. Therefore.gui Masters\BalanceInfo. Lists all of the Direct Debits set up on the account. Page 60 of 103 . Customers can only have Direct Debits set up against a Current Account and may only have one Current Account.gui Masters\LeftMenu.gui Used By Description The starting page for Direct Debit management.gui Pages\DirectDebits.

Banking. DirectDebitsStart Elements # ID 1 TBL-DD Name Direct Debits Table Image Description Lists all Direct Debits set up on the account with the last payment amount and date for each.1. Page 61 of 103 . If no payment has yet been made on a particular Direct Debit then "-" is displayed for the amount and date.pdf Project: Banking 19.

gui Masters\BalanceInfo.gui Masters\Footer. The user may delete the Direct Debit from this page. DirectDebitsView Design File Last Modified Uses Pages\DirectDebits\DirectDebitsView. Page 62 of 103 .pdf Project: Banking 20.Banking.gui 23 November 2007 14:56:05 Masters\Header.gui Pages\DirectDebits.gui Used By Description The details view for a selected Direct Debit.gui Masters\LeftMenu.

Banking.gui Masters\Footer.gui Pages\MoveMoney. Page 63 of 103 . MoveMoneyProcessed Design File Last Modified Uses Pages\MoveMoney\MoveMoneyProcessed.gui Used By Description Displayed when money has successfully been transferred between user's accounts.pdf Project: Banking 21.gui Masters\LeftMenu.gui Pages\Summary.gui 23 November 2007 15:13:52 Masters\Header.

pdf Project: Banking 21.Banking. MoveMoneyProcessed Actions From "Account Summary" Web Button ID Condition Click Action Replace Top Window Target Summary (Design) Page 64 of 103 .1.

gui Masters\BalanceInfo.pdf Project: Banking 22.gui Masters\Footer.gui Used By Description This page allows the customer to amend the details of a Payee that they have previously set up for bill payments (or other payments).gui 23 November 2007 16:04:45 Masters\Header.gui Pages\Payees. In this case.Banking. Page 65 of 103 . there are no pending payments for this Payee.gui Masters\LeftMenu. PayeesAmend Design File Last Modified Uses Pages\Payees\PayeesAmend.

the Customer Reference should be the user's account number with that Payee.1. MANDATORY FIELD MUST NOT BE BLANK 2 EDTCUSTREF Customer Reference When paying a bill. This will appear on future statements for payments to this Payee and should match the name on the target bank account as closely as possible.pdf Project: Banking 22. When paying individuals.Banking.Questionable! Page 66 of 103 . MANDATORY FIELD .Questionable! MUST NOT BE BLANK . a meaningful reference should still be provided since this appears on Statements. PayeesAmend Elements # ID 1 EDT-PAYEE Name Payee Name Image Description The name of the Payee.

TO BE RESOLVED What should the user interface do if the amendment date restrictions are not met (as in the example Page 67 of 103 . In this case.pdf Project: Banking 23.gui Pages\Pending. Validation on all inputs occurs when the user hits "Next".gui Masters\Footer.gui Used By Description This page allows the customer to amend the details of a Payee that they have previously set up for bill payments (or other payments).Banking.gui Masters\BalanceInfo.gui 23 November 2007 21:06:24 Masters\Header.gui Masters\LeftMenu.gui Pages\Payees. there is a pending payment for this Payee and this may also be changed. PayeesAmend_Pending Design File Last Modified Uses Pages\Payees\PayeesAmend_Pending.

Since a payment will always be pending. PayeesAmend_Pending Elements # ID 1 EDT-PAYEE Name Payee Name Image Description The name of the Payee. This will appear on future statements for payments to this Payee and should match the name on the target Page 68 of 103 .1.Banking. Payment Type Option If a "Regular" payment is set up then this acts like a Standing Order.pdf case shown)? Project: Banking Annotations 5. 23. no further payments may be set up for this Payee until this one is cancelled or changed to a "One Off" payment and paid.

70 63.7 4 BTNPAYSTOP 5 RGOPAYTYPE "Stop Payment" Web Button Payment Type Option Requests to stop the pending payment and cancel any future payments if this is a "Regular" payment. Since a payment will always be pending. If a "Regular" payment is set up then this acts like a Standing Order.0 63.Questionable! MUST NOT BE BLANK . When paying individuals.pdf Project: Banking bank account as closely as possible. 56. the Customer Reference should be the user's account number with that Payee.62 56. MANDATORY FIELD . Actions From Payment Day Of Month Choice Payment Month Choice Payment Year Choice ID CMB-PAY-DAY CMB-PAYMONTH Condition Click Click Action Modal Choice Popup Modal Choice Popup Modal Choice Popup Target Day Of Month Options Month Options Year Options CMB-PAY-YEAR Click Page 69 of 103 .00 56 56. The following are all valid entries: ¨ ¨ ¨ ¨ ¨ ¨ ¨ 48. MANDATORY FIELD MUST NOT BE BLANK 2 EDTCUSTREF Customer Reference When paying a bill.Questionable! 3 EDTPAYMENT Payment Amount Decimal point entry is optional when the pennies are zero. no further payments may be set up for this Payee until this one is cancelled or changed to a "One Off" payment and paid. a meaningful reference should still be provided since this appears on Statements.Banking.

23.4.Banking. Page 70 of 103 .3. Month Options 23.2. Alternatives To Consider Always include 1 . "31 October" changed to "February") then the highest day of the month should be chosen instead. Day Of Month Options Description This must only includes days that are appropriate for the chosen month and year.31 and provide validation when the "Next" button is clicked since there must be some validation on Payment Date being today or in the future. If the user changes the month and the currently selected day becomes out of range (e.pdf Project: Banking 23.g. Year Options Description Must only contain the current year and future years up to the allowed limit of advance payment (3 years in this example).

gui Masters\LeftMenu.gui Used By Description Displayed when Payee details have been successfully amended.Banking.gui Pages\Pending. Page 71 of 103 .gui Masters\Footer.pdf Project: Banking 24.gui 23 November 2007 16:03:31 Masters\Header.gui Pages\Payees. PayeesAmended Design File Last Modified Uses Pages\Payees\PayeesAmended.

PayeesCancelled Design File Last Modified Uses Pages\Payees\PayeesCancelled.gui Pages\Pending.gui Masters\Footer. This confirms that no changes were made.gui Used By Description Displayed when amendment of Payee details was cancelled by the user. Page 72 of 103 .pdf Project: Banking 25.gui 23 November 2007 16:04:34 Masters\Header.gui Masters\LeftMenu.gui Pages\Payees.Banking.

gui Masters\LeftMenu. Page 73 of 103 .gui Masters\BalanceInfo.gui 23 November 2007 16:06:52 Masters\Header.pdf Project: Banking 26. The user must confirm that the changes are correct before they are applied.gui Used By Description Displayed when valid amendments of Payee details have been entered.Banking.gui Pages\Payees.gui Masters\Footer. PayeesConfirm Design File Last Modified Uses Pages\Payees\PayeesConfirm.

a pending payment has also been amended (or just the Payee details on a pending payment).gui Pages\Pending. The user must confirm that the changes are correct before they are applied.gui Pages\Payees. Page 74 of 103 . In this case.gui Used By Description Displayed when valid amendments of Payee details have been entered.gui Masters\BalanceInfo.Banking. PayeesConfirm_Pending Design File Last Modified Uses Pages\Payees\PayeesConfirm_Pending.gui Masters\LeftMenu.pdf Project: Banking 27.gui 23 November 2007 16:07:59 Masters\Header.gui Masters\Footer.

Banking. they are usually paid from a Current account.gui Masters\BalanceInfo.gui Masters\Footer.gui Used By Description The starting page for Payees management.gui Pages\DirectDebits. Page 75 of 103 .gui Masters\LeftMenu.gui 23 November 2007 16:46:23 Masters\Header. the Current Account balance is shown on this page. PayeesStart Design File Last Modified Uses Pages\Payees\PayeesStart. Therefore.gui Pages\Payees.gui Pages\StandingOrders. Although bill payments can be made from many different accounts. Lists all of the Payees set up on the account.pdf Project: Banking 28.

1. PayeesStart Elements # ID Name Image Description Lists all Payees set up on the account with the customer reference and the amount and date of any pending payments.Banking. 1 TBL-PAYEES Payees Table Actions From "Standing Orders" Text "Direct Debits" Text ID Condition Click Click Action Replace Top Window Replace Top Window Target StandingOrders (Design) DirectDebits (Design) Page 76 of 103 . NOTE: There can be only one pending payment at a time for each Payee.pdf Project: Banking 28. If there is no pending payment for a particular Payee then "-" is displayed for the amount and date.

Banking.pdf

Project: Banking

29. PayeesView
Design File Last Modified Uses Pages\Payees\PayeesView.gui 23 November 2007 16:17:14 Masters\Header.gui Masters\LeftMenu.gui Masters\Footer.gui Masters\BalanceInfo.gui Pages\Payees.gui

Used By

Description
The details view for a selected Payee. The user may choose to amend or delete the Payee details from this page.

Page 77 of 103

Banking.pdf

Project: Banking

30. PayeesView_Pending
Design File Last Modified Uses Pages\Payees\PayeesView_Pending.gui 23 November 2007 16:17:15 Masters\Header.gui Masters\LeftMenu.gui Masters\Footer.gui Masters\BalanceInfo.gui Pages\Payees.gui Pages\Pending.gui

Used By

Description
The details view for a selected Payee. The user may choose to amend or delete the Payee details from this page. This version shows the case when there is a pending payment for the selected Payee.

Page 78 of 103

Banking.pdf

Project: Banking

31. PaymentsConfirm
Design File Last Modified Uses Pages\Payments\PaymentsConfirm.gui 23 November 2007 16:51:54 Masters\Header.gui Masters\LeftMenu.gui Masters\Footer.gui Masters\BalanceInfo.gui Pages\Payments.gui

Used By

Description
Displays the details of a new or amended payment so that the user can check the details and confirm the payment.

Page 79 of 103

1.Banking.pdf Project: Banking 31. If the payment date is sufficiently into the future then the customer may be able to amend or cancel the payment later. 1 BTN"Submit" Web PAYSUBMIT Button Page 80 of 103 . PaymentsConfirm Elements # ID Name Image Description Submits the payment instruction for processing.

Banking. Page 81 of 103 .gui Pages\Payments. PaymentsProcessing Design File Last Modified Uses Pages\Payments\PaymentsProcessing.gui 23 November 2007 16:51:54 Masters\Header.pdf Project: Banking 32.gui Masters\Footer.gui Masters\LeftMenu.gui Used By Description Displayed once the user has confirmed a new payment.

gui 23 November 2007 21:10:02 Masters\Header.gui Used By Description The starting page for setting up a new bill payment to a Payee that has already been set up.gui Pages\Payments. Page 82 of 103 . Annotations 3.gui Masters\LeftMenu. no further payments may be set up for this Payee until this one is cancelled or changed to a "One Off" payment and paid.Banking. PaymentsStart Design File Last Modified Uses Pages\Payments\PaymentsStart. Since a payment will always be pending. Payment Type Option If a "Regular" payment is set up then this acts like a Standing Order.gui Masters\Footer.pdf Project: Banking 33.

if valid.62 56. Decimal point entry is optional when the pennies are zero. Page 83 of 103 .00 56 56.0 63.70 63. PaymentsStart Elements # ID Name Image Description Validates the payment entries and. The following are all valid entries: ¨ ¨ 1 BTN"Next" Web PAYVALIDA Button TE 2 EDTPAYMENT Payment Amount ¨ ¨ ¨ ¨ ¨ 48.1.pdf Project: Banking 33.7 3 RGOPAYTYPE Payment Type Option If a "Regular" payment is set up then this acts like a Standing Order. Since a payment will always be pending. no further payments may be set up for this Payee until this one is cancelled or changed to a "One Off" payment and paid.Banking. 56. displays a confirmation page.

"31 October" changed to "February") then the highest day of the month should be chosen instead. Alternatives To Consider Always include 1 .g. Day Of Month Options Description This must only includes days that are appropriate for the chosen month and year.31 and provide validation when the "Next" button is clicked since there must be some validation on Payment Date being today or in the future.Banking. If the user changes the month and the currently selected day becomes out of range (e. Page 84 of 103 .pdf Project: Banking Actions From Payee Options Payment Account Choice Payment Day Of Month Choice Payment Month Choice Payment Year Choice ID CMB-PAYEE CMB-PAYACCOUNT CMB-PAY-DAY CMB-PAYMONTH Condition Click Click Click Click Action Modal Choice Popup Modal Choice Popup Modal Choice Popup Modal Choice Popup Modal Choice Popup Target Payee Options Payment Account Options Day Of Month Options Month Options Year Options CMB-PAY-YEAR Click 33.2.

4.3. Payee Options Description Lists only currently set up Payees that do not have a pending payment. 33.pdf Project: Banking 33.5. Year Options Description Must only contain the current year and future years up to the allowed limit of advance payment (3 years in this example). The list may be empty.6. Month Options 33. 33.Banking. Payment Account Options Description Lists all customer accounts from which bill payments may be made. Page 85 of 103 .

gui Pages\StandingOrders.gui Masters\Footer.pdf Project: Banking 34.gui Used By Description This page shows any payments that are currently pending. If no payments are pending then a different message is displayed at the top and no table is presented. Page 86 of 103 .gui Pages\Payments.gui Masters\LeftMenu.gui Pages\DirectDebits. PendingStart Design File Last Modified Uses Pages\Pending\PendingStart.gui 23 November 2007 18:09:28 Masters\Header.Banking.gui Pages\Pending.

Banking. Selecting an entry allows the details for that payment to be viewed and amended. Actions From "Create New Payment" Web Button "Standing Orders" Text "Direct Debits" Text ID Condition Click Action Replace Top Window Replace Top Window Replace Top Window Target Payments (Design) Click Click StandingOrders (Design) DirectDebits (Design) Page 87 of 103 .pdf Project: Banking 34.1. PendingStart Elements # ID 1 TBLPENDING Name Pending Payments Table Image Description Lists all payments currently pending.

gui Pages\StandingOrders.gui Masters\Footer.gui 23 November 2007 14:56:05 Masters\Header.gui Used By Description The starting page for Standing Order management.gui Masters\BalanceInfo.gui Masters\LeftMenu. there is no account choice box on this page.pdf Project: Banking 35. Page 88 of 103 .Banking. Customers can only have Standing Orders set up against a Current Account and may only have one Current Account. Lists all of the Standing Orders set up on the account. StandingOrdersStart Design File Last Modified Uses Pages\StandingOrders\StandingOrdersStart. Therefore.

gui Masters\BalanceInfo.pdf Project: Banking 36.Banking.gui Masters\Footer.gui Pages\StandingOrders.gui Masters\LeftMenu. The user may delete or amend the Standing Order from this page.gui Used By Description The details view for a selected Standing Order. StandingOrdersView Design File Last Modified Uses Pages\StandingOrders\StandingOrdersView. Page 89 of 103 .gui 23 November 2007 14:56:05 Masters\Header.

pdf Project: Banking 37.gui Page 90 of 103 .gui 23 November 2007 21:22:40 Pages\Statement\StatementResults.gui Pages\Statement. StatementAdvanced Design File Last Modified Uses Used By Pages\Statement\StatementAdvanced.Banking.

Banking.pdf Project: Banking Description The Advanced options provide 3 different ways to specify the date range for the displayed transactions Page 91 of 103 .

g.Banking. 30 September). 2. If an invalid date is selected (such as 31 February. 31 February) is adjusted to the start of the next month (e. A specific statement number (all issued paper statements are numbered starting at 1). A date in the future is adjusted to today's date. 1 March). Page 92 of 103 . 31 September) is adjusted to the last day of that month (e. An invalid "From" date beyond the end of a month (e. Annotations 1. Project: Banking A specific month within the last year (same as Normal option). 3.g. Statement Date Range The date range is inclusive. as follows: ¨ ¨ ¨ ¨ A date before the account was opened is adjusted to the account opening date.pdf statement: 1.g. An invalid "To" date beyond the end of a month (e. the statement should include transactions on both the "From" and "To" dates.g. a date before the account was opened or a date in the future) then the system must choose the best range approximation rather than generate pointless errors. Any given date range since the account was opened.

If an invalid date is selected (such as 31 February.pdf Project: Banking 37. a date before the account was opened or a date in the future) then the system must choose the best range approximation rather than generate Page 93 of 103 .Banking.1. the statement should include transactions on both the "From" and "To" dates. StatementAdvanced Elements # ID 1 Name Statement Date Range Image Description The date range is inclusive.

A date in the future is adjusted to today's date.g. An invalid "From" date beyond the end of a month (e.Banking.g. 31 September) is adjusted to the last day of that month (e.g. as follows: ¨ ¨ ¨ ¨ A date before the account was opened is adjusted to the account opening date. An invalid "To" date beyond the end of a month (e.pdf Project: Banking pointless errors.g. Actions From Month / Year Choice ID CMB-STAT-MY Condition Click Action Modal Choice Popup Modal Choice Popup Modal Choice Popup Modal Choice Popup Modal Choice Popup Modal Choice Popup Modal Choice Popup Modal Choice Popup Target Month / Year Options Statement Number Options Day Of Month Options Month Options Year Options Day Of Month Options Month Options Year Options Statement Number CMB-STAT-NUM Click Choice From Day Of Month Choice From Month Choice CMB-STATFROM-D CMB-STATFROM-M Click Click Click From Year Choice CMB-STATFROM-Y To Day Of Month Choice To Month Choice To Year Choice CMB-STAT-TO-D Click CMB-STAT-TOM Click CMB-STAT-TO-Y Click Page 94 of 103 . 30 September). 1 March). 31 February) is adjusted to the start of the next month (e.

pdf Project: Banking 37.3.2.Banking. 37. Page 95 of 103 . Statement Number Options Description Includes only issued statements within the last 12 months. Issued statements typically straddle 2 different months.4. Month / Year Options Description Includes month and year combinations for the last 12 months (or other limit).31. Day Of Month Options Description Always includes 1 . 37.

Banking. Year Options Description Includes all years from the date the account was opened to today.5. Page 96 of 103 . Month Options 37.6.pdf Project: Banking 37.

StatementNormal Design File Last Modified Uses Used By Pages\Statement\StatementNormal.Banking.gui 23 November 2007 21:15:31 Pages\Statement\StatementResults.gui Pages\Statement.pdf Project: Banking 38.gui Description The Normal options provide a quick and easy way to access a statement containing the transactions for Page 97 of 103 .

Project: Banking 38.Banking. StatementNormal Actions From Month / Year Choice ID CMB-STAT-MY Condition Click Action Modal Choice Popup Target Month / Year Options Page 98 of 103 .1.pdf a specific month within the last year.

Month / Year Options Description Includes month and year combinations for the last 12 months (or other limit).pdf Project: Banking 38.2. Page 99 of 103 .Banking.

Statement Net Amount Shows the net amount of Money In minus Money Out for the chosen period.pdf Project: Banking 39. Negative amounts are shown in red to highlight a potential issue.Banking.gui 23 November 2007 18:24:09 Pages\Statement\StatementAdvanced. Page 100 of 103 .gui Pages\Statement\StatementNormal. StatementResults Design File Last Modified Used By Pages\Statement\StatementResults.gui Annotations 5.

Activates the browser's Print facility (usually opening a Print dialog). 1 TBLStatement STATEMENT Table 2 TBLStatement STATEMENT Totals -TTLS 3 BTN"Print" Web STATEMENT Button Shows the total amount of Money In and Money Out within the chosen date range. StatementResults Elements # ID Name Image Description Shows all transactions on the account within the chosen date range.Banking. This is simply the sum of the Money In and Money Out columns.1. Page 101 of 103 .pdf Project: Banking 39.

pdf -PRT Project: Banking The page should be set up so that printing produces good results (using an appropriate style sheet). Negative amounts are shown in red to highlight a potential issue. Page 102 of 103 . TO BE DEFINED! Shows the net amount of Money In minus Money Out for the chosen period. 4 BTN"Download" STATEMENT Web Button -DLOAD 5 TBLStatement Net STATEMENT Amount -NET Offers the facility to download the statement in a variety of formats. Alternatively: The Print button could lead to a printer-friendly version of the statement that may then be printed. This solution will more likely produce better results.Banking.

"Form Title" Rectangular Text Shape Page 103 of 103 .2.3. Table 40.gui 30 October 2007 11:14:16 40.Banking. Table Design File Last Modified Templates\Table. Table 40.pdf Project: Banking 40.1.

Master your semester with Scribd & The New York Times

Special offer for students: Only $4.99/month.

Master your semester with Scribd & The New York Times

Cancel anytime.