Float Availability FigJam Plugin
A FigJam plugin that syncs live capacity data from Float directly onto a team availability board — recoloring each person's card by discipline and appending their open hours for the next four weeks. One click replaces what would otherwise be a manual update across 60+ cards.
Team availability boards are one of those things that’s always slightly out of date. Someone updates Float, but the FigJam board stays stale — and nobody has time to manually recolor 65 cards. This plugin closes that gap: one button pull from Float, cards recolored by discipline, availability summary appended under each name.
How it works
FigJam plugin iframes run with null origin, which means Float’s API — which doesn’t send CORS headers — is completely unreachable from the client. The solution is a thin Netlify proxy that sits between the plugin and Float: the plugin posts a list of names and a date window, the function calls Float server-side, runs the capacity math, and returns clean JSON. The Float bearer token never touches the client. A shared secret in x-plugin-secret guards the endpoint.
On the canvas side, the plugin has to navigate a messier-than-expected board structure. The team availability board uses two card formats: ~65 “loose composite” cards where a SHAPE_WITH_TEXT, a photo RECTANGLE, and a single combined TEXT node (name + title separated by \n) are just siblings overlapping at the same position — not grouped — plus one actual Figma GROUP card. The detector handles both, using spatial overlap math to match text nodes to their parent shape, then caching the original name and title via setPluginData so repeated syncs don’t compound availability lines into the stored baseline.
The build
Detection bugs dominated the early development: cards returning 0 matches (the shape’s own .text.characters was empty, causing a premature rejection), then 1/66 matches (name and title aren’t two separate text nodes — they’re one node with a \n inside), then names getting silently wiped on apply (the combined node was being overwritten starting from the title line, dropping the name). Each fix is documented and locked in the context file so they don’t get re-introduced. Name matching on the Float side uses normalized first+last token matching, with a known edge case for single-word names and initials that gets resolved by correcting the on-canvas card text to match Float exactly — a manual fix, not a code change.
Why it matters
The pattern here — FigJam as a live ops surface, not just a static artifact — is the interesting thing. Float is the source of truth for capacity; FigJam is where producers actually plan work. Keeping those two in sync manually is friction that compounds every week. A plugin that bridges them means the board can be trusted again, which changes how it gets used. The same proxy architecture works for any internal API that lacks CORS support, and the card-detection approach generalizes to any FigJam board that uses photo-plus-label card patterns.
- Role
- Design Engineer
- Tools
- FigJam Plugin API TypeScript Netlify Functions Float API ESBuild
- Metrics
- Automates availability updates across 65+ team member cards in a single sync.