top of page
Image by Priscilla Du Preez

Online Credit Card Application

Domain icon 2.png

Domain: Banking

project type icon 1.png

Project Type: B2C

Platform icon 1.png

Platform: Web/Mobile

To comply with the non-disclosure agreement, I have omitted and obfuscated confidential information in this case study.

The information in this case study is my own and does not necessarily reflect the views of my previous organization.

About DAP

Bank has multiple touch points across channels like NetBanking, Mobile/SMS Banking, Email, Phone Banking, Chatbot, Whatsapp and Traditional Branch Banking to cater to all sorts of customer requests /needs/ grievances.

​

Although a lot of customers are using NetBanking and/or Mobile Banking for their day to day banking needs, a huge portion of the customers are yet to onboard the digital wave to do the same tasks that they might be currently doing in traditional branch banking.

​

Digital application platform (DAP) helps cater to this audience for their unique needs without them having to visit the bank. Moreover, most of these journeys, allow for instant applications through eKYC and video KYC processes, which saves a lot of time for both customers and the bank.

​

DAP also enables New-to-Bank customers to complete their applications without having to visit the branch or connect with any staff.

My Role in DAP

  • Conducting preliminary discussions with product team to understand the business requirements.

​

  • Conduct internal UX team discussions basis the requirement documents shared, to identify additional points for clarity and assign task to junior UX Team members.

​

  • Co-ordinate, discuss and review workflows/concepts/designs done by team members.

​

  • Conduct walk through sessions of designs to the larger audience of stakeholders for feedback and oversee updates, if any, for the same.

Image by CardMapr.nl

DAP - Online Credit Card Application

The project was about review & revamp of existing Credit Card application on DAP for New-to-Bank applicants and recommend both structural and tactical updates

Problem Statement

1. Perceived longer journey

Customer feedback suggested that Credit Card application seemed lengthy and they were not sure how much time would it take to complete.

​

2. Massive drop offs on redirection

  • The existing process has a redirection out of DAP for E-verification of income (Perfios). It opens up a new tab in the browser asking customers to complete income verification and then return to DAP. 

  • Besides, the E-verification process itself had multiple screens which would lead to customers dropping off.

  • Since perfios is a third party page, the look and feel were not in line with banks branding, leading to trust issues and eventually further drop-offs.

Business Goal

To improve overall conversions of Credit Card applications through DAP in an unassisted mode.

Customer Goal

As a new-to-bank customer, be able to successfully apply for a Credit Card online without any assistance in a quick and easy to understand process.

Approach

  • Extensive end to end review of the existing journey to identify pain points

  • Competitor bench marking to understand things that are working well vs things that can be improved upon to minimise or eliminate those pain points

  • Iterative design process to shorten the feedback loop

Workflow

A detailed workflow of the existing credit card application was created to understand happy paths as well as certain negative scenarios which helped in identifying additional pain points for customers.

​

It also helped in understanding feasibility constraints that the development team was facing and reasons why certain elements in the workflow were sequenced in a specific way. Eg. All documents to be upload being at the end of journey, instead of having it in context of relevant fields.

​

This workflow changed over the course of discussions and initial rounds of iterations for simplifying the journey. However, updates were done considering the limitations of existing DAP platform and also the regulatory and legal requirements set by RBI (Reserve Bank of India).

​​

Screenshot 2021-05-09 at 12.12.55 AM.png

Designs

Considering the fact that this was already a live journey and that the Bank was already processing approximately 50,000 applicants per month, the scope was defined to ensure we did not reinvent the wheel and in process lose out on new applicants visiting DAP.

​

The priority here from the design stand point was to address the pain points first along with incremental updates on the overall look and feel of the screens. The larger structural changes were to be taken up as a new project at a later stage as part of phase 2.

Pain Point 1: Long Application

  • One of the major feedback received through social media channels and through direct communication with Relationship Managers was that the journey seemed too long compared to the Credit Card applications of other bank.

​

  • This feedback was puzzling to the product team in a way that the number of steps and required fields were similar to competitor journeys, however it was still perceived to be longer and leading to major drop offs.

​

  • On analysing the workflow, the existing screens and the customer feedback received, it came to light that customers possibly felt lost in the journey more because they were not able to see the progress they have made in the application.

Identifying key milestones

  • With the workflow as a reference, we had to define optimum number of steps for applicants to stay well informed about process they have completed, where they are now and how far they need to go to complete the application.

​

  • There had to be a right balance between the number of steps and the content on each page. Showing too many steps at the start would have been daunting and customers could possibly decide not to proceed. Although showing less steps seemed good at the onset, however we would have ended up with longer forms to compensate, leading to drop offs again. 

​

  • To add to this, we also had to account for the boundary conditions set by the vendor development team with the existing legacy systems and its limited flexibility. 

​

  • Multiple iterations were created, discussed, dismissed and redone to arrive at a 6 step application process

​

  • Choose KYC > Check Eligibility > Select Card > Enter Office Details > Upload Documents > Confirm Card Selection

Screenshot 2021-05-12 at 8.33.46 PM.png

Representation

The next task was to decide on an appropriate representation and placement of the 6 steps on the journey to best resolve customer pain point. Few approaches are discussed below,

Approach 1 

To show all 6 steps at the start to set an expectation for customers.

Drawback

Considering the short term memory we humans have, customers would not be able to recall the steps midway through an application.

Screenshot 2021-05-09 at 11.49.57 PM.png
Screenshot 2021-05-09 at 11.49.24 PM.png
Screenshot 2021-05-12 at 1.12.56 AM.png

Approach 2

Persistently have a progress bar throughout the journey, to visually communicate application progress

Drawback

Although this helps in giving a sense of place to the applicant, it fails to give clarity on next steps. Also with its placement, discoverability reduces considerably.

Approach 3

Eliminate the need of a progress bar by showing steps on the page. Eg. 1/6, 2/6 and so on.

Drawback

In a journey where the number of steps may vary dynamically basis customer decisions/selections, this concept fails. 

Screenshot 2021-05-12 at 11.51.49 PM.png

Finalised Progress Bar

Keeping the core issue to be addressed at its centre, the final version of progress bar ensures clarity of steps completed, in progress and/or pending in a subtle way that it does not distract the applicants but neither does it get lost with rest of the page content.

​

For a dynamically changing journey like the Credit Card application, combining two of the approaches mentioned above helped in limiting the total steps to 6 with certain steps having sub-steps too.

Screenshot 2021-05-13 at 1.16.14 AM.png
Screenshot 2021-05-13 at 1.16.34 AM.png
Screenshot 2021-05-13 at 1.16.27 AM.png
Screenshot 2021-05-13 at 1.20.01 AM.png

Pain Point 2: Income Verification Redirection (Perfios)

  • 2 main concerns with this step in the application process which were leading to drop offs were the redirection to a 3rd party portal in a new browser tab and the portal itself having 5 steps to complete the E-verification.

​

  • To add to that, once the E-verification is complete, user had to manually close the tab and navigate to original tab to complete the application process.

​

  • The updated version of Perfios has just one page and it opens up within DAP platform eliminating the redirection completely. With a seamless integration of 2 platforms, combined with a single page, shortens the journeys considerably and allows applicants to focus on the task at hand.

Screenshot 2021-05-13 at 2.10.04 AM.png
Screenshot 2021-05-13 at 2.09.58 AM.png

Pain Point 3: Offer Page

  • After a successful eligibility check in the backend, customers are shown a wide range of cards to choose from. However the existing screen displayed just one card which was best suited for customer need, while the rest had to be viewed/read about by scrolling through.

​

  • Although this helped business to push certain cards first, the downside to this was that many customers were unable to explore these additional offerings. Even for the card which was displayed, customers were being redirected to the bank website to read details about the same.

​

  • These were potential drop off points for customers not entirely sure about the displayed card and were not able to notice the rest of the offers. Also for those who wanted to know a bit more about that card before arriving at a decision were being forced to move out of DAP.

Iterations

With the issues of 'card range visibility' and its 'details not available' upfront, concepts were created and discussed with product/development teams to weigh in the best possible option which will have minimum or no impact on the development setup.

Screenshot 2021-05-13 at 2.41.05 AM.png
Screenshot 2021-05-13 at 2.41.09 AM.png
Screenshot 2021-05-13 at 3.31.12 AM.png
Screenshot 2021-05-13 at 2.41.16 AM.png

Approved Concept

  • The final design helps not just in displaying multiple cards on offer but also categorises the card for customers to give them a quick overview before they dive deeper into a particular card information.

​

  • Keeping the individual card information minimal on this page reduces the clutter and allows the focus to be on categories and its cards.

​

  • This layout works for customers who are looking for specific cards, since they can locate them by category and also for those who are unsure but can explore the wide range of cards and make an informed decision after reading details about it.

​

  • In either case, the decision making process at this step of the application is shortened and customer can move on with the application. 

Screenshot 2021-05-13 at 3.48.42 AM.png

Design Challenges

  • Considering the project was about revamp and not a redesign, I had to play well within the set limitations of existing development setup. However the design process was not compromised at any stage to arrive at a specific design decision irrespective of it being approved or rejected. 

​

  • Although the progress bar and offer page seemed like smaller pieces of a larger puzzle, they did have its fair share of discussions, iterations, dissection and rework to identify the development implication of time and effort.

​

  • There was this continuous effort on finding a middle ground on usability vs feasibility in a collaborative environment on a day to day basis. 

What I Learned

Analytics on existing Credit Card application journey put the spotlight on a huge drop off rate of approximately 80%. For a population like India, with its large customer base this issue was looked at critically by the bank management and it had to be resolved on priority with minimal downtime. 

​

This project helped me gauge that as designers, it may not be ideal to think of the bigger picture every time. We need to have the ability to recalibrate, basis the situation and then think of the best course of action. Whether the project needs a surgery or just a temporary bandage, it needs to be a conscious call for everyone involved.

free-macbook-pro-mockups.jpg
Screenshot 2021-05-13 at 3.13.14 PM.png
Screenshot 2021-05-09 at 11.49.57 PM.png
Screenshot 2021-05-13 at 3.13.14 PM.png
Screenshot 2021-05-13 at 3.13.14 PM.png
DB Bank and its representatives to Call, SMS or communicate
DB Bank's Privacy Policy

Few other DAP Projects

  • Auto Loan (Zip Drive)

  • Two Wheeler Loan (Quick Ride)

  • Gram Panchayat Account Opening

  • Branch Digitisation

  • Credit Card Address Change

  • Fixed Deposit Closure

  • Consumer Durable Loan 

  • Aadhaar Seeding for DBT customers

  • Issuance of Business Debit Card

​

  • GST based Underwriting

  • E-Mandate for Existing Customers

  • Corporate Credit Card Application

  • Corporate Onboarding 

  • Add-on Credit Card

  • Standing Instruction for Savings Account customers

  • E-Gift Plus Card

  • Gold Loan Top-up

  • Digital Agricultural Loan Application

​

© Copyright

© 2026 by Hemant Kanade

bottom of page