Phases

What We Do

Company

Resources

Events

Blog

Free Consultation

ahoy@headway.io

(920) 309 - 5605

6 min
Design System Management - Updates and Communication
Subscribe

Design System Management - Updates and Communication

Billy Sweetman
Head of Design

Once your design system is in production or used by a larger team, new items will need to be added. Components and elements will get created, and we need a strategy to promotes those assets to the core system or one of the sub UI kit files.

We will go through the step-by-step process we like to use at Headway to keep our design systems up to date.

For this example, we'll assume we're using a federated team model where there isn't a single owner, but the team owns it.

What we will cover

  • Setting up your design system project board
  • Nominating and depreciating assets
  • Establishing a design system standup meeting
  • Collaborating with your development team

I also did a presentation on our design system management process that covers everything in this article. You can watch the video below.

Setting up your design system project board

Before your system goes live, it's good to create your design system project board. This can be set up using a kanban board with Trello, Asana, or even Notion. We need a board set up that will allow the team to catalog new components that they would like to nominate for promoting up or depreciating.

Columns in our design system boards

On this board, we set up our columns in a similar fashion to the build process but add a few more columns.

  • To-Do
  • Design
  • Approval / Documentation
  • Depreciating
  • Removed
  • Complete

screenshot of design system project board

You don't have to follow this board setup but it's generally what works the best for the product teams at Headway.

screenshot of left half of design system project board
Above is a closer view of the left half of the board.

To-do

The to-do list might be a carryover from when your project was first started. This might be what's left from your design system checklist and can house components that are still outstanding, and the team would like to get in the system.

Design

This column is used for components the team would like to add to the system or one of the underlying UI kits in the multi-tiered UI kit.

When a designer is working on a project and creates something they need/want to componentize, they can add a card with a link to the Figma frame and where they think it should go. Then the team can discuss in the standup if they believe it should go in or not.

Depending on your structure or permissions, this might be a column to tell the team what is being added. And then the discussion isn't needed.

Approval / Documentation

This column is for components that are set up and completed. Once the team agrees on what should get the go-ahead from the design column or to-do columns and the works is complete they would get moved here.

Components in this column have had the following things checked off:

  • Follows established naming conventions
  • It is using tokens/shared styles and sub-components
  • Constraints are set up correctly
  • Auto layout is set up if applicable
  • All states are set up if applicable
  • It is placed in the correct spot in the design system and is labeled correctly using the management system
  • It is rolled out to a project and is in active use, if applicable

Once this checklist is done, make sure the component is linked to or has written documentation.

screenshot of right half of design system project board
Above is a closer view of the right half of the board.

Depreciating

There are components or styles that the design team is ready to remove from the system. Once an item is identified here, a member from the design team should append a ⚰️ to the name, so the team knows it will be removed.

This is the time to discuss if there will be a replacement component or not. Once an item is marked for depreciating, it is best to give it until the next design system stand up before it's been entirely removed.

Removed

Items that have been entirely removed out of the system go here before they are dragged into complete. This is just a spot to let the team know that it's gone, and they will not find it in the system anymore.

Complete and ready for development

All tasks, when completed and reviewed as a team, will end up here.

Design team standup

Once your system goes live, it's good to establish a recurring design system standup meeting. This can be either once or twice per week.
The standup meeting allows the design team to share new components being creating and discuss items they'd like to nominate to be added to the system. They can also suggest changes they'd like to see to the current system.

photo of design team on zoom call

When working in the federated team model, it's ideal to have the entire team discuss what's being added and removed. Using the board set up above to facilitate the conversation will help keep the design team updated with the latest design system changes.

This is a great time to connect with the development team to see where the live design system might be. Your board might get a bit more complicated when working with the development team, so you might want to think about adding a few new columns. Some of the ones we suggest are in development and design QA.

Development

This column is here to communicate to the development team that this component is ready to be developed in the live system. Once complete, the developer and the designer should re-connect on the documentation side of things.

Design QA

Once a component is in the live system, it's always good to have the design team do a final QA pass on the component before moving it to complete.

Design system management tools

Zeroheight

Create a central hub for designers, engineers, product and marketing teams. Connect everyone working with your design system.

Toolabs

A design system manager plugin for Figma. Define or update design tokens in one single panel, right from Figma and immediately see the changes cascading through your Figma design.

Slack channel

Set up a design system channel on your team's slack for asynchronous communication, short discussions, and quick feedback.

Notion

Notion is an excellent place for documentation and creating a design system project board to manage updates.

More design system resources

Managing Your Design System in Figma

Learn how we manage component status and other assets within our Figma design systems to create clear communication across our design teams.

Multi-Tiered UI Kits for Design Systems

During a product life cycle, teams eventually create smaller or adjacent products to the core product being designed. Those situations are the perfect time to expand out a design system and UI kit.

Design Tokens in Figma Design Systems

Learn how to set up your Figma file and some tools that can help facilitate the tokenization of your design system in Figma.

Design Systems for Beginners

An introduction to creating design systems, including some of the tools and best practices we've picked up along the way for successful design system planning.

Figma Plugins for Better App Design Workflows

Discover our favorite Figma plugins we use in 2021 to help us improve our app design workflows, communication, and build better products.

Make better decisions for your product

Discover a proven method to help you prioritize which features to build first so you can get a faster return on your investment.

You don’t need developers to launch your startup

Start gaining traction in the most important parts of your startup. In this free video series, learn proven tactics that will impact real business growth.

Strategies for startup growth

Give your startup a competitive advantage. In this free video series, learn the common mistakes we see and give yourself a greater chance for success.

Enjoyed this post?

Other related posts

See all the ways we can help you grow through design, development, marketing, and more.

View All

Listen and learn from anywhere

Listen and learn from anywhere

Listen and learn from anywhere

The Manifest

Receive the latest articles, resources, events, and more!