I focused on improving this application because for many people, tracking their expenses is very important. The goal was to improve the interface so that users could more easily find their transactions, without having to look at previous months' statements. I wanted to offer efficient design with a modern aesthetic.
The online banking market was $11.43 billion USD in 2019. The market is projected to reach $31.81 billion USD by 2027.
More and more customers want autonomous management of their online bank accounts. They want hassle-free, reliable security, and to make payments quickly.
The transaction search is very laborious, users need to remember the card they used, select a period with precise dates and browse the result list. It is not possible to search by keywords in a search bar. There are also reliability issues with respect to check cashing.
To begin with I analyzed the National Bank's app and 3 other online banks (Scotiabank, RBC, TD Bank) and found out the negative and positive comments.
Difficult to block or configure your card
Many features are not easily accessible
I conducted a quick survey, with 10 people who use their online banking app at least once a week. I asked them "What features should be most important in your online banking application?"
There is a strong interest in being able to set up your bank card independently. In particular to deactivate and activate contactless payment.
Participants also want to find their old transactions and see their recent transactions
I created 2 personas based on two categories of users of the bank app. Marth Lyn who wants to easily track his expenses and Adam Taylor who wants to easily transfer money and control his payment cards.
To understand the basic features I started with a simplified flow diagram with the most important actions a user can perform once logged into the application.
After creating the flow diagram, I continued with the wireframes of the most important screens.
After the flowchart and wireframes, I chose an Apple "SF Pro" font. I then determined colors inspired by the national bank's brand image.
To respect proportionality, I chose a grid composed of multiples of 8 for this project (8p,16p,24p,32p,40p)
Contrasts were tested to meet WCAG AAA or AA standards.
I researched and improved the color choices until I had satisfactory colors for high-fidelity prototyping.
Conducting research on the banking app market was necessary for the National Bank project.
A quick online survey of banking app users was conducted before continuing with a diagram, and then low-and high-fidelity prototypes.
The project culminated with a quality assurance audit on the colors and contrast ratio in order to comply with WCAG standards and provide better accessibility.
