CLIENT VISTA
ENTERPRISE BANKING APPLICATION
TOOLS
Sketch
KEY DELIVERABLES
Information Architecture, Wireframes & Prototypes, Visual Design
ROLE & DURATION
UX & VISUAL DESIGN
OCTOBER 2019 - DECEMBER 2020
COLLABORATORS
JACK MALPAS-COKER (PRODUCT)
Moisés Pedraza (DEVELOPMENT)
© 2024 Luis Mendoza
Global BBVA alert components
Localized solution, but still following Global patterns & components.
Client Vista in 2019
Re-designed Client Vista in 2020 - Small desktop 1024px
Re-designed Client Vista in 2020 - Large desktop 1200px
Client Vista in 2019
Global BBVA alert components
Localized solution, but still following Global patterns & components.
05 GLOBAL COMPONENT ALIGNMENT
BBVA has 3 main markets where it provides products and services. They’re Spain, Latin America and the U.S. That means that while the design systems and components share similar elements, there are some variables unique to each of the markets. In order to keep track of design updates or contributions, designers from each of the design teams across the globe formed a design team called the Design Federation to ensure adherence to both local and global brand guidelines.
BBVA USA uses the design system from Spain and Client Vista used a legacy design system that was not part of BBVA. As I was designing with the BBVA components I realized that some existing components were not ideal for our use case, so I created new localized components based on existing design elements to better fit our designs. I worked closely with the Design Federation to ensure any new components made followed brand guidelines, U.S. regulations and UX best practices.
Re-designed Client Vista in 2020 - Small desktop 1024px
Re-designed Client Vista in 2020 - Large desktop 1200px
CLIENT VISTA
ENTERPRISE BANKING APPLICATION
ROLE & DURATION
UX & VISUAL DESIGN
OCTOBER 2019 - DECEMBER 2020
COLLABORATORS
JACK MALPAS-COKER (PRODUCT)
Moisés Pedraza (DEVELOPMENT)
KEY DELIVERABLES
Information Architecture, Wireframes & Prototypes, Visual Design
TOOLS
SKETCH
08 some appreciation
07 results
With the launch of the new Client Vista user engagement with the application increased significantly, and bankers reported greater efficiency in processes, leading to a reduction in time required to complete tasks.
ENGAGEMENT
42
+
%
Global BBVA alert components
Localized solution, but still following Global patterns & components.
05 GLOBAL COMPONENT ALIGNMENT
BBVA has 3 main markets where it provides products and services. They’re Spain, Latin America and the U.S. That means that while the design systems and components share similar elements, there are some variables unique to each of the markets. In order to keep track of design updates or contributions, designers from each of the design teams across the globe formed a design team called the Design Federation to ensure adherence to both local and global brand guidelines.
BBVA USA uses the design system from Spain and Client Vista used a legacy design system that was not part of BBVA. As I was designing with the BBVA components I realized that some existing components were not ideal for our use case, so I created new localized components based on existing design elements to better fit our designs. I worked closely with the Design Federation to ensure any new components made followed brand guidelines, U.S. regulations and UX best practices.
06 ux best practices
Along with the full reimagining of the Client Vista experience, one of my biggest accomplishments during this initiative was to create a usability heuristics guideline to help other teams improve the UX in their work.
Re-designed Client Vista in 2020 - Small desktop 1024px
Re-designed Client Vista in 2020 - Large desktop 1200px
02 Cross-functional collaboration
Before I began tackling anything design related, I wanted to start creating a much more open collaborative environment. Not only within my teams, but across all other teams that were part of the larger initiative and the other departments, such as Legal & Compliance, so that every design decision that was made, would take into account every point of view and be the best decision made.
From there I petitioned to start including design in major meetings where design was often overlooked and typically received requirements and feedback from the product owner acting as messenger. Also establishing weekly touchpoints with members of every team, and department involved to ensure communication would be less of an issue.
04 DESIGN
My main objectives with this re-design were to improve the UX, and align the visual design to BBVA's branding and language. I wanted to define a content structure, reduce technical language, observe technical limitations and work with them rather than against them to provide the best experience possible.
Additionally I wanted to reduce visual clutter and make every element in the design clear and purposeful, without needing additional support from other elements to explain it.
03 USER RESEARCH
I was able to do some light research to ensure my design decisions had some data to back them up. A few things that came out of that research were things like the over reliance on archaic back end systems that limited functionality, designing for ultra wide screens, when (after some research was done) more than 80% of bankers used screens no bigger than 1024, and disregard for our grid & layout which resulted in non existent responsive scaling.
01 Identifying opportunities for improvement
I began to voice some of my concerns with the current state of the platform early on when I joined the team, from lack of content hierarchy, language that was too technical and wordy, lack of proper error handling, overuse of iconography and unnecessary explanations on how to do simple things like submitting an application.
Client Vista is an internal enterprise platform used by our bankers at BBVA, to establish new or expand and maintain current financial relationships with both retail and business clients.
This platform is at the core of our banker’s day to day work activity and is an essential tool to help them provide better services and products to our client base.
The initial platform was part of a legacy set of systems that was in place before BBVA purchased what was then Compass Bank. There was an initiative to bring Client Vista in line with current Global patterns and standards but it resulted in nothing more than a half reskin with just a layering of a new color palette and visual elements.
Towards the end of Q3 in 2020, fueled by support from stakeholders, I pushed for a deep redesign of the entire platform so that not only would it fully align to Global patterns but would also vastly improve in terms of functionality, behavior and logic. Which would make our banker’s day to day easier and in turn help improve the overall customer experience.
CLIENT VISTA
ENTERPRISE BANKING APPLICATION
ROLE & DURATION
UX & VISUAL DESIGN
OCTOBER 2019 - DECEMBER 2020
COLLABORATORS
JACK MALPAS-COKER (PRODUCT)
Moisés Pedraza (DEVELOPMENT)
KEY DELIVERABLES
Information Architecture, Wireframes & Prototypes, Visual Design
TOOLS
SKETCH
08 some appreciation
07 results
With the launch of the new Client Vista user engagement with the application increased significantly, and bankers reported greater efficiency in processes, leading to a reduction in time required to complete tasks.
ENGAGEMENT
42
+
%
Localized solution, but still following Global patterns & components.
Global BBVA alert components
05 GLOBAL COMPONENT ALIGNMENT
BBVA has 3 main markets where it provides products and services. They’re Spain, Latin America and the U.S. That means that while the design systems and components share similar elements, there are some variables unique to each of the markets.
In order to keep track of design updates or contributions, designers from each of the design teams across the globe formed a design team called the Design Federation to ensure adherence to both local and global brand guidelines.
BBVA USA uses the design system from Spain and Client Vista used a legacy design system that was not part of BBVA. As I was designing with the BBVA components I realized that some existing components were not ideal for our use case, so I created new localized components based on existing design elements to better fit our designs. I worked closely with the Design Federation to ensure any new components made followed brand guidelines, U.S. regulations and UX best practices.
06 ux best practices
Along with the full reimagining of the Client Vista experience, one of my biggest accomplishments during this initiative was to create a usability heuristics guideline to help other teams improve the UX in their work.
Re-designed Client Vista in 2020 - Small desktop 1024px
Re-designed Client Vista in 2020 - Large desktop 1200px
Client Vista in 2019
01 Identifying opportunities for improvement
I began to voice some of my concerns with the current state of the platform early on when I joined the team, from lack of content hierarchy, language that was too technical and wordy, lack of proper error handling, overuse of iconography and unnecessary explanations on how to do simple things like submitting an application.
02 Cross-functional collaboration
Before I began tackling anything design related, I wanted to start creating a much more open collaborative environment. Not only within my teams, but across all other teams that were part of the larger initiative and the other departments, such as Legal & Compliance, so that every design decision that was made, would take into account every point of view and be the best decision made.
From there I petitioned to start including design in major meetings where design was often overlooked and typically received requirements and feedback from the product owner acting as messenger. Also establishing weekly touchpoints with members of every team, and department involved to ensure communication would be less of an issue.
03 User research
I was able to do some light research to ensure my design decisions had some data to back them up. A few things that came out of that research were things like the over reliance on archaic back end systems that limited functionality, designing for ultra wide screens, when (after some research was done) more than 80% of bankers used screens no bigger than 1024, and disregard for our grid & layout which resulted in non existent responsive scaling.
04 design
My main objectives with this re-design were to improve the UX, and align the visual design to BBVA's branding and language. I wanted to define a content structure, reduce technical language, observe technical limitations and work with them rather than against them to provide the best experience possible.
Additionally I wanted to reduce visual clutter and make every element in the design clear and purposeful, without needing additional support from other elements to explain it.
Client Vista is an internal enterprise platform used by our bankers at BBVA, to establish new or expand and maintain current financial relationships with both retail and business clients.
This platform is at the core of our banker’s day to day work activity and is an essential tool to help them provide better services and products to our client base.
The initial platform was part of a legacy set of systems that was in place before BBVA purchased what was then Compass Bank. There was an initiative to bring Client Vista in line with current Global patterns and standards but it resulted in nothing more than a half reskin with just a layering of a new color palette and visual elements.
Towards the end of Q3 in 2020, fueled by support from stakeholders, I pushed for a deep redesign of the entire platform so that not only would it fully align to Global patterns but would also vastly improve in terms of functionality, behavior and logic. Which would make our banker’s day to day easier and in turn help improve the overall customer experience.
TOOLS
Sketch
KEY DELIVERABLES
Information Architecture, Wireframes & Prototypes, Visual Design
COLLABORATORS
JACK MALPAS-COKER (PRODUCT)
Moisés Pedraza (DEVELOPMENT)
ROLE & DURATION
UX & VISUAL DESIGN
OCTOBER 2019 - DECEMBER 2020
CLIENT VISTA
ENTERPRISE BANKING APPLICATION
Client Vista in 2019
Want to collaborate or just say hi?
luis.mendlendez@gmail.com
luis.mendlendez@gmail.com
© 2024 Luis Mendoza
Senior Product Designer
Dallas, Texas
Senior Product Designer
Dallas, Texas
Senior Product Designer
Dallas, Texas
Senior Product Designer
Senior Product Designer
Dallas, Texas