Payment Service Development for bePaid

As the first step of this payment service development, the Business Analyst of Rubyroid Labs reviewed all the materials and specifications our client had. After that, our in-house designer started to prepare UI/UX for the future widget. When the design was approved, our full-stack engineer started development.

No Redirects

While payment processing there is no redirect to the website of the particular payment system. We developed this using pop-up window (full-screen on mobile) and, for security reasons, payment widget loads in separated iframe. Now, after payment is finished, user stays on the original website.

Number of payment methods

Before we started working on this project, there was only one payment method available - bank card. After design work and development, there is a menu-bar with the possibility to choose from more than 15 payment methods. The following payment methods were implemented:

Some of these methods work using a redirect. This is because of limitations from the system, not from our side.

Webpack

We used webpack for this product. This means that the code which is written using the latest JavaScript and CSS (stage 0), will be compatible with old and not-supported browsers (For example, Internet Explorer). It helps to optimize the solution for the huge amount of users.

Widget customization

It’s possible to customize the widget in order to meet the business needs of the particular e-commerce website. In parameters of loading of the widget, CSS parameters are transferred in JSON format.

Save card

We added the ability to save card number, name and expiration date within the widget. While processing the next payment, users only need to add CSV code (several cards supported). Card data is stored on the server, and a unique user code is stored on the browser side. For security reasons, all your data (cards and unique user code) can be deleted.