Improving discoverability and engagement for 5M+ Federal Bank - India users
Improving discoverability and engagement for 5M+ Federal Bank - India users
Let me take you through my process of revamping Home Screen of a banking application
Let me take you through my process of revamping Home Screen of a banking application
PRODUCT
Federal Bank
PLATFORM
Mobile App
MY ROLE
Product Designer
Introduction
FedMobile is the mobile application of Federal Bank, a listed Indian company. With a customer base of over 10 million, including 1.5 million NRI customers, the bank has a presence across India and representative offices in Abu Dhabi, Qatar, Kuwait, Oman, and Dubai. The FedMobile app has been downloaded over 7 million times via the Android Play Store and Apple App Store. Federal Bank consistently upgrades the app to cater to every need expected from a bank, ensuring a comprehensive banking experience.
Introduction
FedMobile is the mobile application of Federal Bank, a listed Indian company. With a customer base of over 10 million, including 1.5 million NRI customers, the bank has a presence across India and representative offices in Abu Dhabi, Qatar, Kuwait, Oman, and Dubai. The FedMobile app has been downloaded over 7 million times via the Android Play Store and Apple App Store. Federal Bank consistently upgrades the app to cater to every need expected from a bank, ensuring a comprehensive banking experience.
My Role in the Project
As the Product Designer, I was responsible for enhancing the FedMobile app experience by ensuring visual and functional consistency across modules. My role included:
Identifying Design Issues: Audited the product to uncover inconsistencies and usability challenges.
Collaborating Across Teams: Worked closely with the Product Manager to align design decisions with user needs and business goals, and partnered with developers to ensure smooth implementation.
My Role in the Project
As the Product Designer, I was responsible for enhancing the FedMobile app experience by ensuring visual and functional consistency across modules. My role included:
Identifying Design Issues: Audited the product to uncover inconsistencies and usability challenges.
Collaborating Across Teams: Worked closely with the Product Manager to align design decisions with user needs and business goals, and partnered with developers to ensure smooth implementation.
Problem 1 : Lack of Search Affects Navigation and Usability
As modules increase, users struggle to find what they need—slowing down task completion and reducing engagement.
Example
The absence of a search feature makes it difficult for users to locate specific modules as the number of available options continues to grow. Users are forced to scroll and manually explore, or need to navigate deep for modules—leading to frustration and task abandonment.
Impact
Without search or discoverability support, users struggle to navigate efficiently, resulting in poor engagement and decreased usage of key modules across the platform.
Problem 1 : Lack of Search Affects Navigation and Usability
As modules increase, users struggle to find what they need—slowing down task completion and reducing engagement.
Example
The absence of a search feature makes it difficult for users to locate specific modules as the number of available options continues to grow. Users are forced to scroll and manually explore, or need to navigate deep for modules—leading to frustration and task abandonment.
Impact
Without search or discoverability support, users struggle to navigate efficiently, resulting in poor engagement and decreased usage of key modules across the platform.
Problem 2 : No Visibility for Key Banking Services
We’re missing the opportunity to showcase core banking modules on the primary home screen.
Example
Important banking services like deposits, loans, or card management are not featured prominently on the home screen. Users often overlook these modules or assume they aren’t available, reducing their chances of interaction and usage.
Impact
Without visible access to key services, user engagement drops and cross-selling opportunities are lost, limiting overall platform value and business impact.
Problem 2 : No Visibility for Key Banking Services
We’re missing the opportunity to showcase core banking modules on the primary home screen.
Example
Important banking services like deposits, loans, or card management are not featured prominently on the home screen. Users often overlook these modules or assume they aren’t available, reducing their chances of interaction and usage.
Impact
Without visible access to key services, user engagement drops and cross-selling opportunities are lost, limiting overall platform value and business impact.
Problem 3 : Inconsistent Components
Visually similar CTAs trigger different actions, leading to user confusion.
Example
Buttons with the same design language serve unrelated purposes — one displays balance in place, while another redirects users to the “All Accounts” screen. This inconsistency breaks user expectations and causes hesitation or misclicks.
Impact
When design patterns don’t match behavior, users lose trust in the interface. This increases cognitive load, reduces efficiency, and leads to frustration and drop-offs during key tasks.
Problem 3 : Inconsistent Components
Visually similar CTAs trigger different actions, leading to user confusion.
Example
Buttons with the same design language serve unrelated purposes — one displays balance in place, while another redirects users to the “All Accounts” screen. This inconsistency breaks user expectations and causes hesitation or misclicks.
Impact
When design patterns don’t match behavior, users lose trust in the interface. This increases cognitive load, reduces efficiency, and leads to frustration and drop-offs during key tasks.
Problem 4 : Lack of Module Prioritization
Modules under each category are not ordered by usage or relevance.
Example
Within parent categories like "Payments" or "Investments," all modules are presented in a flat, non-prioritized order. High-usage features are buried among rarely accessed ones, making frequent tasks harder to reach.
Impact
This slows down task completion and adds friction to the user journey. By not surfacing the most-used modules first, we miss opportunities to enhance engagement and user satisfaction.
Problem 4 : Lack of Module Prioritization
Modules under each category are not ordered by usage or relevance.
Example
Within parent categories like "Payments" or "Investments," all modules are presented in a flat, non-prioritized order. High-usage features are buried among rarely accessed ones, making frequent tasks harder to reach.
Impact
This slows down task completion and adds friction to the user journey. By not surfacing the most-used modules first, we miss opportunities to enhance engagement and user satisfaction.
Probelm Statement
We wanted to improve key business metrics through Home Screen —
GOALS
Business Goals
Improve discoverability of revenue-generating modules
Ensure key services are easily found to increase engagement and drive business outcomes.
Boost overall user engagement
Encourage users to explore beyond routine tasks by surfacing relevant and contextual modules, improving session time and interactions.
Enable scalable and targeted promotion
Introduce personalization and modular prioritization to surface high-value features to the right audience at the right time.
User Goals
Easily discover what they need
Reduce cognitive load with search functionality, clear categorization, and relevant suggestions for faster task completion.
Get a personalized and relevant experience
Customize module visibility and ordering based on usage patterns to align with individual user goals.
Use with confidence and clarity
Ensure consistent behavior and visual language across the app, reducing confusion and building trust in the experience.
GOALS
Business Goals
Improve discoverability of revenue-generating modules
Ensure key services are easily found to increase engagement and drive business outcomes.
Boost overall user engagement
Encourage users to explore beyond routine tasks by surfacing relevant and contextual modules, improving session time and interactions.
Enable scalable and targeted promotion
Introduce personalization and modular prioritization to surface high-value features to the right audience at the right time.
User Goals
Easily discover what they need
Reduce cognitive load with search functionality, clear categorization, and relevant suggestions for faster task completion.
Get a personalized and relevant experience
Customize module visibility and ordering based on usage patterns to align with individual user goals.
Use with confidence and clarity
Ensure consistent behavior and visual language across the app, reducing confusion and building trust in the experience.
Impact
Improved discoverability through Search
The introduction of the Search function led to a noticeable rise in the number of sessions and feature access, showing that users could now locate specific modules faster and more efficiently.
Increased engagement with key modules
A structured and prioritized layout helped surface revenue-generating modules more effectively, resulting in higher interaction and engagement.
Growth in session duration
With clearer navigation and reduced friction, users spent more time exploring beyond their primary tasks — reflecting positively in time spent per session.
Better visibility for business-critical features
By solving discoverability challenges and customizing module order, we were able to reduce the difficulty in promoting important services.
Positive user feedback
Early qualitative feedback confirmed that users found the new layout easier to use and more helpful for completing tasks — building user trust and satisfaction.
Impact
Improved discoverability through Search
The introduction of the Search function led to a noticeable rise in the number of sessions and feature access, showing that users could now locate specific modules faster and more efficiently.
Increased engagement with key modules
A structured and prioritized layout helped surface revenue-generating modules more effectively, resulting in higher interaction and engagement.
Growth in session duration
With clearer navigation and reduced friction, users spent more time exploring beyond their primary tasks — reflecting positively in time spent per session.
Better visibility for business-critical features
By solving discoverability challenges and customizing module order, we were able to reduce the difficulty in promoting important services.
Positive user feedback
Early qualitative feedback confirmed that users found the new layout easier to use and more helpful for completing tasks — building user trust and satisfaction.
Solution
1. Discoverability
a. Search functionality
The overwhelming number availability of modules in FedMobile poses challenges for users to discover what they need, as few modules are easy to find while others are part of the parent category, and navigating such modules is a tough ask for any user. In the old version, there is no search functionality. Hence it led to more dissatisfaction for the user when they want to find one.
Solution
1. Discoverability
a. Search functionality
The overwhelming number availability of modules in FedMobile poses challenges for users to discover what they need, as few modules are easy to find while others are part of the parent category, and navigating such modules is a tough ask for any user. In the old version, there is no search functionality. Hence it led to more dissatisfaction for the user when they want to find one.
In the new design, I have added a Search option on the top navigation bar which allows users to initiate a search function. Why in top navigation? It is easy to find and using an icon makes it obvious. The search results will include categories, modules, and a help section related to entered string. Clicking on any of the menu options will redirect the user to the respective module's landing screen, providing a seamless navigation experience.
In the new design, I have added a Search option on the top navigation bar which allows users to initiate a search function. Why in top navigation? It is easy to find and using an icon makes it obvious. The search results will include categories, modules, and a help section related to entered string. Clicking on any of the menu options will redirect the user to the respective module's landing screen, providing a seamless navigation experience.
b. Banking Services
Every bank customer needs banking services whether it be loans, fixed deposits, or fund transfers, among others. We are losing an opportunity to showcase the banking modules to the users. In the old design, we don’t have a separate card for banking services.
b. Banking Services
Every bank customer needs banking services whether it be loans, fixed deposits, or fund transfers, among others. We are losing an opportunity to showcase the banking modules to the users. In the old design, we don’t have a separate card for banking services.
In the new design I have added a separate card for banking services and the modules are backend configured, thus helping banks to push the modules as they wish. Showing them upfront increases better visibility and engagement and in return it helps the bank to generate revenue.
In the new design I have added a separate card for banking services and the modules are backend configured, thus helping banks to push the modules as they wish. Showing them upfront increases better visibility and engagement and in return it helps the bank to generate revenue.
c. Account Card
Account card has been the primary component but it doesn’t look like one. It includes actions to allow users to check their balance, go to FedBook, view all accounts, and also know the type of account they hold. In the old, design there has been inconsistency, the CTAs of “Check Balance” and “View All Accounts” seems the same, while functionality has been different. While “Check Balance” shows the balance itself on the card while “View All Accounts” takes the user to the all accounts page.
c. Account Card
Account card has been the primary component but it doesn’t look like one. It includes actions to allow users to check their balance, go to FedBook, view all accounts, and also know the type of account they hold. In the old, design there has been inconsistency, the CTAs of “Check Balance” and “View All Accounts” seems the same, while functionality has been different. While “Check Balance” shows the balance itself on the card while “View All Accounts” takes the user to the all accounts page.
In the new design, the Account Card has been designed to stand out, out while containing the earlier-mentioned elements. Added icons to the modules which will help in better visibility and identification. I went ahead by adding entry points for a couple of modules -
1. Debit Card, which is earlier in the Hamburger menu. The Debit Card is an important module for any account holder. It made no sense to keep it inside the Hamburger menu, making discoverability hard. Now, in the new design users can access it easily for their needs for limit enhancement, pin change, and block card, among others.
2. Credit Card, which was in the bottom navigation bar. When tapped on the Credit card module, it takes the user to an SDK, where there is no bottom Nav bar. Again, it creates inconsistency. By placing on the account card it has been emphasised along with other modules in the account card.
The 4 modules - FedBook, All Accounts, Debit Card, and Credit Card have similar functionality.
In the new design, the Account Card has been designed to stand out, out while containing the earlier-mentioned elements. Added icons to the modules which will help in better visibility and identification. I went ahead by adding entry points for a couple of modules -
1. Debit Card, which is earlier in the Hamburger menu. The Debit Card is an important module for any account holder. It made no sense to keep it inside the Hamburger menu, making discoverability hard. Now, in the new design users can access it easily for their needs for limit enhancement, pin change, and block card, among others.
2. Credit Card, which was in the bottom navigation bar. When tapped on the Credit card module, it takes the user to an SDK, where there is no bottom Nav bar. Again, it creates inconsistency. By placing on the account card it has been emphasised along with other modules in the account card.
The 4 modules - FedBook, All Accounts, Debit Card, and Credit Card have similar functionality.
d. Prioritisation of modules
There are a number of modules available on the Home Screen for a user. When the old design was made not sure, which module was more often used than others. But now we have data that shows the most used modules, which includes modules from within the parent category.
d. Prioritisation of modules
There are a number of modules available on the Home Screen for a user. When the old design was made not sure, which module was more often used than others. But now we have data that shows the most used modules, which includes modules from within the parent category.
In the new design, all the modules have been organised based on the engagement data which we have been tracking. By adding modules that were difficult to navigate but most often used, will help users to access them more easily and with less friction. And also the decision to accommodate either 4 or 7 modules at a time will allow to create better consistency.
In the new design, all the modules have been organised based on the engagement data which we have been tracking. By adding modules that were difficult to navigate but most often used, will help users to access them more easily and with less friction. And also the decision to accommodate either 4 or 7 modules at a time will allow to create better consistency.
2. Customisation and Promotion
We want to allow users to customise modules based on their needs. In addition to customisation we want to allow banks to promote any particular module for the users.
a. Quick Links
A dedicated card with 4 modules that can be customised, has been added to the new design. It includes all the parent modules which are being offered by FedMobile. Users can add, remove or even move modules within the card.
These are some of the iterations I tried to solve for this problem —
Iteration 1 : Individual Cards
In this iteration, the selected cards are assigned a number. But there were two issues:
1. Not getting a clear picture of what cards are selected and on what priority.
2. When a 5th card is selected, what should happen? Whether it should be First in First out or First in Last out.
2. Customisation and Promotion
We want to allow users to customise modules based on their needs. In addition to customisation we want to allow banks to promote any particular module for the users.
a. Quick Links
A dedicated card with 4 modules that can be customised, has been added to the new design. It includes all the parent modules which are being offered by FedMobile. Users can add, remove or even move modules within the card.
These are some of the iterations I tried to solve for this problem —
Iteration 1 : Individual Cards
In this iteration, the selected cards are assigned a number. But there were two issues:
1. Not getting a clear picture of what cards are selected and on what priority.
2. When a 5th card is selected, what should happen? Whether it should be First in First out or First in Last out.
Iteration 2 : List
In this iteration, all the modules are represented in the form of list items. Users can select as many options as they want but they have to keep only 4 options else they won’t be able to proceed save. Additional option to sort the list items. I found one problem with the design, it is kind of inconsistency because we were using Cards and now this is a list.
Iteration 2 : List
In this iteration, all the modules are represented in the form of list items. Users can select as many options as they want but they have to keep only 4 options else they won’t be able to proceed save. Additional option to sort the list items. I found one problem with the design, it is kind of inconsistency because we were using Cards and now this is a list.
Iteration 3 : Cards with fixed header
Added a fixed header to show the selected options along with the count, to iteration 1. The user can rearrange the options as needed. This clearly portrays what's being selected and in which order. This gives better customisation flexibility for the users.
Iteration 3 : Cards with fixed header
Added a fixed header to show the selected options along with the count, to iteration 1. The user can rearrange the options as needed. This clearly portrays what's being selected and in which order. This gives better customisation flexibility for the users.
b. Label/Tag for highlighting
In the old design, there is no option to promote any particular module. This creates a gap between banks and users. The bank wants to promote a few modules but they can’t efficiently convey them. Banners might work but users generally miss out. Adding a label/tag on each module which the bank wants the user to interact with create differentiation. This allows users to engage with the rest of the modules which they generally don’t use and provides an opportunity for the users to see what offers are being rolled out for them.
b. Label/Tag for highlighting
In the old design, there is no option to promote any particular module. This creates a gap between banks and users. The bank wants to promote a few modules but they can’t efficiently convey them. Banners might work but users generally miss out. Adding a label/tag on each module which the bank wants the user to interact with create differentiation. This allows users to engage with the rest of the modules which they generally don’t use and provides an opportunity for the users to see what offers are being rolled out for them.
3.Additional Changes
Even though we have achieved our objectives to better discoverability, customisation among others. I went ahead and added few changes which I felt will enhance the visual experience. This will give a refreshed feel to the new design compared to the old design.
a. Updated Icons
The new icons for each modules has been redesigned with a new design pattern, thus allowing to user to feel an upgrade to the old design. The new icons have better relatedness, clarity and consistency.
3.Additional Changes
Even though we have achieved our objectives to better discoverability, customisation among others. I went ahead and added few changes which I felt will enhance the visual experience. This will give a refreshed feel to the new design compared to the old design.
a. Updated Icons
The new icons for each modules has been redesigned with a new design pattern, thus allowing to user to feel an upgrade to the old design. The new icons have better relatedness, clarity and consistency.
b. Updated NavBar
The bottom Navigation Bar, in the old design, felt unaligned with the rest of the design. There were no micro-interactions. The updated NavBar has new icons and micro-interactions, thus providing better acknowledgment to user actions.
b. Updated NavBar
The bottom Navigation Bar, in the old design, felt unaligned with the rest of the design. There were no micro-interactions. The updated NavBar has new icons and micro-interactions, thus providing better acknowledgment to user actions.
Designs for Celesta and Minor
FedMobile is being used by 3 primary types of users, 1. Regular users - the largest base, 2. Minors - Under-18 accounts and 3. Celesta - Premium users. Even the core of the FedMobile remains for everyone, but the treatment on the Home Screen is different for each user type. With the new design being shipped out, it is essential to update for the other 2 user types as well.
Design for Celesta and Minor
FedMobile is being used by 3 primary types of users, 1. Regular users - the largest base, 2. Minors - Under-18 accounts and 3. Celesta - Premium users. Even the core of the FedMobile remains for everyone, but the treatment on the Home Screen is different for each user type. With the new design being shipped out, it is essential to update for the other 2 user types as well.
Revamp of subsequent screens
There are few more subsequent screens which can be navigated to, for other modules. To maintain the consistency it is very important revamp the screens and eventually enhance the user experience when compared to the previous design. The redesign icons are sorted based on the data. New modules have been added to Other services taking the tally to 13 when compared to 6 in previous design. This action is taken to improve discoverability.
Design for Celesta and Minor
FedMobile is being used by 3 primary types of users, 1. Regular users - the largest base, 2. Minors - Under-18 accounts and 3. Celesta - Premium users. Even the core of the FedMobile remains for everyone, but the treatment on the Home Screen is different for each user type. With the new design being shipped out, it is essential to update for the other 2 user types as well.
