BECU Digital Design Library
Helping develop the BECU design system for the digital BECU space
Introduction
Boeing Employee Credit Union (BECU) is a member focused financial institution that operates primarily in the Washington State area. The project is called the BECU Digital Design Library, a design system for the digital BECU space.
Company
BECU
Teammates
Senior UI Designer, UX Designers
My role
UI Designer
Objectives
BECU’s website and apps were all very similar in colour, but after the rebranding in 2017, a lot of the web apps were not updated to match the new styling. The goal was to have a centralised system that designers and developers could refer to as a single source of truth (like Marvel App). I was a UI Designer working with the Senior UI Designer (Dan) and our team of UX Designers as well as involving the Customer Experience team in discussions.
Process
We began with finding a design system that would work due to the challenges that we faced with our multiple digital channels across BECU. We decided on the Atomic Design system due to its ability to take smaller pieces and combine to create larger components, making it easier to create new components based on the small pieces if need be.
Foundations
We supplemented the Atomic Design system with foundations that didn’t fit in the design system, such as grids and breakpoints.
Prioritising
We prioritised which should be tackled first, by urgency and frequency of use. We also focused on accessibility, making sure the colors and fonts we were using would be high contrast enough to pass WCAG AA standards.
Learnings
I left before the design system could be completed, but one of the main challenges was finding a place to house the design system. I worked primarily in Sketch creating the atoms and molecules we discussed, making sure they would pass WCAG AA standards. Next steps would have involved turning them into a library that all designers could use across Sketch.
Check out some of my other projects
BECU Digital Design Library
Helping develop the BECU design system for the digital BECU space
Introduction
Boeing Employee Credit Union (BECU) is a member focused financial institution that operates primarily in the Washington State area. The project is called the BECU Digital Design Library, a design system for the digital BECU space.
Company
BECU
Teammates
Senior UI Designer, UX Designers
My role
UI Designer
Objectives
BECU’s website and apps were all very similar in colour, but after the rebranding in 2017, a lot of the web apps were not updated to match the new styling. The goal was to have a centralised system that designers and developers could refer to as a single source of truth (like Marvel App). I was a UI Designer working with the Senior UI Designer (Dan) and our team of UX Designers as well as involving the Customer Experience team in discussions.
Process
We began with finding a design system that would work due to the challenges that we faced with our multiple digital channels across BECU. We decided on the Atomic Design system due to its ability to take smaller pieces and combine to create larger components, making it easier to create new components based on the small pieces if need be.
Foundations
We supplemented the Atomic Design system with foundations that didn’t fit in the design system, such as grids and breakpoints.
Prioritising
We prioritised which should be tackled first, by urgency and frequency of use. We also focused on accessibility, making sure the colors and fonts we were using would be high contrast enough to pass WCAG AA standards.
Learnings
I left before the design system could be completed, but one of the main challenges was finding a place to house the design system. I worked primarily in Sketch creating the atoms and molecules we discussed, making sure they would pass WCAG AA standards. Next steps would have involved turning them into a library that all designers could use across Sketch.
Check out some of my other projects
BECU Digital Design Library
Helping develop the BECU design system for the digital BECU space
Introduction
Boeing Employee Credit Union (BECU) is a member focused financial institution that operates primarily in the Washington State area. The project is called the BECU Digital Design Library, a design system for the digital BECU space.
Company
BECU
Teammates
Senior UI Designer, UX Designers
My role
UI Designer
Objectives
BECU’s website and apps were all very similar in colour, but after the rebranding in 2017, a lot of the web apps were not updated to match the new styling. The goal was to have a centralised system that designers and developers could refer to as a single source of truth (like Marvel App). I was a UI Designer working with the Senior UI Designer (Dan) and our team of UX Designers as well as involving the Customer Experience team in discussions.
Process
We began with finding a design system that would work due to the challenges that we faced with our multiple digital channels across BECU. We decided on the Atomic Design system due to its ability to take smaller pieces and combine to create larger components, making it easier to create new components based on the small pieces if need be.
Foundations
We supplemented the Atomic Design system with foundations that didn’t fit in the design system, such as grids and breakpoints.
Prioritising
We prioritised which should be tackled first, by urgency and frequency of use. We also focused on accessibility, making sure the colors and fonts we were using would be high contrast enough to pass WCAG AA standards.
Learnings
I left before the design system could be completed, but one of the main challenges was finding a place to house the design system. I worked primarily in Sketch creating the atoms and molecules we discussed, making sure they would pass WCAG AA standards. Next steps would have involved turning them into a library that all designers could use across Sketch.