Use this pattern when your process or application requires the user to select one of their existing accounts.
Account tiles
The account tile uses the Flexicell component.
When displaying a savings or transaction account, display the account name (or nickname), account balance and the account number details.
When listing a credit card, loan account or transaction account with a debit card, display the account name (or nickname), account balance, available balance and the account number or masked card number details.
Account list
In a scenario where you have a list of accounts of different types, they can be grouped into categories to help users easily scan.
User experience
Account information can be laid out differently, depending on where you are in the application. The visual hierarchy of the information ensures the most important detail is easily found. Each account can contain the following elements:
- Account name - By default, this is the product name. However, if the customer has created a nickname for the account, it may be shown instead. Using the nickname when it’s available helps the customer recognise which account is being shown - if the customer has multiple accounts of the same type, this makes it easier to distinguish them.
- Account number - The BSB, account number or card number is displayed depending on the product type.
- Balance - The balance of the account is usually the most prominent detail.
- Available balance - The available balance is shown when there is a difference between a customer's current and available balance.
For more information on how account listing is used in banking see. Banking display of accounts.