Table Design Automation in Figma (Plugin)

A Figma plugin to assist designers in creating consistent and compliant tables

As the Design System Lead, I saw an opportunity to automate table creation in Figma. The existing process for creating tables manually was tedious, inconsistent, and frustrating for designers and product teams. This led to the creation of a Table Generator Plugin that streamlined table building while ensuring compliance with our design system.

Responsibilities

UX Strategy Design System Product Leadership Vendor Management (for Contractors)

Collaborators

2 Developers (Contract)

Date

October 2023 to January 2024

Company

NBCUniversal

A quick demo of the final product.

Challenges

  • Inconsistent table designs across teams.

  • Product owners/managers struggled to create tables in FigJam.

  • Needed to balance depth (complex features) vs. breadth (multi-framework support).


Discovery

  • Confirmed technical feasibility of automation.

  • Gathered stakeholder needs from designers, engineers, and PMs.

  • Hired contractors after getting budget approval.

Since this project was self-assigned, I demonstrated the concept using a Figma prototype in order to acquire the budget for the project.


Key Decisions

  • Focused on deep functionality for full-page tables instead of simple UIs.

  • Added a preview feature to improve user confidence.

  • Integrated Mixpanel analytics to track usage and identify errors.

Outcomes

  • Significant time savings for both designers and product teams.

  • Ensured 100% design system compliance.

  • Next Steps:

    • Exploring AI-generated table prompts to simplify UI.

    • Addressing scalability concerns due to input complexity.