The development of Internet-banking BelVEB24 for private customers of Bank BelVEB

Bank BelVEB is one of the biggest corporate banks in the Republic of Belarus. In 2017, the prospective development department had a difficult task to update the outdated version within 6 months. The old version had limited functionality and did not provide an acceptable level of comfort when using mobile devices or an HD resolution monitor.

Internet banking belweb, old version

Six months is not a long time, and we had to use the existing Internet banking functionality, and only change the appearance of the template presentation.
But the visual presentation of Internet banking should be completely redesigned. We used METRO design as a conceptual visual style.

Below are a few starting concepts for the visual design of the BelVEB24 design.

Design concept and overall visual style
Design concept and overall visual style

The marketing department has approved this visual concept, and we started to develop a new design of Internet banking.

METRO user interface of Internet-banking BelVEB

The main interface elements are made in the corporate colors of the bank and immediately presented on the initial browser screen. Traditionally, Internet banking should provide the user with the opportunity to immediately interact with his cards and use the functions of the bank (open an account, make a credit card, apply for a loan, open a deposit).

The left position of the navigation menu allows the designer to move the interface elements on the screen easily, if necessary, to adapt the browser on tablet computers and laptops with a resolution of 720p and less.

Key interface elements: Left navigation menu, card selection and duplication of the main functions of Internet banking in the form of four blocks to the right.

The middle of the screen is the workplace of Internet banking, where the program displays all the necessary elements for remote interaction with the functionality of the bank.

The Internet bank is made in the Saas application paradigm. All information is transmitted once to the user's browser, then JavaScript substitutes the interface elements on the screen without reloading the page. Data exchange with bank processing takes place in real time with the help of the developed REST api.

Work with accounts and deposits in the Internet Bank BelVEB

We set ourselves an ambitious task of developing gradually the functionality of the Internet bank and doing the maximum possible number of remote operations. The user should use 100% of functionality through the Internet. This approach can significantly reduce the load on the cash and settlement service and bank department.

Bank deposit and deposit calculator
Bank deposit and deposit calculator

The user can pick up in the online mode the required deposit for the chosen currency. Information about actual deposits comes automatically from the processing of the bank. The calculator online transmits the basic information of the request through api to processing, and it returns a list of appropriate deposits.

After choosing the necessary deposit, the user can immediately send money for crediting. The system will process the request and the user will receive a new one in his personal account.

The functionality of the Internet Bank BelVEB

In the process of development and improvements of the Internet bank functionality, we added a functionality that has some unique features for the Belarusian market. One of these features is the function of withdrawing money from an ATM with the help of a code. You order a cash withdrawal in your account, the system processes your request and sends a special code to your phone. When you come to the ATM, you enter this code and you are given money.

cash withdrawal by code
cash withdrawal by code

We developed a personal financial manager for bank users. The history of your bank transactions is kept in the bank's processing. If you divide the entire history by date and classify it, we can construct circle diagram for each currency.

Payments are classified (food, restaurants, shopping, etc.). The system can work with all your credit cards and three currencies. It fully takes into account both incomes and expenses.

10 Image PFM

Logging in the ISI (Interbank Identification System)

BelVEB Bank became one of the first Belarusian financial organizations, which as part of its processing developed a full integration with the ISI system. This system allows users of any bank, with the help of a common databus, to get access to the system and pass identification. It also system allows you to use the products of any bank without direct appeal to the bank

Logon window of ISI system

The current version of the Internet bank was developed as an independent web application. We designed the application as three independent items.

  • Front-end applications work in the user's browser and display of Internet banking templates and the logic of the elements.
  • The databus is responsible for transferring data through processing to our application and back. The exchange takes place through a secure connection and makes impossible extraneous interference or data loss.
  • Back-end applications interact directly with the processing of the bank and are responsible for storing and processing all user data.

This development paradigm allows us in future to improve and develop the three parts of the application independently. Making changes to the visual design of the user part of the application does not influence on the data exchange layer or the server.

In addition, an important feature is the seamless operation of the application. All data is loaded into the browser independently and the user interacts with the application without reloading the page in one session.

The current version of the Internet bank was developed as an independent web application. We designed the application as three independent items.

An important requirement of the bank was a version of the site for visually impaired people. It was necessary to develop such a visual template that allows you to create a contrast between the text and the interface elements. A good solution to this problem is the using of white elements on a black background, or black elements on white. This allowed us to create two suitable variants of interface design and solved the problem. It is also possible to change the font size of the text for usability.

Version for visually impaired black
Version for visually impaired black

The result of our collaboration is high marks from the relevant portals of the country. In the UX project, Infobank gave 103 points to the retail bank. It made BelVEB the second bank in the country on the number of functions and services. It is significant that all services operate well and without complaints.

Ready to start?