Guindo. Interaction Design Studio

Design System for CaixaBank Now

CaixaBank Now is the online banking platform of the financial group CaixaBank, a leader in retail banking in Spain and Portugal, with over 15 million customers. From 2015 to 2024, Guindo worked closely with CaixaBank's internal User Experience team on the functional definition, interaction design, and documentation of the platform's design system, from the conception of components to their technical implementation.

Unifying the Experience Across All Digital Channels

The digital ecosystem of CaixaBank Now exhibited a high degree of fragmentation in pages and patterns, making it difficult to ensure consistency, scalability, and maintainability of the platform.

CaixaBank was committed to an innovative omnichannel offering, aiming to provide a coherent, personalized, and secure user experience across all channels: web, mobile, branches, and ATMs. It was necessary to unify the experience and provide teams with tools and processes that would ensure coherence and accessibility across all digital channels.

User-Centered Design and Close Collaboration with CaixaBank

Guindo led an in-house team of designers and front-end developers who worked closely with CaixaBank's Design Ops team.

The approach was based on:

• User-centered design and accessibility from the requirements phase.
• Comprehensive project support: from requirements gathering, creation and documentation of the design system, to technical implementation and support for internal teams.
• Creation of a modular and scalable design system, with reusable components and clear patterns, ensuring visual and functional consistency across all digital channels.
• Development of comprehensive design and technical usage guides, aligning design, business, and development teams, and facilitating the adoption and maintenance of the design system.

A Modular System with Reusable Templates and Clear Guidelines

Some of the projects executed during the collaboration included:

• Standardization of over 3,000 pages into just 6 scalable templates, simplifying management and reducing maintenance complexity.
• Documentation and deployment of a robust design system, adapted to omnichannel and accessibility requirements.
• Creation and maintenance of two comprehensive guides (design and technical), used by over 60 designers and 100 developers, which improved alignment and facilitated continuous updating and maintenance.
• Ongoing support and training, resolving doubts and ensuring the correct application of components and patterns in all developments.

Greater Efficiency, Consistency, and Improved User Experience

Some of the key results during our collaboration included:

• Visual and functional consistency across CaixaBank's omnichannel digital ecosystem, enhancing the user experience on web, mobile, and other channels.
• Significant reduction in maintenance and development costs and time.
• Substantial improvement in the maintenance and updating of the guides, enabling rapid adaptation to new requirements and channels.
• Greater user satisfaction and universal accessibility, establishing CaixaBank as a benchmark in digital innovation.