Across the company, there are approximately 10 decentralized teams, each comprised of 2-3 designers. However, there existed unclear design standards for internal applications, and no pattern library was available to source components from. Consequently, this lack of consistency led to variations in the appearance and functionality of applications across the organization.
1. Document all components
2. Work with internal team members to create a pattern library with XD components
3. Collaborate with developers to build react components based on the components ensuring that interactions, spacing, and colors adhere to guidelines
4. Bring everything together into one centralized place (we used Sharepoint for our Design System)
This was a huge task because we have 30+ applications spread across 10 different domains. I went through each application and took screenshots of components we had in each of the applications. Some of the components are pretty standard (such as typography, buttons, font icons, etc.) so those were a little easier to capture.
In addition to the screenshots, I also reached out to each designer to provide me with components that I may have missed while putting together the inventory. I wanted this to be a collaborative effort, so I made sure to include the internal designers as I was working on this. We use Material UI for our front-end framework, so I also reviewed and listed out components from there, noting any overlap or items missing.