Back to Portfolio

Copy Machine Figma plugin logomark

/ 2 min read

Copy Machine

A Figma plugin that grades UI copy with Vale readability metrics so dense text is easy to spot before it ships.

Project Overview

Role: Concept, design, and engineering
Stack: TypeScript, Figma Plugin API, Vale readability formulas
Community: Install on Figma · Source on GitHub

Copy Machine is a Figma plugin I built to score the writing on UI/UX comps before it reaches users. Designers select frames (or text), click Analyze, and get a grade for each scored layer—plus click-to-focus navigation back to the canvas.

All scoring runs inside the plugin. Nothing is sent over the network.

The Problem

UI copy often gets reviewed late—or not at all—because readability tools live outside the design file. Designers end up guessing which paragraphs are too dense to scan, especially on data-heavy screens where labels, helper text, and body copy compete for attention.

I wanted a workflow that stays in Figma: select a screen, see which layers fail common readability thresholds, and jump straight to the offending text.

How It Works

  1. Select one or more frames, groups, components, instances, or text layers.
  2. Run Copy Machine and click Analyze.
  3. Review the overall Flesch–Kincaid grade and per-layer scores.
  4. Click a layer row to select it and zoom the viewport.

Under the hood:

  • Visible text nodes are collected in document order; hidden layers are ignored.
  • Copy under 10 words is not graded (buttons, labels, short UI chrome).
  • The overall grade is Flesch–Kincaid for scored layers only.
  • Skipped layers sit in a collapsed Skipped group with a short reason.

Readability Metrics

Scoring follows Vale’s Readability formulas. English-only for v1.

MetricOn target
Flesch–Kincaid (headline)≤ 8
Flesch Reading Ease≥ 70
Gunning Fog≤ 10
SMOG≤ 10
Coleman–Liau≤ 9
Automated Readability Index≤ 8
LIX≤ 35

Scores can differ slightly from the Vale CLI because the tokenizer and syllable counter are a JavaScript port, not Vale’s Go implementation.

Outcome

Copy Machine turns readability review into a canvas-native habit: spot dense copy on the frame, simplify it, and keep comps aligned with how people actually read UI text.

Last Updated: