Figma Support Forum

Bulk design via mirroring

  1. Describe the problem your experiencing and how your idea helps solve this

If a person makes a great many duplicates of something all with a slight variation to each one. For example maybe you have 306 frames all representing a desktop screen - each one having a slight variation from one to the next - in order to create a prototype. Then suppose you discover there is something that needs to be added to every one of them; but, you would have to make that change to each and every one of the frames individually in order to accomplish this.

The idea is that if you have a great many duplicates of something that each vary slightly and then you need to make the same addition / change / deletion to all of them you will end up spending a lot of time and effort making those additions / changes / deletions because you have to do it for each one.

Wouldn’t it be great if all those frames could be selected and the addition / change / deletion that needs to happen could be made to any single one of them but it would be mirrored onto all the rest? Mirrored to all of them!

Select all that need to be changed, change one of them, see the change reflected across them all!

  1. Add as much context as possible (screenshots, Figma files, mockups, etc.)

In that screenshot there can be seen some of the 306 desktop screens in that prototype I’m working on. I haven’t yet made the tweak to each one that will make each one unique (just hadn’t done it yet before taking the screenshot). I discovered that there is an addition and a change that I need to make to every one of those 306 frames (the same change and the same addition).

  1. Ask questions to bring the community into the conversation
    (e.g. Does anyone else experience this? Is anyone using a plugin or workaround to help solve this?, etc.

Wouldn’t it be great if all those frames could be selected and then the addition and change that needs to happen made to any single one of them but it would be mirrored onto all the rest?

In other words… select all 306 frames, make the changes / additions / deletions to one of them, and see it get applied to all of them. Poof! 306 problems solved in one shot!

Think of it like the design tool equivalent to multi cursors you see in code editors.

1 Like

That’s a great idea, I especially like the comparison to multi-cursors in code editors, that makes a lot of sense. Although there is no solution at the moment that is exactly like you described, there are multiple techniques that currently allow you to make different bulk changes:

  1. Obviously components (and styles). Making a change to the main component would propagate this change to all its instances. In the case of screens that wouldn’t work as you frequently need to move objects around in individual screens and components wouldn’t allow that, but if you wanted to simply add a new icon to the sidebar, making this sidebar a component would be a perfect solution.

    In case the object you want to make changes to is not a component yet, but you want to make it into one — you can do that in one click with my plugin Master. Just select this object in all screens and run Create Component from Objects command. It seems like I’m mentioning Master plugin in your threads all the time, but it’s just surprisingly relevant. :grinning_face_with_smiling_eyes:

  2. Check out plugins such as Similayer, Select Similar, Select Layers and the default commands in the Edit menu (Select all with same…). They allow you to select similar objects on different frames. Want to select all red layers with rounded corners? No problem, these plugins could help you with that. And then you can make any changes you want to the selected layers.

  3. If you want to add an object to multiple screens, plugins such as Copypasta and Multipaste can do it.

  4. Want to change multiple texts at the same time? Change Text and Bunch Text Changer plugins would help.

I had another inspiration about this feature too…

What is described so far is like a one to many type relationship. You change one frame and it is reflected across the many (mirrored). But what about adding to that a many to many type relationship where you can select a sub group (multiple frames) from among the total number and the changes you make to that set of frames is reflected across the other sets. For example…

Suppose you have 1,224 screens (each one a frame). That can also break down to 17 sets of 72 screens. Now suppose there is some element across each set of 72 screens that repeats from set to set. Maybe you have an objects displaying a number from 0 through 23 and you place one on every 3rd frame of the set (0, 1, 2, … 23). 23 will land on the 70th frame and then there will be 2 frames with no number at the end. It’s a volume control.

So that is one set of 72 out of 1,224 frames. The remaining 16 sets of 72 frames need to repeat this pattern (displaying the objects showing the numbers in the same manner across each set).

Wouldn’t it be great if you (using a many to many mirroring concept) could select groups of frames (17 groups of 72 to be exact), make all changes across the one group of 72, and have that reflected across the remaining 16 groups of 72 (repeating the patter across all groups of frames).

Those are just numbers I chose from a project I’m working on and were used to create some kind of example to convey the idea. ( You get the picture ).

I think something like that would be really powerful and save lots of people lots of time and effort. It’s a pretty common situation to make a bunch of duplicated frames, thinking you have done everything you need to to the first one before duplicating, and then realize you missed something or get a new idea that you want to implement - but its too late and you have all those frames to make the change to. In that circumstance you would have to delete all the additional frames (leaving just one), make your changes to the one, the duplicate again up to the original amount. What if your situation is such that there is some small difference (maybe to one object in each frame) that carries across all those frames. Then you would not only have to be re duplicating all those frames but going through each one and making the tweak to each one as well. This kind of situation puts you in the kind of conundrum that a feature like this would be perfect for!

In a way this feature is like peeling back the hood of components and variants and allowing you to kind of manually manipulate across whole groups of objects. Yes components and variants already do this but it requires you to get it right from the beginning and not get into a situation like this - and that just doesn’t happen…

People get into a situation like this all that time and this is a feature that would powerfully solve that circumstance.

Actually you could go even further from there and have an ability to create a single component from many objects (not multiple components from multiple objects like we already have but one component from many objects). This could be the culmination to the bulk changes that were made using all the aforementioned about this feature. Once you were happy with all you changes made to one set you could incorporate the set into a component, Figma would recognize that it is just one set in a situation with a repeating pattern (the other 16 sets that repeat that pattern in them) and would prompt you to make variants from the sets (variant for each of the 17 sets). To clarify, I’m not talking about a component containing 72 frames (in this example) but components / variants derived from the 72 frames because Figma recognizes a repeating pattern across the 17 sets.

You could even incorporate this into already existing components (something like an “explode component” or “explode variant” feature? There’s even an application of this explode variant part of the feature that could allow you to apply each of every variant in a variant set to an entire group of objects. At that point it would be past manually manipulating whole groups of objects in one fatal swoop, past saving multiple objects into a single component, past saving sets of objects into variants, and finally being able to toggle back and forth between this feature being described hare and the existing components and variants feature we have now (being able to enter into both modes back and forth as desired).

PS: A couple of those plugins you mentioned are great (since we don’t have a feature like this right now).

Why do you have so many frames? 1224 frames is a huge number! I wanted to also mention that people often struggle with making bulk changes to multiple variants so your suggestions would apply there as well.

Actually you could go even further from there and have an ability to create a single component from many objects

That’s exactly what Master plugin does! (Mentioned in the first point of my previous reply.) Check out this video to see it in action: Master plugin for Figma — Video Guide - YouTube

1 Like

Very nice