Building a Figma plugin to solve a UX problem
We spend a lot of time solving problems for clients. So it was a nice change to turn that lens on our own practice recently – not just to improve things, but to keep learning.
One pain point I’ve had for a while is how disconnected persona thinking often is from the actual design process. We create them, we reference them in workshops, but they rarely travel well into the day-to-day of design work.
So I started working on a little plugin.
What it does (so far)
This Figma plugin lets you:
- Create and edit a list of project personas
- Link multiple personas to frames, components, or instances
- Highlight which elements in a design are tied to which persona
- Filter and search personas in the UI
- Export links between frames and personas (JSON or CSV)
- Import new personas from a JSON file
- Assign each persona an emoji or colour-coded avatar with initials
Find the GitHub repo here: https://github.com/hrpr-uk/figma_persona_linker
Why bother?
There are probably dozens of ways to handle this kind of thing with external docs, PDFs, or figjam stickies. But they all fall short the moment you're back in the Figma file building things.
I wanted a way to bring that context directly into the design environment. No switching tools, no asking “who are we designing this bit for again?”
Challenges along the way
- Figma doesn’t allow remote CSS, so figma-plugin-ds has to be bundled manually
- Managing shared data across users needs care clientStorage is private, setSharedPluginData is global but fragile if misused
- You can’t style components or instances directly – so I had to rethink (and I’m still thinking) how to best “highlight” those
- Keeping the plugin useful but not over-designed – it’s tempting to build a UX supertool, but clarity is better than feature overkill
Lessons learned
- If you feel a bit of friction in your own workflow, there’s a good chance a small internal tool could solve it
- Figma is flexible enough that you don’t necessarily need to wait for a product team to fix things – you can have a go yourself!
- Working in public (especially with half-finished things) is a bit daunting, but hopefully helpful
What’s next?
- Connect to a centralised persona API so persona data can be consistent across client projects
- Build a companion plugin for Figma Slides that auto-generates annotated client-ready decks based on linked personas
- Sharpen up the UI and make it more opinionated about how to display and manage larger persona libraries
Try it, fork it, break it
The repo is publicly available. It’s not perfect, but it’s useful, and it solves a real problem we’ve had more than once.
Give it a try, let me know what you think, feature and pull requests welcome!