Figma Linting Plugin ☂️

[Rich Kummer]

The problem

A recurring challenge is connecting a particular design to development. Some teams create custom coded elements instead of using Carbon code directly.

The solution

A custom Figma plugin that acts as a design linter, displaying the components and patterns used within a design and aiding with hand-off to development.

Preliminary tasks

Beta Give feedback

1. Linting plugin functional exploration #16550
   area: AI4UX role: dev 🤖 +2
   
2. Identify if CDN links can be pulled in to plugin modal #16500
   area: AI4UX role: dev 🤖 +2
   
3. Identify bringing in IBM Plex to the plugin #16499
   +0
   
4. Collect Figma plugin coding resources #16342
   role: design ✏️ +1
   
5. Identify meaningful information to surface in Figma
6. Identify product specs for testing
7. Identifying the Figma library origin to scope to correct kits
8. Can web components be leveraged in the plugin modal

Design

Beta Give feedback

1. Figma Carbon coverage plugin design exploration I #16692
   4 of 4
   area: AI4UX role: design ✏️ +2
   

Future work

Beta Give feedback

1. Providing additional help on grid usage
2. Providing specific suggestions on how to bring design into Carbon compliance

• Consider mapping links from plugin components to documentation/Storybook/repo.