Case Study: Redesign BCA Mobile
Hi everyone! This is my first project, redesigning one of the most popular banking applications BCA Mobile or m-BCA. This project consists of 4 members including me, who are still quite new in UI/UX design. Without further ado, let’s jump to our case study!
Research
As you all know, BCA is one of the largest banks in Indonesia, so, in order to give a much better experience for their customer, BCA made an app called m-BCA for mobile in 2012. Since then, this app has been downloaded by over 10 million users.
This application has been launched for almost 10 years, but we don’t see any significant changes. We feel that this application needs some changes to improve its designs. So, after knowing that, we conduct user research, and our target is a housewife that uses BCA mobile.
Persona
As you all know, pandemics have been keeping us from going outside, so, we decided to conduct an interview with our parents since they also use this application. After we did the research, we made this persona using the data that we gather. By interviewing real users, we got lots of insights and of course the pain point, that can be used for our project.
Sitemap
We made some changes to this application, so, this is our new sitemap, hoping that this sitemap will help m-BCA better. There are some changes that I will point out later below, in m-Payment, so you can check it out!
Design Guideline
We made this guideline to standardize our design, from typography, color set, even to icon set. With this guideline, we are able to make our design more consistent. For the tools, we use Figma for our prototyping and photoshop to edit photos and icons.
Prototype
After all that processes, it’s time to redesign this application! Here, I will give you some of the examples before and after the redesign process. Hope you like it!
Homepage
We redesign this homepage because we feel that this design is quite outdated compare to other banking applications. So, we made this homepage feel modern and minimalist. We also did quite a research and see, that there are no many people use the navigation bar, other than QR code. So, we decided to remove it and replace it with just a floating button QR code and made the notification on the header.
Not only that, looking through our research we found that, there are users who want to check their balance easier. But, there are also users who feel that it is okay to check their balance like they use to because it is safer. After much consideration, we decided to put their balance on our homepage since it is easier, but we also hide it and users must touch the eye icon first. We thought that this solution will help both users since it is easier, but also safe.
Notification
After we examine this app, we are quite surprised to see that there is a notification on each menu, such as m-Info, m-Transfer, etc. After that, we see that the notification on the navigation bar is not working as it is supposed to do. So, we combined all those notifications into one and put them on the application header. In order to make it more sorted, users can select what notification they want to see on that dropdown.
m-Transfer
In m-Transfer, we didn’t make any significant changes to its layout. But, we made it a bit different on “Transfer ke”, user can directly change its option such as Sesama BCA, BCA Virtual Account, etc. If the user changes it, the app will automatically change its layout.
m-Admin
In m-Admin, we also made view changes, where we combine “Akun Saya” in the navigation bar, with m-Admin. As you can see the display is a bit different, where we made those horizontal scroll tab. We feel that this will help users to search for something easier because there is a section that differs each function.
m-Payment
In the old design, there is m-Commerce and m-Payment, we see that this menu is similar. Therefore, we combine that two menus into one and named it m-Payment, because its function is to pay something. We split those two using a horizontal tab, and name it “Pembelian” for m-Commerce and “Pembayaran” for m-Payment.
Final Prototype
After many months of work, finally, we have done all the work that needs to be changed. Here, I present to you our final prototype and you can try it yourself to see our design, by clicking here.
Conclusion
First of all, I would like to thank my mentor Mr. Tobias Warbung, S.Sn., M.Ds. for helping us to reach this point, and also my team Ardie Wijaya Eka Putra, Annetta Carolina and Kenneth Jonathan, because, without them, it will be very hard to complete this project.
Although we know, that there is still room for improvement, we have done our best, hoping that you like it. In case you have any feedback, you can always comment here or you can visit my website here. Thank you very much!
