Optimizing Citibank UAE’s App: Bridging Gaps in User Experience

Optimizing Citibank UAE’s App: Bridging Gaps in User Experience

Product Designer & Manager

My role

Product Designer & Manager

My role

Product Designer & Manager

My role

2024

Year

2024

Year

2024

Year

Banking

Category

Banking

Category

Banking

Category

Intro & Story

Citi Bank UAE providing personal credit cards services.

Users interact with the Citibank mobile app daily to check account balances and recent transactions, top up their credit cards, transfer money locally and internationally, and contact online support for assistance. The app is essential for managing expenses, paying bills, and tracking spending in real-time, allowing users to handle their financial needs without visiting a branch.

Sounds good, but there is some things that can be improved and make user’s experience more smooth.

What Led Me to Challenge Citibank’s User Experience

I'm one of ±200,000 Citibank credit card customers in the UAE, using the app daily. Ironically, after applying and getting approved for a credit card, I still visit a CDM every month with cash. Sounds weird, right? I order breakfast on Talabat, have calls on Google Meet, receive Amazon parcels from US… and then drive 10 km to a Citibank CDM to top up my card.

Why? The first time my payment was due, I couldn’t find an online top-up option in the app, however on website they mentioned it’s available. I called support, and they told me to deposit cash at a CDM. Later, a colleague mentioned I could transfer money via card number using a bank account—a feature that was previously restricted in the UAE but is now available.

This was just my personal experience, but it got me thinking. Beyond these issues, I decided to explore the Citibank app further, looking for potential improvements that could make the user experience smoother. Why not take a closer look and find ways to turn these frustrations into better solutions?

Challenges

It could have ended there, but as a product designer, I naturally see “problems” and “potential improvements” everywhere, sometimes it’s not fair so I explored application reviews on the App Store (iOS) and Google Play (Android) and asked real Citibank users about their experiences.

Luckily, I found a few among my friends, and, of course, they were happy to contribute and share their thoughts.

Based on these conversations, some of my hypothesis was confirmed.

Citibank UAE users face challenges with key banking tasks:

  • The impossibility of topping up credit cards through the Citibank app forces users to rely on cash deposits at CDMs or transfers from other banks if they have that option.

  • Customer support issues – lack of online chat, a clear FAQ, and transparency on which phone number to call for specific support needs.

  • Lack of transaction descriptions, making it hard to track spending and monitor financial movements.

  • Unclear money transfer options – some users were unaware this feature even exists.

  • Additional services and deals – their location and content are unclear. Everything appears as a block of text with stock images, failing to clearly present available services and offers.

These points indicate opportunities for improvement, shaping the foundation for a better, more seamless user experience.

Process

Hypothesis Definition and Creation

Before exploring user opinions, I identified key areas for improvement and documented them to guide my research.

Competitor Analysis

I analyzed competitors to understand what they offer, what they lack, and what we could adapt and enhance to provide a better experience.

Validating the Hypothesis with User Interviews

I conducted user interviews to validate my assumptions. Some hypotheses were confirmed, while others turned out to be less relevant—but the majority were validated.

Customer Journey Mapping

I mapped out the user journey to identify pain points and opportunities for improvement.


Wireframing and Prototyping

For the first iteration, I created wireframes and low-fidelity prototypes to test them with real users. I gathered valuable feedback.

UI Design Implementation

Based on user feedback and my findings, I designed a new UI for Citibank, aligning with their existing design system while incorporating my research insights.

Solutions

Goodbye CDMs, Hello Instant Top-Ups

By introducing a direct in-app credit card top-up feature, Citibank would enable users to make instant payments, minimizing the need for CDMs and external bank transfers.

Solutions

  • Add an in-app "Top-up Credit Card" feature allowing instant payments using Apple Pay and Debit Cards

  • Include an option to pay through CDMs (Cash Deposit Machines) and bank accounts, ensuring these payment methods are clearly mentioned and available for users

  • Enable scheduled auto-payments for due balances

Why These Changes Matter?

For Users: Enhanced Banking Experience
  • More Convenience – Manage finances effortlessly, anytime, anywhere.

  • Faster Payments – Complete transactions instantly without delays.

  • No Need to Visit a CDM – Top up and transfer funds directly in-app, eliminating unnecessary trips.

Business Impact & Growth Opportunities
  • Enhancing Citibank UAE’s digital experience isn’t just about user satisfaction—it also presents a strong revenue opportunity through increased in-app transactions.

  • Retention - a seamless banking experience leads to happier customers, reducing churn and increasing long-term user engagement.More In-App Transactions

  • By removing friction points and making money transfers and top-ups effortless, more users will opt for in-app transactions instead of relying on external banking solutions, driving further growth.

With 60,000 users making an average transaction of 5,000 AED, and a 0.3% transaction fee, Citibank can generate an estimated AED 900,000 in additional revenue from fees alone.

Streamlining Citibank’s Support Experience

Enhancing support system with an online chat feature and a well-organized FAQ section will enable users to resolve issues more quickly, eliminating the need for unnecessary phone calls.

Solutions

  • Integrate AI-powered chat support with an option to escalate to a human agent

  • Create a structured FAQ section with a search function

  • Clearly display the correct contact number for each service

Why These Changes Matter?

For Users
  • Faster Issue Resolution – Get help instantly without long wait times.

  • Reduced Frustration – Clearer support options and a structured FAQ for quick answers.

For Business
  • Significant Cost Savings - Introducing an online chat system and a well-structured FAQ could significantly lower call center expenses.

  • Improved Service Efficiency – Streamlining support reduces workload and enhances response times.

  • Increased Customer Trust – A smoother, more reliable support experience strengthens user confidence in Citibank.

Implementing an online chat system and a well-organized FAQ could reduce call center costs by AED 125,000 to AED 500,000 per month, leading to annual savings of AED 1.5 million to AED 6 million.

Know Where Your Money Goes: Enhancing Transaction Details

Improving transaction clarity will empower users to track their expenses more accurately and manage their finances more effectively.

Solution:

  • Adding the transaction date & time – Helps users verify and recall transactions easily.

  • Displaying the remaining balance at the time of the transaction – Provides better financial awareness and budgeting control.

  • Providing a clear transaction description – Eliminates confusion by specifying merchant names and transaction details.

Why These Changes Matter?

For Users:
  • Clearer Expense Tracking – Easily understand where money is spent.

  • Better Budgeting – More transparency helps users manage finances efficiently.

  • Fewer Disputes – Detailed transaction information reduces confusion and unnecessary support requests.

For Business:
  • Increased User Engagement – A more informative transaction history encourages users to rely on the app.

  • Improved App Usability – A seamless banking experience enhances customer satisfaction and retention.

  • By enhancing transaction details, Citibank UAE could potentially reduce transaction-related support calls by 30-50%.

Estimated savings of AED 30,000 to AED 200,000 per month, or AED 360,000 to AED 2.4 million annually, depending on call volume and resolution efficiency.

In-App Transfers That Just Work: Improving Visibility and Access

Redesigning the money transfer feature for improved visibility and accessibility will encourage more users to opt for in-app transfers over external banking solutions.

Solution:

  • Place "Transfers" in a prominent position on the tab bar with a clear and easily recognizable label.

  • Allow users to choose their preferred transfer type: recurring, single, or installment payments, providing greater flexibility and control over their transactions.

  • The Purpose of Transfer must be clearly explained in Citibank’s provided list, along with the reasons for any limitations. For example, users cannot transfer credit funds to their debit account, but they can use them to pay rent. This clarity will help users understand transfer restrictions and make informed financial decisions.

  • A clear, step-by-step transfer flow can enhance the user experience by simplifying the process.

Why These Changes Matter?

For Users:
  • Easier Access to Transfers – Seamless, in-app money transfers without extra steps.

  • Fewer External Banking Dependencies – Users stay within the Citibank ecosystem instead of relying on other banks.

For Business:
  • Increased Transaction Volume – More users choosing in-app transfers drives higher revenue.

  • Additional Earnings from Transaction Fees – Higher in-app transactions generate consistent revenue from transfer fees.

  • Better Customer Retention – A smoother experience keeps users engaged and loyal to Citibank.

  • Competitive Advantage – Offering a more intuitive and reliable transfer experience strengthens Citibank’s position in the market.

With AED 10 Fee per transaction and 60,000 active users making an average of 2 transactions per month, Citibank UAE could generate approximately AED 1.2 million in monthly revenue or AED 14.4 million annually from transaction fees.

Offers & Services: Making Deals Clear and Accessible

By redesigning the "Get More" section and renaming it to "Offers & Services", with clear visuals and detailed descriptions, Citibank can enhance user engagement with available deals and additional services.

Solution:

  • Introduce a visually structured layout with clear categories.

  • Use icons, personalized recommendations, and interactive elements instead of static text and pictures from stock.

  • Highlight the most valuable offers at the top and personalize them based on the user’s preferences.

Why These Changes Matter?

For Users:
  • Better Discovery of Services – Easily find and access relevant banking features.

  • Easier Navigation & More Relevant Deals – A clearer layout ensures users see and engage with offers that matter to them.

For Business:
  • Higher Engagement in Promotions – Improved visibility drives more user interaction with deals and services.

  • Increased Service Adoption – More users utilizing Citibank’s offerings leads to higher revenue opportunities.

  • Improved Brand Perception – A well-structured, user-friendly experience enhances trust and loyalty.

Projected Annual Financial Impact:

  • Transaction Fees from In-App Transfers: AED 14.4 million

  • Cost Savings from Reduced Call Center Support: AED 3.75 million

  • Additional Revenue from Increased In-App Transactions (20% Growth): AED 2.88 million

Total Estimated Annual Financial Benefit is AED 21 million per year

This demonstrates how a user-centered redesign can significantly enhance both customer experience and business profitability. 🚀


***

In Conclusion

Through user research, competitive analysis, and iterative design, I identified and addressed key usability issues in the Citibank UAE app. By improving credit card top-ups, transaction clarity, money transfers, and customer support, the proposed redesign enhances the overall banking experience, reduces friction for users, and drives substantial revenue growth for the business.

Developer's Notes

Beyond usability and UI improvements, the code quality of the Citibank UAE app also requires attention. As seen in the videos above (grey background showcasing the current Citibank design), certain performance and structural issues are noticeable. Enhancing the app with a modern development approach, optimization techniques, and thorough code reviews would improve its efficiency, stability, and overall user experience.

Key Learnings

  • User education is crucial – Many features exist but are hidden or unclear, leading to unnecessary frustration.

  • Support should be effortless – Users prefer quick, in-app solutions over long wait times and unclear FAQs.

  • Financial management must be transparentDetailed transactions and clear top-up options empower users to manage their money confidently.

This case study reinforced the impact of intuitive design in digital banking and how small changes can significantly improve user satisfaction.

elatysh2@gmail.com

Feel free to contact me if having any questions. I'm available for new opportunities or just for chatting.

elatysh2@gmail.com

Feel free to contact me if having any questions. I'm available for new opportunities or just for chatting.

elatysh2@gmail.com

Feel free to contact me if having any questions. I'm available for new opportunities or just for chatting.