C3.AI is an enterprise AI software company that is committed to accelerating digital transformation in various industries ranging from manufacturing, utilities and finance. C3.AI offers both SAAS (software as a service) and PAAS (Platform as a Service) applications to enable engineers to rapidly deploy, deploy and operate large-scale AI applications.

As C3.AI grew, more designs and products were needed. At the time, the process for updating the design library was not transparent or collaborative resulting in delays in creating new components needed by the company and customers.

This was a top priority for the design team I worked directly with the VP of Design, Lead Engineer and a Product Manager for a period of 3 months from September 2021 to November 2021 to improve design operations and processes.

To better understand the problem, I surveyed product managers, the design team and our design system engineers to understand their needs and painpoints around adding new components to the design system and how our process could be improved.

1.The current approval process for adding new components was unilaterally decided by one product manager and other product managers wanted a transparent design system roadmap and involvement in design process and creating specifications.

2. Designers wanted ownership of the design system and collaboration on designing new components. The team also needed clarity on how to design and build new components.

3. Lastly, our design system engineering team wanted an efficient and standard process to create (ideally) modular and reusable components. They also wanted a source of truth for designs and consistent design documentation.

4. Many discrepancies were found in terms of what was required by the product specification vs what was designed in Figma vs what was actually built leading to confusion among all parties.

Standarizing design system documentation

In order to address engineering concerns about consistent and comprehensive design documentation, I worked with the design team to align on a holistic standard that designers could use when creating new components building on various existing guidelines and templates we already had.  This included clarifying in design documentation the component structure and elements, color specifications, typography, size and spacing, interactions and errors and edge-cases.

We decided to continue using Figma to house our design documentation due to its collaborative features and fast updating ability. We also delineated component files as PROD or DEV to address engineering confusion on what was “dev” (i.e., still work in progress or exploratory) vs “prod” (i.e., finalised) component designs

Guidelines for new components

Next guidelines for proposing new components were created based on feedback from product, the design team and engineering to ensure we were growing the design system in a smart and efficient way.

Design system processes for collaboration

Lastly, I also realized we needed to create the processes to support collaboration and alignment. I worked with the SDL product manager, the engineering lead and the design team to create an agreed upon process from design conception to development. We were able to transferr ownership from product to design, faciliate collaboration and enhance transparency throughout the process

As part of the new process, I faciliated a Weekly Design Sync to allow the design team to share new designs of components they were working on. I also hosted a monthly SDL council was to allow engineering, product and design to review proposed new designs and align on a decision while regularly recieving feedback on how to improve the process.

I continually iterated on the process based on feedback and after the 3 month period continued to faciliate design system meetings and answer questions on design system guideines.

Afterwards, the design team was able to work with product managers and the engineering team to grow the design library in an efficient, transparent and rapid pace. In 2021, we were able to support scaling our design system to include complex components like sankey and heat graphs while also building dark mode themes in order to better support our customer's complex analytical needs.