/figma-schema

Figma plugin to generate placeholder text, including parametric text with things like date and time arrays, math, and variable interpolation

Primary LanguageTypeScript

Schema — Intelligent Placeholder Generator

Schema is a plugin for Figma that helps designers generate more realistic placeholder text. There are a few plugins available already that do similar things, but I wanted a plugin that would let me do more advanced things like date/time sequences, interpolating variables, and using custom scripts to generate copy.

It's mainly here to scratch my own itch and learn to create Figma plugins, but I'll hopefully push it to production soon.

Development guide

This plugin is built with Create Figma Plugin.

Pre-requisites

Build the plugin

To build the plugin:

$ npm run build

This will generate a manifest.json file and a build/ directory containing a JavaScript bundle for the plugin.

To watch for code changes and rebuild the plugin automatically:

$ npm run watch

Install the development plugin

In the Figma desktop app:

  1. Open a Figma document.
  2. Go to Plugins → Development → New Plugin….
  3. Click the Click to choose a manifest.json file box, and select the manifest.json file that was generated.

Debugging

Use console.log statements to inspect values in your code.

To open the developer console in the Figma desktop app, go to Plugins → Development → Open Console.

See also