Challenge
When I joined National Bank of Canada, some UI guidelines were in place, but adoption was low due to outdated components, lack of documentation, and inconsistent implementation. Replacing the UI entirely was not an option, so we had to find a way to modernize the front-end while maintaining stability and security.
Approach
I helped build a new codebase that could progressively replace the legacy front end. By working across disciplines and starting with fundamental components like buttons and headings, we minimized disruption and established a foundation for future work.
As the team adopted the system, we expanded its scope, built comprehensive documentation, and created a culture of shared ownership. Through training sessions and open contributions, designers and developers shaped both the technical and visual standards.
Results
The system improved UI consistency and reduced lead times across projects. A shared design language helped designers and developers work from the same foundation, with a clearer understanding of both UX and technical constraints. What began as a focused effort grew into a dedicated team supporting hundreds of people across multiple platforms.
Lessons
Leading a change of this scale, across both technology and team dynamics, taught me the value of gradual replacement. Strong executive support gave us room to modernize the front end without an all-at-once rewrite, while visible progress and team testimonials helped build trust along the way.
This experience shaped how I approach design systems: not just as a set of UI components, but as a strategic tool that aligns teams, improves workflows, and fosters collaboration.
