Project Overview
Currently Bank customers (Checkings, Savings) only see two types of transactions on the UI, Pending and Posted. The money under pending transactions is not available for the customer to use, while the money under posted transactions is available for the customers to use. This is primarily because it takes about 3-4 days for an transactions to move from pending to posted state. For Balances, they see Available Now which displays a total of all the Posted Transactions and On Deposit which displays a total of all the Pending and Posted transactions.
But, there is one more state of transaction that is only seen on the backends i.e. Hold. This state necessarily holds back full or partial amount for a brief while/3-4 days for a specific transaction after it is posted. Since the holds usually happen on partial amounts, the backend systems update the status on transactions from pending to posted. This causes confusion on the customers side as they are expecting to see all the amounts under posted transactions to be available for them to use, but that is not the case as sometimes backend systems hold certain amounts on an specific transactions.
Ask: We need a temporary account level flag that would display and describe Hold, helping customers understand the discrepancy. We also want to make sure we are not pushing customers to think and call us about why there are holds on my account etc.
Responsibilities: User Research > Design Thinking > Wireframing > Testing > Iteration > More Testing > Delivery
Tools: Figma, FigJam, Whiteboard, Jira, Intralinks
Team: UX Researcher, UX Writer, UX/UI Designer, ACD, Legal & Compliance Team, Dev Team
Duration: 2 Sprints
Competitive Research
Where do we put the alert without alarming the customer but still where they will notice it?
We experimented with different placement for the alert. We looked at an alert banner at the top of the dashboard, putting the messaging in the main banking tile, or using tool tips.
We also thought it would make sense to try and put the messaging in the Transaction Tile, as that would be where most people would be looking at their money.
This is where we went into testing to help us decide where the user felt the alert was most effective.
Testing Result: Web
Now we had to design the mobile version which differed in design from the web as we had recently pushed a design upgrade for mobile. We experimented and tested several versions of this. Where do we put the alert: alert button on dashboard, alert button on transactions, alert banner dropdown, color options?
Alert button with alert banners in drawer - different colors
Designs tested
Final Delivery
We ended up with a combination of the Tool Tip and the dropdown alert tile above the transactions. Most users preferred the yellow and the animation and location of the drop down alert. We also added the tool tips to the transaction pages (on the right)