Community Strikes Back — Figma Plugin Story
The ability to reach out through the cord, meet people willing to help, and learn from each other is an astonishing tech achievement in a world where everybody talks about alienation.
🤨 How to Figma plugin?
Strange things do one require when entering the realm of Figma, especially if that feature is non-existing natively and there is no plugin in the vast lands of the community’s plugins. But, a few lines of code or a post on a forum can spark a friendly collaboration and change the course of history.
⏮️ Let’s rewind a bit
The sea was angry that day, my friends… like a designer trying to comprehend Figma’s acquisition by Adobe. I was battling with unnamed layers, nested auto-layouts, furious components, angry cards, ruthless typographic styles, and a mystical enemy - an overlay. Once all of the threats were tamed and everything went calm, the new enemy rose - navigation through multiple layers.
Sneaky stuff, I selected multiple (same) components and tried to simultaneously navigate through - I was stuck 😭. For me, it seemed like a normal Figma pattern and flow, but it just didn’t work.
🐉 Enter the dragon
I had the idea that this had to be somehow possible. So, I turned to the community and checked how this could be done. Fortunately, at that time, the Figma Forum was created, so Svarry posted a question, and the great Mr. Biscuit appeared and answered my prayers with his reply, and that was the start of creating a plugin.
At first, I took the liberty to transform this into a Figma plugin with this rudimentary code, but after talking with Mr. Biscuit, we added a few more things, tweaked it, and published the first version to the community.
🛠️ The process
We reached out to each other in the (ex)Figma Community on Slack and exchanged ideas on how the plugin should work and what its main purpose was. As with every good design, it should be invisible and easy to use, so we kept it simple with just two buttons and optional keybinding.
🏄 Digging into it
We used Figma (of course) and the VS Code Live Share extension, where we worked together on code and tested the plugin functionality. It was all done in a matter of a few days. If you’re a heavy components user, this should come in handy. If you combine it with a plugin such as Content Reel or DataLab, this is a game-changer for layers navigation.
🌍 Bridging the gap
The real value of this whole process was chatting with Mr. Biscuit, learning about culture, bridging +7000 km through the cord, defining, and solving the problem - which is the most important aspect of the design itself.
💜 Have fun, learn, show love, and solve problems
The ability to reach out through the cord, meet people willing to help, learn from each other, and solve problems is just an astonishing tech achievement in a world where everybody talks about alienation.
The Earth is a great place to live, and it’s a great time to be alive - no BS.
🔗 Plugin links
If you want to install the plugin and give it a ride, you can find it here — Navigate Multiple Siblings. We reached more than 1940 views, and cca. 750 installs, which is great. The feedback from people was and still is quite positive.
Hope you’ll enjoy using it!
😎 The Geeks Gathered
Like all good stories, through occasional conversations with Sun aka Mr. Biscuit, I found out he moved to Spain. Around that time, we started working on the revival of the The Geek Gathering conference in Osijek. That was a great opportunity for us to invite Sun over to give us a talk, and to meet in person. It was such a great and positive vibe, and we both agreed to meet again.
ℹ️ Update
Since writing this post, we have updated the plugin to version 4 with support for dark and light themes, added minor UI tweaks, and fixed layer direction navigation.
* Article was originally published to the Design Islands, but the website is no longer around, so I wanted to keep this story live.