Currently it’s not possible to dynamically set or assign mode variables to a frame or a document. This would be incredibly helpful when it comes to user settings, like change a theme or language, for example.
When prototyping, dynamically setting a mode variable like systemTheme or systemLanguage could then be done through user interactions like clicking a button, to simulate many real-life use cases.
yeah really hope this gets added also. Can change variables, but changing modes seem like missing link. I have to do it variable by variable, or create component variations for each frame of modes.
I want to use a similar approach to create mouse over effects on rows in a table.
+100 to this. For an interaction that only loads variable data of different modes into the same component, it would seriously cut down on the number of frames.
I was just looking for such a possibility. Yes, a prototype with, say, 30 screens, to be switchable from light mode to dark mode in flight would necessitate only those 30 screens. Right now it needs a duplicate of each one of those, so 60. Furthermore, all edits have to be applied twice to those screens in both modes.
Light mode, dark mode and a second language version? Make that 120 screens with each edit performed 4 times.
So, yeah, a long way to cutting number of screens/frames and the drudgery of all those repetitive edits. 🙂
Being able to change the modes of a component upon interaction just makes so much sense and would make my prototypes so much cleaner and easier to configure.
Oh well, I guess I get to choose between having 5x the component states, 5x the frames, or manually configuring 4 variables on 20+ different interactions instead. (psst. Hey Figma, letting us copy actions between interactions might help with that last one!)
Still, I love the new prototyping functionality. Just can’t wait for them to add more / fix more quality-of-life issues!
+1! This can be such a great way to combine multiple variables into a “set” and change all with one “Set Variable” action
This would be awesome!
+1 Definitely be needing this, making it much more efficient. Now you need to add like a million change variable actions which could simply be done with one mode switch.
I have configured read/write modes for my form components. In read-only mode, the field and some controller icons/buttons are hidden.
Currently I have an “Edit” button that links to a different frame where are the same components are, but the frame is in the “Edit” mode. Would be nice to achieve that with an action in the prototype.
This would be incredibly helpful for reducing the number of components I need to use for button state changes (hover, click, etc.)
+1 This one is definitely needed.
However, there should be a system to manage which collection can be edited through a prototype. Not all collections need to be managed inside a prototype. Not sure if this condition should be saved as a collection attribute or a prototype attribute. but it is needed anyway.
+1 to the idea
+1 to the idea as well
Was just looking for a way to do that until I came across this, so +1 from my side as well.
Big up for this request 😉
This would be HUGE. Please add this feature!
This would help a loooot
+100 Huge feature ! 🙏
+1 to this!
Allowing “mode control” would not only simplify my mockups, but also solve some variant swap property issues tied to burying modes as variants deep in the layers of a component.
+1 This could be an incredibly powerful feature in reducing bloat in prototypes.
My example is a mobile keyboard that can update multiple input fields rather than having to have separate keyboards for each field.
Just to keep this thread alive and show how many people want this feature: I am currently building a set of screens to be used in either light mode or dark mode. I have a library with all the colours defined in variables. The library also has all the components I need, and they use those colour variables.
So far, so good. I create the pages in my project file with the library loaded, and I can use the colour variable setting on the page to switch between light and dark modes.
But there is one feature I cannot demonstrate in the prototype: switching between light and dark modes. Instead I need to quickly flip back to the workspace during demos and change the variable.
As it happens, adding themes is a major feature, and it’s awful not being able to demonstrate it.
The benefits of instant mode switching would be amazing if it carried over to our prototypes too, very tedious to have to maintain duplicate screens for other modes right now
Hey All, thanks for the feedback!
We’ll pass this onto our prototyping team for future consideration.
Enter your E-mail address. We'll send you an e-mail with instructions to reset your password.
