All case studies
Company
Cognizant Netcentric
Role
UX Design, UX Engineering
Date
March 2018 - July 2019
Preview
https://www.bbva.es/
Scaling BBVA's Web Experience: Design System Integration and UX Validation
At Cognizant Netcentric, I worked on transforming BBVA’s web experience by seamlessly integrating the design system into Adobe Marketing tools.
The Challenge:
My role centered on scaling the design system, ensuring it could adapt to new requirements while maintaining consistency across platforms.
A key highlight was the design, prototyping, and implementation of the Mega Menu, a complex navigation component critical to the user journey.
The project followed a data-driven, user-centered approach. We conducted rigorous user testing, A/B testing, and analytics validation to refine the UX.
Additionally, I managed comprehensive documentation in Confluence to ensure clarity and alignment across teams, allowing us to iterate and scale with precision.
This blend of design, technical implementation, and UX validation reinforced the project’s success, ensuring both flexibility and user satisfaction.
Audience reach: Millions of users per day
Company Size: We've worked on an exclusive team of 12 Cognizant employees, in contact constantly with several BBVA Teams
1. Context
BBVA was undergoing a digital transformation, focusing on improving its online experience for millions of users. As part of this effort, they needed to enhance the website's navigation and integrate the company’s design system into Adobe Marketing Tools for consistency and scalability across their digital platforms.
2. Research
We conducted user research and analytics assessments to identify pain points in the current navigation structure. User interviews revealed confusion in navigating the website due to its fragmented architecture. Additionally, we analyzed how inconsistent UI patterns and design system application were affecting user engagement and conversion rates.
3. Challenge
The primary challenge was twofold: First, we needed to redesign the Mega Menu, a critical component of BBVA's navigation system, making it more intuitive and scalable. Second, we had to ensure the successful integration of the design system within Adobe Marketing Tools to streamline the user experience across different touchpoints and devices. This required close collaboration with multiple stakeholders and ensuring all aspects of the design adhered to BBVA’s branding guidelines.
4. Design Process
The process began with rethinking the information architecture of the website, focusing on creating a cohesive and logical flow within the Mega Menu. We iterated on various designs through wireframes and prototypes, incorporating user feedback from usability tests. For the design system integration, I worked closely with both design and development teams to ensure seamless application in Adobe Marketing Tools, focusing on consistency and scalability. Each UI component was carefully adapted to align with BBVA’s brand identity while providing flexibility for future updates.
5. Collaboration
This project required significant cross-functional collaboration. I worked with designers, developers, and marketing teams to ensure that the Mega Menu redesign aligned with both business goals and user needs. Additionally, I collaborated with the design system and development teams to document the process of integrating the design system into Adobe Marketing Tools, ensuring that everything from color schemes to UI elements was consistent across all digital platforms.
6. Results & Metrics
25% increase in user engagement on key pages after the Mega Menu redesign.
15% reduction in bounce rates due to improved navigation flow.
The integration of the design system into Adobe Marketing Tools resulted in a 30% faster deployment of UI components, reducing time-to-market for new features.
Enhanced design consistency led to a 20% increase in user satisfaction scores.
7. Conclusion
The project not only improved BBVA’s website navigation but also established a strong foundation for future digital experiences by integrating the design system into Adobe Marketing Tools. This allowed for greater scalability, consistency, and efficiency in UI development across BBVA's platforms, ultimately enhancing both the user experience and internal workflows.
What needed to be improved:
The documentation process for the Mega Menu was lacking clarity and structure.
Business Goals:
The goal was to create comprehensive documentation to enhance collaboration and ensure consistent implementation.
Key Metrics:
Stakeholders' feedback.
