Migrating Bank of America’s Erica design system
Rebuilt the naming, structure, and documentation behind Bank of America's Erica AI/DSM component library, turning a fragmented Sketch file into a system other designers could actually navigate.
Role
Experience Design Intern
Skillset
Sketch, Design Systems
Team
1 Designer, 1 Design Mentor
Timeline
Summer 2022, 10 weeks
Jump to solution
overview
I spent summer 2022 with Bank of America's Digital Experience Design team, migrating the Erica AI/virtual assistant design system from a Sketch library into InVision's Design System Manager. The work meant taking each component apart, rebuilding it with clearer logic, and reintroducing it into a system built to be found, not just used.
Because of financial services NDAs, I can't show the original production files, but the graphics below are recreations I rebuilt in Figma from my own process, based on what I delivered at the end of the internship.
THE PROBLEM
Scattered and inconsistent components
Design components that should have lived in one place in Sketch were scattered across unrelated sections of the library and inconsistent naming of components serving the same purpose exacerbated the findability problem.
While maybe not immediately apparent, the cost designers have to pay as a result of this problem is designs, processes, and projects silently demanding more time— time that can be spent much more efficiently with the right design system organization.
THE APPROACH
Consistent nomenclature
The first fix was naming. I restructured every component's name around its official category first, then its specific use case second, so anything could be located by what it was before you even knew where it lived. That single change did most of the work of fixing the library's information architecture — once naming was consistent, components no longer needed to hide in secondary or tertiary folders to make sense.
Doing this well meant actually understanding how each component got used across the product, not just what it looked like. Cleaning up a design system is as much a research task as a design one.
THE SOLUTION
Detailed documentation and proper handoff
Since I wouldn't be there post-launch, the documentation had to stand on its own. I rebuilt it inside the new DSM alongside the component work, writing usage context for each piece so the next designer wouldn't have to guess. I closed out the internship with a session for the AI/Erica team, walking through the new system and where everything now lived.
REFLECTION
Takeaways
Understand the system before you touch it. Most of what made the final library usable came from research into how components were actually being used, not from redesigning them.
Rebuilding from scratch is bigger than it looks. Without existing structure to lean on, even "just renaming things" touches every layer of a system.
Design systems are handoff artifacts. If you won't be around to answer questions later, the documentation has to do that job for you.
Internship Experience
My first time in the Bay Area, and my first time inside an in-house design program, made this internship one of my most formative.
Working alongside my mentor, Mohona, who critiqued my work throughout the summer, taught me how to own a project end-to-end while still knowing when to ask for feedback. I learned so much about product design, and design systems & documentation more specifically, over those 10 weeks, and I'm grateful for the team that made it such a memorable summer.
Migrating Bank of America’s Erica design system
Rebuilt the naming, structure, and documentation behind Bank of America's Erica AI/DSM component library, turning a fragmented Sketch file into a system other designers could actually navigate.
Role
Experience Design Intern
Skillset
Sketch, Design Systems
Timeline
Summer 2022, 10 weeks
Team
1 Designer, 1 Design Mentor
Overview
I spent summer 2022 with Bank of America's Digital Experience Design team, migrating the Erica AI/virtual assistant design system from a Sketch library into InVision's Design System Manager. The work meant taking each component apart, rebuilding it with clearer logic, and reintroducing it into a system built to be found, not just used.
Because of financial services NDAs, I can't show the original production files, but the graphics below are recreations I rebuilt in Figma from my own process, based on what I delivered at the end of the internship.
THE PROBLEM
Scattered and inconsistent components
Design components that should have lived in one place in Sketch were scattered across unrelated sections of the library and inconsistent naming of components serving the same purpose exacerbated the findability problem.
While maybe not immediately apparent, the cost designers have to pay as a result of this problem is designs, processes, and projects silently demanding more time— time that can be spent much more efficiently with the right design system organization.
Consistent nomenclature
The first fix was naming. I restructured every component's name around its official category first, then its specific use case second, so anything could be located by what it was before you even knew where it lived. That single change did most of the work of fixing the library's information architecture — once naming was consistent, components no longer needed to hide in secondary or tertiary folders to make sense.
Doing this well meant actually understanding how each component got used across the product, not just what it looked like. Cleaning up a design system is as much a research task as a design one.
THE APPROACH
Detailed documentation and proper handoff
Since I wouldn't be there post-launch, the documentation had to stand on its own. I rebuilt it inside the new DSM alongside the component work, writing usage context for each piece so the next designer wouldn't have to guess. I closed out the internship with a session for the AI/Erica team, walking through the new system and where everything now lived.
THE SOLUTION
Takeaways
Understand the system before you touch it. Most of what made the final library usable came from research into how components were actually being used, not from redesigning them.
Rebuilding from scratch is bigger than it looks. Without existing structure to lean on, even "just renaming things" touches every layer of a system.
Design systems are handoff artifacts. If you won't be around to answer questions later, the documentation has to do that job for you.
REFLECTION
Internship Experience
My first time in the Bay Area, and my first time inside an in-house design program, made this internship one of my most formative.
Working alongside my mentor, Mohona, who critiqued my work throughout the summer, taught me how to own a project end-to-end while still knowing when to ask for feedback. I learned so much about product design, and design systems & documentation more specifically, over those 10 weeks, and I'm grateful for the team that made it such a memorable summer.
Thanks for visiting!
All Rights Reserved
© 2025