Redesigning Online Banking: Account Summary
My role: Project Lead, Lead Designer
Project type: Product design: redesign
Year: 2024
Company: BMO Bank, US
The problem
BMO’s online banking design at the start of this project had a split screen on every page, which we’ll refer to as “the 50/50”. It was not an efficient use of space and with massive sales goals on the bank’s roadmap this layout did not allow flexibility for bringing in value-ad opportunities to the page such as offers and promotions, customer insights, etc. The 50/50 design also did not feel in line with BMO’s new marketing campaigns used to heavily canvas the US market and their goal to fight for the position of #3 bank in the U.S. BMO’s online banking needed a face lift and for this project we started with the main hub of online banking pages, the Account Summary page.
Project goal
Phase 1: Redesign the US Account summary page to have a more effecient use of space (move away from the 50/50 split screen) and make room for value-add opportunities like Insights, financial tools and tips, credit profile, and marketing to act more as an account dashboard. Also to modernize the customer experience and help BMO US stand out amongst it’s US competitors as a premium bank.
Requirements and considerations
There needs to be an element of similarity from the existing look and feel, so as not to feel too unfamiliar to customers, while also lightly referencing the Canadian online banking pages.
Out of scope are changes to any UI interactions, functionality, icons, with minimal changes acceptable for content.
Opportunities
Currently BMO’s palette for online banking is blue on blue on blue. It can feel bland and lacking hierarchy. How can we design a page that will allow for future opportunities to bring in more diverse color and elements of delight while still being straight forward and clear.
Competitive analysis
Kick-off and blue sky brainstorming
Finding inspiration
Broad exploration
Research
We decided it would be helpful to user test some wireframes to find out what elements of the Account Summary page were most important to customers, how prominent they should be, and what elements might be better off removed altogether.
For example, we wanted to explore whether or not customers would find it useful or distracting to see a truncated transaction list on the Account Summary page, rather than having to click in to the Account Details page to view their most recent transactions. Out of the 6 individuals we interviewed, most found this more confusing than helpful so we did not move forward with that element. However, we discovered that the majority of our users felt the Savings Goal was very valuable to have on the Account Summary page, so we sought to include it, much to the Savings Goal product manager’s delight.
Design, content, share, revise
With our research findings in hand, I worked closely with my Content partner and our Product partners to hone in the final designs. There were so many parts to this page that all needed to be considered and decided upon, such as: card styles, various different alerts for each account type like overdraft or late payment, quick actions, savings goals, etc.
Final product!
Componetize and socialize
Once we had our final product approved, we built the new elements into components for our Design Library, which was just getting started, and handed the components and pages off to our development team.
What came next was socializing the new design across several teams and QA testing as dev worked on building the page.
More to come
But this was just phase 1! So much more work to do to bring the rest of online banking to this current style and finalizing our strategy and designs for the newly created value add opportunities on Account Summary!
