Banq is a concept designed to showcase best practices of creating a banking app. With a scalable design system and modern look.
Fintech has become an integral part of our daily lives, when considering the apps we use to make payments, and manage our money.
After researching all the most popular apps within fintech, I noticed that many of them still have design inconsistencies.
If a user opens the app without being logged in, three slides that can be swiped presenting the main benefits of the app are shown.
A conclusion that many product designers have reached, is to create a single page for sign up and login. This makes a lot of sense, considering that both features in this case require a code received by SMS to proceed.
The following part of the onboarding flow shows how the sign up process works. Login works in a very similar way, but only asking for the SMS code and PIN number.
On the home screen, we can see a summary of the information that is the most useful to the user. Such as balance for each currency, and recent transaction history.
We can also see an 'Insights' section with two different cards. One for spending statistics, and the other one visualizing a savings goal.
Furthermore, we can see the outlines of the transactions, individual transaction information, spending, and savings screen.
The most important part of a banking app is payment logic. Here we can see the initial screens for the cards overview, payment, and top-up with the option to add money to the account.
We can also see the account screen with an overview of options, and an upgrade button highlighted in blue.
The Banq app is supported by a website. It follows the same design methodology, and acts as a way to promote and educate potential customers on the product. The source file can be viewed here.
To make the design scalable, and easier to hand over to a developer, the design for both mobile and web are organized as design systems.
As different needs emerge in the future, these design systems can be expanded upon to accommodate more functionality.