Payee tile

The payee tile uses the Flexicell component.

The payee tile has a few configurations, it can come with an icon to represent the payee type or the initials of the payee's name or nickname. The right side can have optional content, a date for indicating a recent payee, or an Info icon that links to more details about that payee. These configurations are most commonly used in Online Banking processes.

Payee with recently paid date

Payee with info icon link

Payee list

Payees can be listed alphabetically, including a separate group for recently paid, to help users easily scan.

User experience

Payee information can be laid out differently, depending the payee type. The visual hierarchy of the information ensures the most important detail is easily found. Each payee can contain the following elements:

• Logo, initials or icon - this visually indicates the type of payee, allowing the user to quickly scan the list to locate the payee they are looking for.
• Payee name - By default, this is the payee's account name. However, if the customer has created a nickname for the payee, it may be shown instead. Using the nickname when it’s available helps the customer recognise which payee is being shown - if the customer has multiple payees of the same type, this makes it easier to distinguish them.
• Payee details - The BSB & account number, payID details or Biller code & reference number is displayed depending on the payee type.
• Info button - The info icon button is displayed in online baking scenarios where a dual link action is required, the payee name selects the payee and the info icon button allows to user to go to a new page showing all the details for that particular payee.
• Date - when a date is displayed it references the last time that payee was paid, it is usually reserved for those payees that have been recently paid.