Redesign concept for Bank of America

What should a perfect modern banking app look like? We decided to combine a large number of financial features with trendy design solutions to create a mobile app that will become a favorite for users with completely different lifestyles.
Let's talk

About the Client

Neobank is a fintech app startup with a new approach to banking services. The service can help users to view finance flows, make payments, control the balance on all cards, and see expense analytics. 

Client name
John Smith, The Co-Founder
Industry
Fintech
Location
USA

Redesign concept for Bank of America

What should a perfect modern banking app look like?

We decided to combine a large number of financial features with trendy design solutions to create a mobile app that will become a favorite for users with completely different lifestyles.

UX Research
UI Design
Branding
Development
Usability testing
QA
Challenge #1
NeoBank should provide the best UX design that can satisfy users with different demographics and lifestyles.
Challenge #2
NeoBank was seeking a new vision of banking services. It should not be too formal but not too fancy either.
Challenge #3
The Client had a limited timeframe and scheduled investors pitch also, so deadlines were really important.

About the Client

Bank of America has been providing quality banking services to millions of its customers for many years. In the interfaces of their platforms, they adhere to a rather formal style.

We decided to fantasize about the future of many tech startups and the banking industry as a whole. What are modern users looking for in banking apps, which solutions are most convenient for them and how do they choose a favorite banking app? This is how our idea for a redesign concept for the Bank of America app came about. We have decided to create a completely new, better user interface that will change your opinion about the banking experience.

Client name
Jo Mcconnell
Industry
Fintech
Location
USA
Challenge #1
We wanted to visualize the best Bank of America banking app in a more modern and fashionable way. So that customers have digital banking always at hand.
Challenge #2
In our opinion, such a redesign can help with the attraction of a new audience among young people who are usually surrounded by user-friendly and beautiful interfaces. Now everyone cares about the design of the application for digital banking and its functionality, so a great emphasis was placed on UI\UX.
Challenge #3
We were looking for ideas for banking app redesign in the most popular modern applications, made competitor analysis, and conducted many user interviews. It was important to everyone that digital banking was convenient, practical, and aesthetic.

Solutions

1
Quality UX research
NeoBank was looking for innovative solutions for future customers. In order to solve their needs and pains, we had to collect and analyze as much information about them as possible.
2
Design process
The product had to be created from scratch. The founders came to ANODA only with an idea. We clearly structured all processes and discussed the scope of tasks.
3
Modern Interface
We were challenged to provide a simple and user-friendly interface making people's life easier. This financial app should not look too formal like most competitors' designs.

Neobank — award-winning fintech app design

Mobile application design that became Top #1 fintech app design on Behance with thousands of appreciations.

NeoBank needed help with design and iOS development for the new fintech app. They wanted to provide potential customers not only with easy banking service, but also with a great tool for making new good habits on users' way to financial independence.

UX Research
UI Design
Branding
Development
Usability testing
QA

Solutions

1
Quality UX research
We always start with UX research in order to find out all the pain points and needs of the target audience. Online banking app design or personal investment app design, whatever it is about, is always an important visual aspect of the product.
2
Design process
A redesign is no less challenging than design, so we follow the design process to get better deliverables in creating digital banking.
3
Top-notch team
Our team is constantly learning and knows everything about modern trends in the world of design. We can proudly state that a new banking service model is being reinvented by our team of top designers.

Scope of Work

Our main goal was to update and improve the application's design. We planned to make the bank application interface user-friendly so that customers manage was simple and comfortable.

Platforms
Desktop
Mobile Web
Tablet
IOS
Android
Design Tools
Figma
Photoshop
Illustrator
Features
Mobile App
Landing page
Corporate website
Saas Platform
CMS
Admin panel

Project Scoping

To begin with, we adapted our design process to the tasks that will need to be performed for this project. We also had to plan an estimate of the time for each stage of the development of the banking app.

Generation of ideas

While generating ideas, we also looked for inspiration even from popular apps in the category of Fitness and Health, social networks, and other popular platforms. It was important to us that our mobile bank application should not overwhelm the human eye but not be black and white.

UX Research

We started it with extensive competitive research. We researched both large banks that have been on the market for a long time, as well as fintech startups that offer a new approach to banking services. We were able to conclude that the main problem with the online banking app is its lack of practicality.

Customer interview

The next step was user interviews. We conducted interviews with representatives of various demographic groups because the app had to be convenient for everybody. Both students and retirees are the target audience of such mobile banking apps. Lifestyle, financial status, job, mortgage payment expenses, and other things are very important. The lifestyle, personal finances, work, mortgage costs, and other requirements of our clients must be covered by one digital bank.

UI Design

We wanted to combine trendy design solutions with banking features. It was supposed to be a truly innovative approach to banking mobile app creation.

Scope of Work

The founders of NeoBank spent more than a year looking for an agency that would help them with design and development. They understood that they were too busy with other projects and would not be able to devote much time to NeoBank. They needed a team that would also be inspired by their idea and work on it independently enough.
Platforms
Desktop
Tablet
Mobile Web
IOS
Android
Design Tools
Figma
Photoshop
Illustrator
Design Tools
Landing page
Mobile App
Corporate website
Saas Platform
Admin panel
CMS

Scope of Work

The founders of NeoBank spent more than a year looking for an agency that would help them with design and development. They understood that they were too busy with other projects and would not be able to devote much time to NeoBank. They needed a team that would also be inspired by their idea and work on it independently enough.

Platforms
Desktop
Mobile Web
Tablet
IOS
Android
Design Tools
Figma
Photoshop
Illustrator
Features
Mobile App
Landing page
Corporate website
Saas Platform
CMS
Admin panel

Brief filling

First of all, we asked NeoBank to fill out a brief. In it, the founders write in detail about their vision of the future product, its main competitors, its mission and values, and also provided examples of services that inspired them.

Project Scoping

We also realized that there is a very large scope of work ahead. We had to develop the product from scratch. Therefore, we started with clear planning, structuring of tasks, and estimation by time.

Product Design

The main advantage of NeoBank is the emphasis on outstanding user experience. In order to achieve the best deliverables, we had to find out all the needs of the target audience to provide the best product solutions.

Back-end & Front-end Development

The platform had to quickly process a large amount of data, deliver a variety of financial features and allow users to easily access any necessary information.

Native Mobile Development

Since NeoBank wanted to offer its users the most convenient fintech solutions, its founders immediately decided to start with an application.

Result

670h
of ANODA’s team working
146 screens
for Web & Mobile app
4 platforms
for a new fintech product
Jo Mcconnell
Digital banking is developing so quickly that it is necessary to constantly follow news and trends in the financial products design. Large banks sometimes do not keep up with trends, because they are focused on service and providing new financial services.
That's why we wanted to make Bank of America's interface design cleaner and more modern, to create a new cradle banking app design.

Product Design

1

Ideation & Evaluation

We wanted this digital banking app design to be in a modern style and provide personalized assistance on financial issues for each user. In today's busy life, it is very important to get all the necessary information with just a few clicks. We wanted to implement these ideas in the user interface of this banking mobile app.

We started with a big meeting where our team was able to learn more about the project and ask all their questions.

Let's talk
03
Estimation
02
Intro call
01
Brief filling
2

UX Research

We always work according to the design process steps. One of its first steps is UX research. We needed to gather information about the pain points and needs of users, conduct user interviews and create a customer portrait. The following are some of the most common requests: simple withdraw money; send money; private social network; the ability to create savings; open deposit account; the ability to track personal banking; and instant access to customer manage. But the main thing is to support their own startup business and startup founders with their own startup business.

We started with a big meeting where our team was able to learn more about the project and ask all their questions.

3

User flow

After analyzing the UX research insights, we started work on the User journey map. At this stage, it was important to make sure that users easily navigate between features in the app and achieve their goals. Everything must be perfect from the moment of registration to the bill payments. There was already a great emphasis on making the application work equally well on different mobile phone, while online banking app should work at a high level.

We started with a big meeting where our team was able to learn more about the project and ask all their questions.

4

Wireframes

Wireframes are a tool that is relevant for working on any product, such as innovative tech startups or digital banking mobile apps. At this stage, the foundation for a better user experience is created. The largest private bank or application for digital wallet app actiwallet. No matter how large the banking app can be, the frames are the same everywhere.

We started with a big meeting where our team was able to learn more about the project and ask all their questions.

5

Moodboard

We looked for inspiration in modern trendy designs. We were trying to find insights that will allow the bank to demonstrate that it is developing over time and is open to new technologies. Online banking app design can convey these ideas in every element of the interface.

We started with a big meeting where our team was able to learn more about the project and ask all their questions.

6

3 styles option

Next, the department design team developed started working on the banking UI. We wanted to create an online banking app with a personal investment app design. The pages with the transaction history or paying bills features are usually filled with various numbers. We wanted users not to feel confused about such an amount of data and to confidently use financial transactions. So that new accounts can easily navigate the banking app ui and not get lost among a lot of features.

We started with a big meeting where our team was able to learn more about the project and ask all their questions.

7

Final version

We designed 3 style options for the online banking app interface. We usually send them to Clients so they can choose the option they like. This time, we discussed these three options in a team meeting, brainstormed, and settled on one option for the mobile banking app design.

We started with a big meeting where our team was able to learn more about the project and ask all their questions.

8

UI Design

Inter features a tall x-height to aid in the readability of mixed-case and lower-case text. Several OpenType features are provided as well, like contextual alternates that adjust punctuation depending on the shape of surrounding glyphs, slashed zero for when you need to disambiguate "0" from "o", tabular numbers, etc.

We started with a big meeting where our team was able to learn more about the project and ask all their questions.

9

UI Design

Typography & Colors

We started with a big meeting where our team was able to learn more about the project and ask all their questions.

10

All screens

After agreeing on one style option by the example of the main pages, we design all other pages for an application. The app design was everywhere the same and moderately refined. We have consulted with other UI designers about the perfect combination of our requirements and have come up with a very cool visual solution for online banking app design.

We started with a big meeting where our team was able to learn more about the project and ask all their questions.

Product Design

01
Estimate Update
02
Project planning
03
Zero sprint

We deliver in iterations

Thanks to this, the Client receives intermediate deliverables and sees the results of the development, and we can efficiently and quickly close the tasks on the deadlines.
The stack was chosen to ensure the highest app performance even in huge teams. There were several developers, the project manager, and the QA specialist on the project creating this financial product.
Tech Tools:

We started with a big meeting where our team was able to learn more about the project and ask all their questions.

Result
670h
of ANODA’s team working
146 screens
for Web & Mobile app
4 platforms
for a new fintech product
Jo Mcconnell

Digital banking is developing so quickly that it is necessary to constantly follow news and trends in the financial products design. Large banks sometimes do not keep up with trends, because they are focused on service and providing new financial services.
That's why we wanted to make Bank of America's interface design cleaner and more modern, to create a new cradle banking app design.

Product Design

1

Ideation & Evaluation

We wanted this digital banking app design to be in a modern style and provide personalized assistance on financial issues for each user. In today's busy life, it is very important to get all the necessary information with just a few clicks.

We wanted to implement these ideas in the user interface of this banking mobile app.

03
Estimation
02
Intro call
01
Brief filling
2

UX Research

We always work according to the design process steps. One of its first steps is UX research. We needed to gather information about the pain points and needs of users, conduct user interviews and create a customer portrait. The following are some of the most common requests: simple withdraw money; send money; private social network; the ability to create savings; open deposit account; the ability to track personal banking; and instant access to customer manage. But the main thing is to support their own startup business and startup founders with their own startup business.

3

User flow

After analyzing the UX research insights, we started work on the User journey map. At this stage, it was important to make sure that users easily navigate between features in the app and achieve their goals. Everything must be perfect from the moment of registration to the bill payments. There was already a great emphasis on making the application work equally well on different mobile phone, while online banking app should work at a high level.

The next steps were wireframing and UI design. We are also big fans of Pixel Perfect Design, so our UI elements fit perfectly into Wireframes. At this stage, it was time for one more meeting with the Client to approve the way customers use different features on the platform.

neobank sitemap
4

Wireframes

Wireframes are a tool that is relevant for working on any product, such as innovative tech startups or digital banking mobile apps. At this stage, the foundation for a better user experience is created.

The largest private bank or application for digital wallet app actiwallet. No matter how large the banking app can be, the frames are the same everywhere.

neobank-ipad-screen-wireframesneobank-ipad-screen-wireframes
5

Moodboard

We looked for inspiration in modern trendy designs. We were trying to find insights that will allow the bank to demonstrate that it is developing over time and is open to new technologies. Online banking app design can convey these ideas in every element of the interface.
neobank app home screen dashboard
6

3 styles option

Next, the department design team developed started working on the banking UI. We wanted to create an online banking app with a personal investment app design. The pages with the transaction history or paying bills features are usually filled with various numbers. We wanted users not to feel confused about such an amount of data and to confidently use financial transactions. So that new accounts can easily navigate the banking app ui and not get lost among a lot of features.
7

Final version

We designed 3 style options for the online banking app interface. We usually send them to Clients so they can choose the option they like. This time, we discussed these three options in a team meeting, brainstormed, and settled on one option for the mobile banking app design.
neobank portfolio screen
neobank investing screen
8

UI Design

Inter features a tall x-height to aid in the readability of mixed-case and lower-case text. Several OpenType features are provided as well, like contextual alternates that adjust punctuation depending on the shape of surrounding glyphs, slashed zero for when you need to disambiguate "0" from "o", tabular numbers, etc.

We chose a restrained color palette with bright accents. Most often we used a rich blue color. It perfectly fits the style, which is very popular in the digital banking niche. We wanted to make the banking app functional and easy to switch between on the same page, while the service app was clear and easy. 

9

UI KIT

Typography & Colors

Project planning & Zero sprint

After the design was completed, we took time for new planning in the development team. Developers also needed to discuss the technical requirements for the project and choose technological solutions.

Web & Mobile Development

Our team recommended using React.js on the front end, Node.js on the backend, and Swift to build the app. The development was based on 2-week sprints to ensure the right level of flexibility, maximum value, and a constant feedback loop.

Final QA / Testing

Each stage of development is tested, so we are confident in the quality of the delivered product. After we finish working on it, we also do Final QA to make sure it's perfect.

Feature #1
Mobile banking app home page
On the home page of the app, we have displayed the balance of the main card and transactions list. We also added the ability to switch to other features of the platform in just a few clicks. These are things that customers use most often.
While working on the user interface and app design, we focused on simplicity and clearness. Nothing superfluous, only the most necessary information. Users can concentrate on the mobile banking and information they want to receive first after opening the app. Customers can create multiple accounts, send money, check information about the largest russian investment companies, do personal banking, track account history, etc.
Let's talk
Feature #2
Turn purchases into cash rewards
Using the cashback mobile app allows customers to earn money back on purchases. It is one of the tips helping on the way to financial well-being, so this feature is becoming more and more popular. There are separate cashback services, but sometimes these functions have already been added to the online banking app.
In the app interface, we decided not only to show the total cashback balance and recent transactions but also cashback rates for different categories. We also added the "Partners deals" category for specific stores.
Feature #3
Reach your investing goals
A modern banking app is not just a digital wallet for storing credit cards. It has many additional features that help users on their way to financial freedom. In this app, for example, investment opportunities are available in which you can choose your own personal investment app design.
The user of our online banking can check his investment portfolio and general analytics, send money, or vice versa, and get it from someone. Also, users can check their investment portfolio and general analytics at any time. He can also go to the "Stocks" tab to view detailed information about specific stocks and their charts. The UI/UX design will allow you to get visually cool graphics and at the same time be able to look into them and learn about the latest updates on the market. 
Feature #4
Digital banking payments
One of the main missions of digital banking apps is to provide the ability to quickly and conveniently make various transfers. During user interviews, we found several ideas on how to make the "Transfers" page as convenient as possible.
First of all, we designed quick access to various categories of transfers, and also implemented the transfer money by contact list feature. If the user often makes transfers to a certain person, then their profile begins to be displayed at the top in the "Send again" block. This allows for spending less time on such a transfer.
10

All screens

After agreeing on one style option by the example of the main pages, we design all other pages for an application. The app design was everywhere the same and moderately refined. We have consulted with other UI designers about the perfect combination of our requirements and have come up with a very cool visual solution for online banking app design.
Software Development
01
Estimate Update
02
Project planning
03
Zero sprint

We deliver in iterations

The client always receives an intermediate cut of the project. He knows what development processes are at work.

Thanks to transparency of work, all members of the team and the customer know exactly what and by what deadline they are working.

Tech Tools:

Project planning & Zero sprint

Once the design is complete, our design team plans the next steps and development steps. Also, our developers need time to discuss all the details of the technical requirements and choose the right solution.

Web & Mobile Development

Our team works in 2-week sprints to develop the application. This is to ensure the right level of flexibility and maximum results. For building the app we recommend using React.js on the front end, Node js on the backend, and Swift.

Final QA / Testing

We are confident in the quality of the supplied product as each application is thoroughly tested before being published on the marketplaces. Even after the release of the app, we closely follow its work and are always ready if something goes wrong.

Want to create an application?
Let's talk
FEATURE #1

Mobile banking app home page

On the home page of the app, we have displayed the balance of the main card and transactions list. We also added the ability to switch to other features of the platform in just a few clicks. These are things that customers use most often.

While working on the user interface and app design, we focused on simplicity and clearness. Nothing superfluous, only the most necessary information. Users can concentrate on the mobile banking and information they want to receive first after opening the app. Customers can create multiple accounts, send money, check information about the largest russian investment companies, do personal banking, track account history, etc.
Let's talk
FEATURE #2

Reach your investing goals

A modern banking app is not just a digital wallet for storing credit cards. It has many additional features that help users on their way to financial freedom. In this app, for example, investment opportunities are available in which you can choose your own personal investment app design.

The user of our online banking can check his investment portfolio and general analytics, send money, or vice versa, and get it from someone. Also, users can check their investment portfolio and general analytics at any time. He can also go to the "Stocks" tab to view detailed information about specific stocks and their charts. The UI/UX design will allow you to get visually cool graphics and at the same time be able to look into them and learn about the latest updates on the market. 
FEATURE #3

Turn purchases into cash rewards

Using the cashback mobile app allows customers to earn money back on purchases. It is one of the tips helping on the way to financial well-being, so this feature is becoming more and more popular. There are separate cashback services, but sometimes these functions have already been added to the online banking app.

In the app interface, we decided not only to show the total cashback balance and recent transactions but also cashback rates for different categories. We also added the "Partners deals" category for specific stores.
Let's talk
FEATURE #4

Digital banking payments

One of the main missions of digital banking apps is to provide the ability to quickly and conveniently make various transfers. During user interviews, we found several ideas on how to make the "Transfers" page as convenient as possible.

First of all, we designed quick access to various categories of transfers, and also implemented the transfer money by contact list feature. If the user often makes transfers to a certain person, then their profile begins to be displayed at the top in the "Send again" block. This allows for spending less time on such a transfer.

Project planning & Zero sprint

After the design was completed, we took time for new planning in the development team. Developers also needed to discuss the technical requirements for the project and choose technological solutions.

Web & Mobile Development

Our team recommended using React.js on the front end, Node.js on the backend, and Swift to build the app. The development was based on 2-week sprints to ensure the right level of flexibility, maximum value, and a constant feedback loop.

Final QA / Testing

Each stage of development is tested, so we are confident in the quality of the delivered product. After we finish working on it, we also do Final QA to make sure it's perfect.

Delivery & Deployment

This was the last stage in our work on the creation of NeoBank. Now a fintech application has become available to users from all over the world and we were waiting for the first reviews.

Want to create an application?
Let's talk

Contact us

Share the details of your project – like scope, timeframes, or business challenges you’d like to solve. Our team will carefully study them, and then we’ll figure out the next move together.

Project inquiries
HQ:

Kaupmehe 7-120,
10114 Tallinn, Estonia

Got a project on mind?

By sending this form I confirm that I have read and accept the Privacy Policy

Thank you! Your submission has been received!

Oops! Something went wrong while submitting the form.