Reducing workload for development and legal teams and minimizing risk by incorporating the Footer into the Design System
TEAMS
Product Manager
Engineering Manager
Legal and Compliance
Marketing and Public Sites
Socialization and Insights
Design System
MY ROLE
Exploratory Research
Product Management
Stakeholder Management
Design Strategy
PROJECT
2 Month Timeline
1 Component
Developers were building footer components from scratch
While investigating, I discovered over 30 unique footers in production. Each contained important disclosures which meant every variation required separate updates and approvals from the legal team. This was creating unnecessary risk and a mountain of redundant work.
Although this story wasn’t part of our sprint, its high impact and low effort made it a clear opportunity. I took the initiative to move forward with the project.
I proposed adding the footer to the existing design system
Benefits:
Reduce build times by using tokens rather than building from scratch.
Creates design consistency across all digital products.
Reduce legal approval times by reviewing 1 component rather than dozens of footers.
Different lines of business can have their own style variants within the same component.
Quickly adapt to changing legal requirements thereby minimizing risk.
Promotes the new design system and its adoption across the organization.
A change of this scale would impact the organization so securing support from all team leaders was essential
Teams Involved:
Product Managers
Single Page App Development Team
Public Sites
Marketing
Socialization and Insights
Legal and Compliance
Design Systems
Design
I spoke with team leads to outline the requirements for the new footer
The data was divided into two categories: legal disclosures and product/marketing.
Legal Requirements:
Product and Marketing:
Footers on unauthenticated and authenticated pages can be the same.
Apple Store and Google Play badges direct to the apps post authentication.
A “Digital Banking Resource” link will be added to the footers.
Use a public footer for the login page since we don’t have pre-authentication data.
Personal and Business banking will need unique UI styles and links.
Link URLs need to be updated to be accurate.
I led discussions on how the component would be built and who would take ownership of the content
Implementation plan:
Changes to the design of the component will go through the Design System Team.
The Design System team will configure the new footer for all platforms.
Future governance:
A style layer will be created for the different lines of business.
Will be able to toggle off and on components to adjust to changing legal requirements.
The component will be pulled from Storybook and supported by the Design System team.
Changes to the content of the component will go through Dev teams.
Links will be determined by the Product team and specific to the lines of business.
We need to take inventory of vendors handling the footer and consider end of life.
Ideation: Working with our Design Systems Manager, we created the component with the features discovered during the intake process.
We needed to be flexible enough to adopt to changing legal requirements. All disclosure components were made to be completely configurable.
Component Properties:
Base Component:
Component with style layer:
Wrap Up
After weeks of meetings, notes, and discussions involving 8 teams, the unified footer was adopted to the design system. The project had very little design involved but it is some of the most impactful work I’ve done in my career. I also had an opportunity to take on more of a Product Manager role which was a great learning experience!
Big Wins:
Our work was recognized by leadership for enhancing a significant risk area.
Development and legal teams were very happy with the new workflow which reduced their work time by 90%.
The risk team estimated that we reduced institutional risk by 10 - 15% due to the system-wide integration of the component.