Card Issuance Flow
A unified feature for ordering, issuing, and reissuing all types of bank cards in the mobile app.
What Was The task?
My task was to create a unified feature in the mobile app to support these operations, which can be divided into three main groups.
1
New Card Order
Previously, users had to visit a bank branch to order a new card. Our goal was to let them easily choose and order any card online.
2
Card Reissue
Old reissue process was unclear to most. Our task was to integrate this feature into the new service and make it intuitive.
3
Card Policy
Legally, we must publish complete product documentation. Our task was to make it easier to read while keeping the interface uncluttered with legal details.
UX Personas
I used UX personas to better understand user needs, behaviors, and pain points. This helped me design a more intuitive and user-friendly experience tailored to different audiences. So there they are.
Alise lives in a big city, where more than 5 banks are available in the hood. Often, she does not use the ABR card as the main one and transfers the funds which she received to cards of more popular banks.
The main goal for the persona: The task is to create a simple method for delivering information about bank offers that will be beneficial to him.
The main goal for the persona: The task is to create a simple method for delivering information about bank offers that will be beneficial to him.
For many remote regions, the bank is one of 2-3 banks represented in the region. These clients are guided primarily by the profitability of the offer, and not by the convenience of the service when choosing a bank. For such a person, the ABR card is most often the main or only one.
The main goal for the persona: The key task was to increase the convenience of the banking service in order to increase product loyalty.
The main goal for the persona: The key task was to increase the convenience of the banking service in order to increase product loyalty.
The client uses a bank card to receive pension payments. She is a person who is not loyal to any bank and fears any bank cards and transactions with them in general. Most often, she immediately cashes the funds received.
The main goal for the persona: She is not the target audience for the product.
The main goal for the persona: She is not the target audience for the product.
What did this case mean for the business?
- Сard Issuing SimplificationTo issue a new card product, customers were supposed to visit bank office and manually fill in an application form
- Process and Paperwork UnifyingNow, all the documents for card issuing and reissuing are filled electronically, which saves office employees' resources
- MarketingThe integration of card issuing process into the app allows the marketing department to inform bank customers about new available products directly via their smartphones
- Increasing LoyaltyAdding popular and highly demanded features to the app increases loyalty to the product and the company
Architecture Solution
The main challenge was to merge two user flows: ordering a new card and reissuing an existing one.
Although the starting points for each process were different, the required forms and documents were the same. By unifying the flow at the questionnaire stage, we simplified the user experience and reduced development effort.
Key UI Insights
The most interesting part of this case is the UI solutions—here are the key insights.
Horizontal Swipe
Customers could switch between various card products using the horizontal swipe. I've added a carousel and also showed the edges of the previous and future card for users to understand that it's possible to scroll back and ahead.
Fixed Button
Throughout the work case, it was clear that although it wasn't specified in the design system the freeze button at the bottom of the screen was supposed to be made, therefore it will increase conversion.
Card Features Divided into Types
Some card user terms – usually the basic ones – could be easily described in 1-2 lines. I've put them in the upper part of the screen for a user to see them at the top immediately after opening the tab.
I've put some more complicated terms into a slider at the bottom of the page. All the legally necessary links on credit papers were placed below.
I've put some more complicated terms into a slider at the bottom of the page. All the legally necessary links on credit papers were placed below.
Card Image Design
Bank cards have a completely different design and do not fit well with each other on the same page. At the same time, an important business requirement was the use of images of real maps. To solve this problem, I came up with "card illustrations", inside which, in addition to a similar design, I placed photos of real cards. This allowed us to simultaneously fulfill business requirements and maintain design consistency.
