Redesign: Bank of America Mobile App
UI/UX Design

Role: UI/UX Designer
Duration: 2 weeks
Softwares: Figma, Photoshop, Illustrator
Platform: Mobile app
Background
Bank of America is an innovative mobile banking application with several new self-service features and easier accessibility to frequently used information. Users can manage, transfer, paying their money easily with security.

Why this redesign
Since the pandemic, people tend to avoid contacting with each other. In order to decrease the risk of inflection, some people decide not to go to physical bank branches, but manage their bank accounts with mobile banking application and I am one of this group of users. In this 2 years, I actively use this app and it helps me a lot in my banking experience. However, I also encounter various pain points when using the app. In order to see how can I, as a designer, redesign and make this mobile app more accessible and more user centered.​​​​​​​
Current design
Overview
Overall Pain Points 

・ Confusing layout

・ Messy dashboard

・ Repeated information

・ Not enough hierarchy
Observation
After the observation, I marked 20 problems that need to be fixed in the redesign version

Home
Card Details
Payment Process
Redesign:​​​​​​​
Overall Changes
Change of Color Scheme
Generally, red color in UI design can represent caution, alert, or other negative meaning; therefore, I changed the main color of the app blue from red. Blue represents calm, professionalism and reliability. Furthermore. this blue is not a random blue, but also is the brand color of the Bank of America.
New CTA
In the existing design, some of the CTA are uppercased text but don’t have a clear vision let users know they are tappable. Especially, user with color blind will definitely have trouble navigating this app. In order to solve this problem, I make button shapes for each CTA to let the users know these are tappable CTA.
Redesigned Icons
The tab bar in the existing design have three icons these are based on money signs, which are not representative enough for each function. I redesigned the icon and make the users quickly know the functions of each tabs. Moreover, I removed the name of Zelle from the transfer tab because it might confuses users and let them think they can’t transfer money with using Zelle in the tab.
Text Alignment
The text arrangement in the existing design is not polished enough. For example, the text in the “Your special credit card offer” section from the homepage has more than one uneven weird negative space between elements. Basically, I realignment most of the text in the app and make them in the right hierarchy.
Overview
Highlights 

・ Clean layout

・ Smooth navigation

・ Organized information

・ Polished typography
Home​​​​​​​
Card Details
Payment Process
What was the main challenge in this project?
By doing the research and I myself am a user of Bank of America, I deeply understand how the BOA mobile app was being developed to the existing design. On the other hand, because I know its branding is well developed and stable, it was difficult for me to think out of the box. As I research more about the competitors, I decide to break through the box of restriction and change the main color of the app from red to blue based on my knowledge of UI design and the data from the research. 

Reflection and lesson learned
In the beginning, I was kind of nervous because redesign a well developed brand is not easy and requires various research and decision making; However, I understood that this project is a perfect opportunity to hone and show my design skills.

Looking back on the whole process, redesigning this app and working one this case study reminded me that users are always the center of UI/UX design. Each design decision should be based on how users feels and how the decision helps users to reach their goal of the experience. In this project, I learned about figuring out what works and what doesn't and implementing them in my design. Even though I have walked that long road to this point, learning is never ending. I will research and design more to polish this project in the future in order to enhance my skill.

Thank you for reading this redesign project! If you have any feedback or want to chat with me, drop me a message at shinn303030@gmail.com or connect me on LinkedIn!

You may also like

Back to Top