The Creator of the app — financial-technology company “Billing system”, which develops payment solutions for Sberbank and the Central Bank of the Russian Federation. The company is engaged in processing and protecting of payments provides solutions for B2B and B2C markets. With the application of the “Central cashier” the user can pay for various services. Utilities, fines, Internet and more. The main task of a payment system to deliver payments on time.
Suppliers receive the money the next day. The app was launched in February 2015. Today held the global redesign and upgrade. The first updated app for iOS, and it will be the starting point for changing other products of the company.
We started the update with iOS, because the users of that OS would send us more suggestions about refining the product. Their wishes and collected metrics formed the basis of the new design and mechanics work. While working first version, we have modified, upgraded and has increased functionality.
But the application was not ready for a serious change, it does not give opportunities for development. We do wonder whether it is convenient to use such a cumbersome application and find whether the user is a new feature. The application did not help the taxpayers. Users were uncomfortable to make the payments and we couldnt build momentum.
The team undertook analysis and identified major problems. We set ourselves the main task – to reduce the time of the payment from the first touch until notification of successful payment and obtaining the receipt. Any product has its life cycle, after a certain time you need to change in order to keep up with the rapid development of technologies and solutions.
That time has come and for the application of the “Central cashier”. The core team application – 5 persons. Project Manager, art Director, designer, programmer and marketer. Art Director lives in Moscow, the rest were Perm. The main work was conducted online, onsite sessions were held rarely.
We have helped several tools. In the first version we used only basic Analytics. Researched statistics of visits of the individual screens and errors in the application. But we have not analyzed the user experience.
So a couple of months before beginning work on the app update has added hundreds of events to have an idea about the user behavior. We could not rely only on requests in technical support and feedback. Next, we analyzed the audience and made her a behavioral portrait. As a result, we get the division.
In the end we got an idea of what users need, and could match that to business requirements. The result was the roadmap drawn up and agreed upon functionality that was supposed to be in the first release. Each screen took a few iterations.
We are constantly led the discussion on each function or button. A lot of proposals was never implemented because it was impossible; part of innovations we have in store for future releases. For prototyping we used Axure RP. Once the screen layout has been agreed, he was transferred to the designer.
On this screen were tested in an interactive prototype on your mobile device. Thus, once it was possible to determine conveniently whether the user understood the function on an intuitive level. Give a few options we decided to transform after testing. The application can activate and deactivate the attached map using the slider switch.
In the first versions of the design it was so small that it was difficult to get a finger. The decision. We increased the slider. A similar situation with a button to view more details.
After testing has changed the shape and size of the button. After testing the interactive prototype we changed the method of creating the template and repeat payments. In the first version, the user needed, swapit, but it turned out that this characteristic of iOS gesture not obvious. So now if the user clicks on the payment, he will be offered more options.
Repeat, creating a template or view payment details. It turned out that users do not see the possibility of swapit to create a template and redo the payment. To the user it is important to know that his payment is all right, the money spent and received by the supplier. So after making the payment on a separate screen tells you the status of a transaction.
We spent hundreds of hours of tests. Given into the hands of iPhone interactive prototype task, for example to bind the card and watched in silence. Then conducted interviews, which have revealed very interesting insights.
On the left was. On the first screen, only the list of categories. On the right was. From the initial screen you can get into the popular category or selected payments.
The first screen of the payment application to quickly navigate to the payment process and reduce the time of payment from the search provider before the payment notification. Therefore, the screen was divided into several blocks. At the top of the screen are replaced the banners with reminders for users. Here, you will be prompted on the inspection of traffic fines, payment for utilities, mobile phone, most often used by the audience and whats easiest to forget.
In the middle of the screen, where the first falls view located favorite payments. Usually people repeat the same payments. The user simply clicks on the icon of the payment and falls on a screen that already has all the details. This is the most quick method – 5 seconds to charge.
Below are the categories and history to quickly find the right provider or payment. From the tab bar you can go to categories, barcode scanner, chat with support and a menu of additional functions. On the main screen there is a dynamic cap, which displays information that is different for different groups of users.
Ordinary users will see offers to pay for the services, and the owners of e-wallet and even your balance. In the new edition of the screen it was necessary to provide the possibility of an extended flow of information from the service provider to any dataset it easier for users to interact with the application. It was a job for the future. Now the screen looks like this.
The app now has the ability to display in real time a large amount of information from the service provider. It is not only the details and the details of the debt, but also any message. For example, information about the beginning of the heating season or meeting of the owners from the HOA.
The user can track the payment status not only on the screen, but the sound notification. In other payment and banking applications, we have not seen unique sounds for different events, such as successful payment or reject the payment. Users with an e-wallet unique signal reports on the replenishment, they can be sure that the money received, while not distracted from the road. Initially, we wanted to make about eight different sounds, but decided that users would get tired of such diversity.
So left 4 kind of sound. Replenishment of the purse, the answer in the chat from the technical support of successful and unsuccessful payment. All sounds are custom to the user could identify. All audio content was created by the specialist who wrote sound tracks for games.
On the right was. The user sees when the app is fixed code and start to scan. In the application of the “Central office” there is a scanner barcode and QR-codes receipts. Enough using the mobile phone camera to scan the code, and all payment data will be automatically filled in for you.
When you scan a barcode the “loading wheel” we have replaced the animation. Bar appears as in the scanner. This allows you to hide the download of the data and make the appearance nicer. I am opposed to the standard indicators download.
They only bother the user. It seems that the service is slow. Since the application still needs to “think”, we tried to replace such indicators interesting animation. If the user scans the bar code of a company that is not in our database, then the application generates a request and sends it to the sales Department.
That is, we can add service providers, which are interesting to the users. In addition, they can send a request to a specific company in a chat with tech support. No company is lost, we work with all potential suppliers. Now to configure the auto payment has become easier.
At the same time, became more. One of the main objectives of the redesign – to “pump” the auto payments make it easier and more intuitive for the user. In our application, you can configure the automatic payment on two parameters. On the date of payment of the debt.
Now to configure it easier, because we modified the design and were more likely to recall this function. In previous versions, the user needed to choose the frequency, start date, amount and maximum amount. It knocked down the rhythm, so we made setting the serial. Labels and tooltips are much clearer.
The changes affected not only design but also architecture. Our app has the elements of artificial intelligence. It analyzes user behavior and provides alerts if some function is hard to work. The application also offers different options on the welcome screen, depending on different factors.
In addition, we deal with analysis of Big Data. It works on the level of smart tips. The user paid receipt for electricity, and we offer him to pay the bill for gas. Tips are based on the personal behavior of the user and group analysis.
“Billing system” located in Perm. For us history redesign – not just upgrading, which is beneficial to the company. We protect the honour of the Perm region as the capital of the Russian it development. Xsolla, “makroskop”, “Tanki Online” has appeared here.
We strive to make the “Central cashier” one of the best Russian payment systems, and just made one big step of the way. Two months after the launch of the updated version of the application shows that we have obtained the following results. The app is not a static product, it will vary based on user behavior.
Already planned the following changes. The process redesign has affected the whole company. We realized that with the current business processes can not be accurately and timely to respond to user requests. The app is used by over 49 000 people, and we must consider the needs and expectations of each.
New application demanded a new level of efficiency the company. We began to optimize and automate many processes. Support was faster to respond to questions, new providers are added in one day (and soon will be added within the hour). We have learned to anticipate the mistakes and the “plugging” of user and correct them.
For some it looks like magic. For us it is a modernisation, which began with a simple redesign of the app.