Wintech Bank Account Opening
Traditionally user have to go to a branch to open their bank account. They have to fill in a number of forms, bring in their credentials as well as go through the whole account opening process in one go. The whole process takes half an hour and cannot pause once started. With Wing Lung Bank’s new online account opening function, opening an account have never been so easy.
Objective
To solve the problem where users have to go to a physical branch to open their bank account
Background
More and more banks offer online account opening
With the introduction of virtual banks in Hong Kong and advancement in legislation, more and more banking activities can happen online through web platforms or even mobile apps through the use of eKYC (electronic Know Your Customer). With this function it allows user to scan their ID and complete a few selfie to validate their identity. Since virtual banks do not have a physical branch, all their services are provided through their mobile app including account opening. It is a must for traditional bank to adapt and offer similar service to remain competitive.
Fill the form online but still need validation by going to a branch
Currently Wing Lung’s banking app do allow user to fill in the account opening form through its app, but the customer must go to a branch to complete the remaining process, which still causes inconvenience.
Existing CMB Wing Lung Bank account opening flow
The Challenge
The new account opening process must allow customers to complete their account opening all within the mobile app without visiting a physical branch. User should be able to open additional types of account such as investment and trading account if they want to do so. An initial task in redesigning the module was to understand the problem with the current flow and understanding the user’s needs when they open an account.
In the research phase I decided to first conduct a heuristic evaluation of the existing account opening process with my manager to understand if there were any usability issues. We concluded that the existing flow have multiple cosmetic and minor usability problems.
Current State Analysis
Competitor Analysis
It was essential in understanding how virtual banks and traditional banks are providing their online account opening process. I performed a competitor analysis on 10 banks ranging from traditional banks such as HSBC, DBS, Citibank to virtual banks that perform extra well such as ZA Bank and Mox Bank. Through the competitor analysis I paid special attention in comparing the questions they ask the user. Reducing the number of questions could directly reduce the length of the process hence solving the issue where some users have commented on the length of the existing form being too long.
General observations and insights
ZA Bank has the cleanest and minimum flow out of all banks
Citibank is the only bank that uses both Web and App to complete the account opening
Some banks (Citibank and Citic Bank) would ask if the customer want to create other types of account during the process. On the other hand DBS bundled the whole experience as one (opening both saving and investment account together)
Some banks utilise overlays to educate the user and have use follow the instructions step by step during the HKID scanning and selfie step.
Some banks have their OCR in the beginning, others in the middle
Some banks (ZA, HSBC and Citi) ask for the customers’ mobile number and email in the beginning. Others treat them just like any other fields
Exploration
Every month feedbacks about the banking app are collected and sent to the UXUI Team. Comments came from relationship managers, app stores and other sources. I would then consolidate and present those feedbacks as an affinity diagram for everyone in the team to reference when there are design changes. I used the affinity diagram to locate feedbacks related to account opening and keep them as pain points to solve for this project. Through studying the business requirement, prior research done by product owner and discussion with stakeholders, I created personas, empathy map and user journey to have a better understand the users needs, their experiences, behaviours and goals. These materials were constantly referred to in the design cycle.
Design Ideation
With the problem identified, multiple designs were explored. The design process started through creating low fidelity UI to discuss with product owner to creating medium fidelity UI by following the company design style guide. Different layouts and ordering were experimented, such as the questions about address as the input sequence differs between China, Hong Kong and the rest of the world. Some questions are prefilled with the most common answer and some pages would automatically transition to the next page to reduce click count. I used user flows to highlight exception cases to ensure the user won’t get stuck even when they encounter an error.
In the prototyping phase medium fidelity UIs were created send distributed to colleagues to experience the new account opening flow to collect comments and feedbacks. Different ideations were created for users to test and their most prefer design were selected. The process repeated as I iterate on the design based on feedbacks from product owner and users and created prototypes for testing.
Some areas where issues were found and solved includes:
The accuracy of eKYC heavily depends on the lighting conditions. Some user passes the eKYC stage in one go while others were stuck in a loop. Additional education screens were added to the UI for higher chance of success
As the account opening have questions related to three types of account, the length of the process become very long. I discussed with product owner and have questions that allow prefilling to be prefilled based on the most common response from users to shorten the overall process.
The sequence of how address appear is different for Hong Kong, China and overseas. This part was handled by having different field order depending on the question about which country/region the user lived in. I worked with the product owner to establish a standardised address input order for future projects.
Prototyping and user testing
Deliverables
The UI was designed following the design style guide maintained by the UXUI team and later delivered to IT team for development. Variations of the opening flow were created to suit business requirement and development cycle.
Project Learnings
Simplicity is best
As a bank they always try to collect as much information from the user and that causes the process to be long and often annoys the user. As a designer its always important to try to keep things simple, understand the perspective from all stakeholders and then come up with a design that strike the balance.Prioritize
Some functions are vital in crafting the user experience of the product and they should have the most time spent on refinement and ideation. Out-of-scope requirements that could lengthen the development cycle can be put on a lower priority or as post-launch enhancements.Seek out feedback early and continually
Criticism from anyone is good as that helps a designer think if their current solution is still not good enough. Keeping the stakeholders/users in loop and test solutions at all stages of the development cycle and as early as possible. This can help save ample amount of time and re-work.