Company: Backbase | Year: 2024 | Platform(s): Web
Improving to support continuous growth
The scope of this project was to redesign the legacy card management experience, specifically two key screens, to provide a more scalable and user-friendly banking solution. The revamp aimed to enhance both the user experience and visual design while aligning with evolving Backbase customer needs.
Scalability
Enhanced architecture to support future growth and capability expansion
User satisfaction
Visually appealing interface designed to boost user satisfaction and engagement
Client adoption
Increased adoption expected with faster time to market for banks
Auditing and refining the experience
As the sole designer in the team owning the Cards capability, I was a key contributor to this strategic initiative. I worked closely with Product and Customer Support teams to discuss and refine how the capability could best scale based on all the features and ideas in our long-term roadmap. This eventually led to redesigning two key screens in the web banking app: the cards overview (I) and the card details (II).
I. Viewing all cards at a glance
The cards overview screen was redesigned to enhance usability and business functionality, aligning with modern banking needs. Key improvements include streamlined navigation and a clearer visual hierarchy.
Improved navigation access
Cards entry point moved to the top navigation for better accessibility, replacing its less intuitive position under ‘Self Service’.
Prominent card acquisition
New feature that allows users to obtain new cards directly within the app justifies its placement as primary action on this screen.
New promotional banner
A marketing banner balances business and user needs, allowing banks to display targeted offers without disrupting the user experience.
Meaningful and flexible card grouping
Cards are grouped into ‘Physical’ or ‘Virtual’, reflecting usage trends and making it easier to manage multiple cards. Additionally, collapsible sections reduce clutter and improve navigation.
Enhanced card overview
The updated layout offers a more elegant look, balancing information legibility and card imagery. This approach aligns with accessibility best practices, ensuring all users can easily identify card information.
Efficient card management
Frequently used and important card management actions are just a click away through a new dropdown menu, helping users being more efficient.
II. Managing a specific card
The card details screen was redesigned to offer a more cohesive and empowering experience when focusing on a specific card. Key improvements include enhanced layout clarity and intuitive access to all card management tasks.
Card name customization
Users can personalize their card names directly from the page title, enhancing identification and ownership.
Clear card information
Card information is reorganized in the new top section, making key details like status and last 4 digits immediately visible.
Prominent quick actions
Two quick action buttons are also added to the top section, providing quick access to card information and security.
Consolidated card management
The remaining actions are presented in a scalable stacked grid layout, with added features such as account linking, spending limits, and card cancellation. This new structure improves content hierarchy, offering a more intuitive experience.
Card-specific transactions
Transactions are now displayed below card management options, enabling users to better monitor spending and manage finances for an individual card.
Design-driven product success
This revamp is planned to happen progressively over the next year and is key to maintaining Backbase’s leadership in user-centric B2B digital banking services. Throughout this project, I realized the power of good design and UX in inspiring the team with a vision and driving product success. As each batch of improvements is launched, we will monitor performance and gather customer feedback to guide future iterations.
