"There is no error message when I try to proceed with payments and no banking information exists. The page just stays the same after clicking 'Next' button. The user should be told no banking information exists and they must go to Manage Bank Accounts link to proceed."
After looking more in depth at our payment user journey, I realized that some small changes in the code could clear up this issue without the use of error messages, or even allowing the customer to fail in the first place.
When a user clicked the radio button next to “Other Amount,”, the Next button changed from inactive to active. It should not have changed yet, though, because all of the necessary steps have not been filled out yet.
The three screenshots below describe scenarios where the user has not completed the necessary steps, yet are allowed to continue on the process.
The two screenshots below describe scenarios where the validation process is working properly and the user is not allowed to continue on the process until the necessary steps have been completed.
By changing the "Manage Bank Accounts" link to "Add a Bank Account" for those users who do not yet have a bank account in the system, they are driven to make an action. "Manage Bank Accounts" would make more sense for users with a bank account already on file. A plus icon also illustrates that the user should add something that is missing.
Users with the "Add a Bank Account" link could then be taken straight to the "Add a Bank Account" page, rather than the "Manage Bank Accounts" page, therefore reducing the number of clicks and confusion.
You may also like
JEA Alert Preferences UX
Wedding Website and Print Design
JEA Storm Blueprint
Music Festival Branding Concepts
Adecco Employee-Facing Application
Budget Billing Enroll/Unenroll UX
Fundraiser Advertising and Donation Boards
JEA Appliance Usage Infographic
R3Global Creative Group