Fintech app – 3S Money

3S Money – business account and payment platform

Secure and modern all-in-one online business account and payment platform, crafted for one-hand use with seamless transitions and great UX.

3S Money app small preview with welcome screen on mobile device with dark green background

3S Money app large preview with welcome screen on mobile device with dark green background

About project

About the company

3S Money Club Limited was founded in 2018, and now has 7 offices worldwide with a total of 200+ employees. Their main goal is to make the global market accessible to businesses everywhere. As a customer-driven company, its Relationship Managers are always there to help clients navigate new payment routes and maximise customer's margins on every transfer.

About project

Projects tasks

In preparation for the project, the following tasks were set:

Create a user-friendly interface

Create a mobile app using Flutter

Attract users from their client portal to the app

UI/UX design process

How did we start?

The client provided an initial design concept and wireframes, which were deemed promising but needed refinement to better reflect their brand and goals. Our designers refined the UI concept to better align with the client's vision, then completed the wireframes and design system, ensuring all necessary elements were included. As a company in the Fintech market, there's a lot of repetition in terms of UI solutions, so our main objective was to make it stand out with unique, yet easy-to-understand UX.

Working closely with the client

During the design process, the 3S Money Design team was very much involved in choosing their favourite options, making decisions, and giving on-the-go feedback for things they would like to improve. This helped us to understand their goals and desires even better.

People sitting in their computers and discussing project related things developers

Customising your accounts

Together, we came up with a unique feature to make customer experience customisable by allowing users to update their account attributes. Account attributes include emojis and background colours for different currency accounts, mainly focusing on more fitting colour schemes and a better overall experience for their users.

3S Money app preview with account customisation screen and emoji icons

Multiple design reviews during the development

To ensure the consistency of every detail while the app was being developed, we performed multiple iterations of design review. This helped us to get the app to a state where everything is where it's supposed to be - even on smaller devices.

3S Money app previews with transfer flow and recipients list screen on mobile device with light green background

Small image preview of people sitting on a meeting in the office

Medium size image preview of people sitting on a meeting in the office

Large image preview of people sitting on a meeting in the office

Development process

Development using Flutter

It's always more convenient to develop something if you have a working example ready— for us it was the 3S Money Client Portal. One of our challenges was to optimise the functionality to reduce the load on the back-end with unnecessary requests when developing these features in the mobile app.

Secure authorisation

As a security-first company, the 3S Money team provided a list of requirements to consider while developing. We implemented a third party 2-Factor authentication solution to ensure that users will always be able to access the app securely, combined with biometric authentication to make login more convenient. We also used native Apple and Google features for seamless user onboarding with prefilled login data from the 3S Money Client Portal.

3S Money app preview with biometrics setup screen on mobile device with light green background

Multiple account management

A business owner with multiple accounts is a typical 3S Money client. Push notifications for different accounts, payment authorisations between multiple accounts for outgoing payments, foreign exchange when depositing, etc., were challenging to manage due to different edge cases.

3S Money app preview with notifications of transfer transactions with light green background

UX for one-hand use

One of the main requirements was that the app should be able to be used easily with one hand. This resulted in multiple improvements and customisations in the navigation and transitions, such as, swiping down to close the screen. And yes - all was done on Flutter.

Features

Transfer

For the transfer money flow, we intended to simplify the UX by splitting the steps into logical parts - selecting a recipient, inputting an amount, providing payment reference and confirming it with DUO 2FA - making it easier for users to complete the transfer.  We mainly focused on crafting clear and easy-to-understand input fields to make the transferring process more convenient and less prone to error.

Payment notifications

While developing this feature, there were many things to consider due to the different types of actions that customers might need. Firstly, to deposit an incoming payment, users should not only be able to choose to deposit to the initial account but also to exchange it to a preferred currency on the go. Secondly, as currency rates change frequently, we focused on automatic rate refreshing and added simple swipe gesture to approve the deposit or exchange even more efficiently.

3S Money app previews with notifications screen on mobile device with light green background

Exchange

Considering the flow on the 3S Money Client Portal, it was quite clear that there was room for improvement when developing this for the mobile app. Our first goal was to improve the UX by removing unnecessary steps. To get the rate instantly after inputting the first amount, we added a debounce for the input field, so users aren't forced to request the rate manually. We introduced a currency swap feature to avoid multiple clicks, as well as a swipe action to confirm the exchange faster. And a lot more new features in the pipeline…

Manage and customise your accounts

This feature was built exclusively for the mobile app. The main goal was to allow users to customise their experience and interface by choosing different colours and emojis for their account attributes, to help distinguish them from a list of different currency accounts. This feature mainly challenged us to find the most suitable solution for the emoji picker implementation, especially considering that native emojis for iOS and Android are different. With that, we ensured a unified pattern for all cross-platform users.

3S Money app previews with account details and customisation screen on mobile device with light green background

Summary

Result

In a 10-month period, we designed and developed the app from scratch and launched it to the app stores, allowing 3S Money’s current clients to conveniently access their accounts.  Hearing excellent feedback from their clients brings us great joy!

3S Money app preview with home screen dashboard on mobile device with light green background

3S Money app preview with account selector with dark green background

3S Money preview with account cards with dark green background

3S Money app preview with transactions history screen on mobile device with light green background

3S Money app preview with home screen dashboard on mobile device with dark green background and currency chips coins falling

Successfully completed

Business without borders. Rapid payments. Premium service. Pay and get paid faster in 190+ countries with an International Business account.

Let’s build products together!