Community Strikes Back — Figma plugin story

Collabs

cover

The earth is a great place to live, and now is a great time to be alive — no bs.

The ability to reach out through the cord, meet people willing to help, and learn from each other is just an astonishing tech achievement in the world where everybody talks about alienation. Have fun. Learn. Show love. Solve problems.

article-01

How to Figma plugin?

Strange things does one require when entering the realm of the 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.

article-02

📼 Let's rewind this a bit

*The sea was angry that day, my friends* — I was battling with unnamed layers, nested auto layouts, furious components, angry cards, ruthless typographic styles, and mystical enemy — an overlay.

Once all of the threats were tamed, everything went calm; the new enemy rose — navigating 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.

article-03

🐉 Enter the Dragon

I had the idea that this had to be somehow possible. So, I turned to the community and checked how this can be done.

Fortunately, at that time the Figma Forum was created so Svarry posted a question and great Mr. Biscuit 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 Figma Community on Slack, and exchanged ideas on how the plugin should work and its main purpose.

Every good design should be invisible and easy to use, so we kept it simple with just two buttons and optional keybinding (since that’s obviously easier).

article-04

🔨 Digging it

We used Figma (ofc) and VS Code Live Share extension, where we worked together on code and tested the plugin functionality. It was all done in a matter of 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 this is a game-changer for layers navigation.

Check out the demo!

This plugin solves the problem of navigating simultaneously multiple instance children.

article-05

🌍 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.

article-06

🔗 Plugin links

If you want to install the plugin and give it a ride, you can find it here — Navigate Multiple Siblings. We reached 250+ installs (which is great!), and the feedback from people was and still is, positive. Have fun using it.

Thanks to Marina and the whole Infinum design team for an invitation to write on Design Islands — ahoy, me hearties! ☠️

More treasures ahead
E95CC837-0713-48B5-BAA1-FC9DD4FA6399Arrrrr!
A true explorer like you is always in search of new quests and gems. How about we send you one every month?
TOP
Ahh, the cookie banner 😩. The first of website frictions, the breaker of UX, mother of privacy lawsuits. State your preference or
manage cookies.