techlist.io
KREN
figma

Bringing the power of our open platform to FigJam | Figma Blog (opens in new tab)

figjamreactjavascriptcssapihtmlfigma-pluginswidgets

Figma is extending its open plugin platform to FigJam, allowing builders to create plugins and interactive widgets. Plugins automate individual workflows, while widgets support collaborative experiences such as polls, voting, and games. The APIs are designed to be approachable for developers familiar with JavaScript, HTML, or React.

An Open Platform for FigJam

  • Figma’s original plugin API aimed to make customization accessible: anyone who can build a website should be able to build a plugin.
  • FigJam extends this philosophy while emphasizing collaboration and shared interaction.
  • Plugins can connect workflows, import real data, and automate repetitive design or brainstorming tasks.

Interactive Widgets for Collaboration

  • Widgets can be dragged directly onto FigJam boards and used by multiple participants.
  • Potential uses include:
    • Voting and polls
    • Games
    • Interactive team activities
  • The widget API is declarative and functional.
  • Developers define interfaces with components such as Frame, Rectangle, Text, and SVG.
  • Event listeners can execute code in response to actions such as clicks.
  • Widgets can include inline property menus similar to native FigJam objects.
  • Synced state allows interactions, such as a counter, to remain consistent for everyone in the file.
  • The API is modeled after React, with components whose properties resemble CSS, reducing the learning curve for React developers.

Plugins for Workflow Automation

  • Plugins are intended to reduce repetitive work and help teams focus on collaboration.
  • Examples include converting CSV data into sticky-note grids or creating sticky notes from text.

Organization and Synthesis

  • Sort sticky notes by color.
  • Add tags for categorization.
  • Extract themes with tools such as word clouds.
  • Count votes using stamp counters.

Task Automation

  • Add features such as spell checking and find-and-replace.
  • Generate large groups of objects automatically, such as 100 colored sticky notes.
  • Existing Figma plugins, including SPELLL, can be republished for FigJam.

Content Libraries

  • Import icons, emojis, logos, and other reusable assets.
  • Planned integrations include Icons8, Material Design icons, Iconify, and Brandfetch.

Customization

  • Plugins can help users apply custom colors, fonts, and text styles, addressing requests for more personalization in FigJam.

FigJam’s open platform combines workflow automation with collaborative interactivity, giving developers a straightforward way to build tools that make brainstorming more efficient and engaging.