top of page

Online banking system

Our agency created the online banking system for Citibank, whom provides it to many of its partners, including American Airlines, The Home Depot, Best Buy, etc. The system provides services such as making payments, checking balances, account activity, etc, to the card holders. This product lets users accomplish their tasks easily, by surfacing the most urgent features to the top, and to the front. Functionalities of this product are organized by their urgency, impact to a card holder's balance, and importance to a card holder's account.


What features are needed the most?

Online payment products can be designed in many ways, depending on what the users are looking for in the product. We were wondering about how much functionalities to surface. An approach on one extreme is to turn it into a bank account experience, very much identical to online experiences offered by major banks. On the other extreme is an one button experience with one function only, such as the mobile app Shazam, that allows users to identify songs that are playing nearby, by pressing one button. Creating a complex banking system may make users feel like they own another bank account, and the financial burdens that come with it may be intimidating. They also don't want something too simple, because they do not feel in control of their finance. We went with a rather easy tool that let users pay their balances, view important information, and get the financial burden out of the way. Specifically, the card holders predominantly want to accomplish these tasks:

- Make payments

- View current balances

- View account activity

When we started designing the product, we placed the above 3 features as the most easily accessible, and built other complementary features around these essential features for an easy navigational experience.

Play the video to see the online banking system in action.

 The system strives to be an intuitive system that lets users get to the core features with ease. That is achieved by distinguishing the targeted user's main interests from the complementary features.

The top navigation is separated into 4 items: credit home, payments, statements, manage account.

Credit home

Credit home has the 3 most important features that card holders need to get to the easiest, and allows them to accomplish urgent tasks quickly and easily. The 3 main sections are view balances, making a payment, and account activity. Other functions revolve around these 3 main features. There is a quick link at the top right that says "I Want To...", that allows the user to get to commonly needed features easily. There is an option to switch to another card, if this user has multiple cards. There are options to set up account alerts, paperless, online bill pay, and autopay, all designed to complement the 3 main features.

Credit home


The payments page is all dedicated to one of the 3 main features of the product, making payments. While Credit home has a large section dedicated to making a payment, the payment functions are a lot bigger than just making a payment, so we have created a page just for this feature. Here, the card holder has the options to view balances, upcoming payments, payment history, enroll in autopay, and add payment sources. There are all essential functions that ensure that the card holder can make payments easily and quickly.



The Statements page is completely dedicated to letting the card holder view past account activities, the next one of the 3 main features that the card holders need. Here, the card holder can view / download statements, view recent activity, and last but not least, make a payment if the user believe is needed. Adding the making a payment function here makes the experience smooth, because the user often realizes that making a payment is needed after viewing current activities and statements.


We have thought through the card holder's experience of making payments, view current balances, and view account activities, and created a product that enables them to accomplish these tasks easily and quickly, and provide assistance where needed. The results when customers interact with the products have been generally positive.

bottom of page