Over the last four years as Executive Creative Director, I led BBVA’s design team through the organisation’s digital transformation. Now at my own studio Far Co and reflecting back, it was an incredibly exciting and innovative time to be a designer at the bank. A time to create, test, fail, iterate and ultimately transform a global bank into a design-led organisation. Here is a summary of the most important challenges, decisions, milestones and deliverables.
Step Two: Design as an integrated team
The team is growing. More departments of the company know the Design team exists and adds value. Project requests start to pour in. The most important objective during the second phase is organisation. The team, processes, tools and training all need to be standardised in order to scale design to the entire company.
The product creation model is defined
Working in collaboration with the Business and Development teams, we aligned on the process to create digital product — from ideation to deployment and evolution. Our unified goal was to reduce the level of uncertainty around market fit through rapid cycles of design, development, measurement and learning.
Because the business strategy of the bank is to create global products that are reused in different markets, it was important that a global mindset was observed from the beginning of every idea. To begin any new project, it was determined that two countries needed to be engaged to define the project plan—market fit, objectives, requirements and KPIs.
Global UX/UI patterns are created
The base of the global UX and UI patterns were created through the redesign of two core products, one mobile and one web, as well as additional common and frequently-used flows — for example multi-step for services, infographics, sign-up and onboarding. This allowed us to create a solid base of patterns that were standardised, shared and exponentially reused throughout the portfolio of global projects.
Throughout the design phase, some important elements that we uncovered:
- Define and align on the global grid and smallest supported mobile size.
- Adapt Atomic Design to the organisation. Working with the development team we decided that our smallest element would be the component and what that meant. A unified taxonomy and component structure with the development team is critical.
- Design and code one component that scales to support the minimum and maximum amount of content required within different markets. Ideally if planned and designed well, the same component can scale from mobile to web.
And finally, to validate any new pattern before distribution, we tested it in three core but different markets to ensure its usability, made the adjustments needed and then shared with the entire global design team.
The design platform that connects design, technology and business teams
The ecosystem that connects business, design and technology teams in a fluid, controlled environment so that multiple products can be built efficiently and at scale — all from one place. This is the tool that proves the value of design because it allows the team to measure efficiency and translate that to profitability. Naturally we learned a lot through the process of building a custom DSM, but here are the most important points to keep in mind:
- Start with a workshop between Design and Development to define the desired platform, taxonomy, workflow and content needed. The entire creation and build of the platform should be done with complete synergy between these two teams
- Assign a team dedicated solely to creating, managing and updating the platform. This requires 100% allocation of resources to be successful
- Tag everything and make sure levers are built in to measure the platforms use—as well as connecting the platform to Digital Sales metrics
- Define a governance model and team to review, update, and evolve the Design System
- Ideally design and development run at the same pace. If design starts to outpace the development of the components a design freeze with have to be implemented to allow for Development to catch up
The value of the platform and design is measured through the reuse of components and the time saved by using an existing component instead of having to design one from scratch. Using a plugin that quickly identifies the number of reused components within a file the team can calculate the cost savings per project per quarter. It’s significant.
The relationship between global and local
The key here is to define roles and responsibilities. The global team’s role is to define the overall framework of the experience—from a design, marketing and development standpoint—and allow for local adaption and content. Research should always be done at the local level with support from the global team to ensure consistent methodologies.
Through the design process, it was important to design the page templates modularly so that the local markets have the flexibility to adapt and prioritise content to meet their local business needs — without breaking the overall architecture or style of the experience.
Train non-designers to think like designers
A training program was created to foster the design culture inside BBVA in all departments of the bank. A group of over 5,000 “Design Ambassadors’’ were taught design thinking tools and how to adopt a prototyping and iterative mindset. Each had the requirement to return to their respective teams and train their coworkers, creating exponential growth of the design mindset in all parts of the organisation.
Step Two Conclusion
This is the step where standards are put into place and design begins to scale efficiently to the entire company. With a strong effort in organisation, it becomes the phase where the value of design can be proved through clear and measurable KPIs.
In summary, the main milestones in step two:
- The product creation model is defined
- Global UX/UI patterns
- Design platform that connects design, development and business
- The relationship between global and local teams
- Train non-designers to think like designers
Keep reading step three: Design as the shaper of the future. And if you would like more information, you can reach me at brian.farrell@farcostudio.com
