Feature: If < min-width => change-to variant

Hey @Niclas_Lundberg, thanks for the feedback!

We’ve updated your topic into a feature request, and we’ll pass this onto our Prototyping team for future consideration.

I second this feature as it would be a huge leg-up using FIGMA for responsive designs.

@Niclas_Lundberg you can do that with variables and conditions.
variable for min width and a variable that control the state of a component and a condition:
if “frame-min-width” == “number” then set variable to…

Yes, I guess that makes sense

Where would I apply this condition, as, as far as I can tell, the only possible way to “trigger” conditions is by input - there arent any “listeners” if you know what I mean

Would love your input to I can learn how to apply this and step up my responsive game

Oh I see, sort of lika null object just to hold information!

Thanks!

Hi Shaul, do you have any examples of this working? I’m having a hard time connecting this concept. I don’t understand where or how to set the variables for the frame width.

Hey @Jeffro, the main idea is to have a component in your main framework that continuously loops, checks conditions, and makes the necessary changes.

where/how to set a variable: first you need a variable that controls the state of your change. the variable needs to be in the type of the field that you need to change, example: width field is a number variable.
check here for more info https://help.figma.com/hc/en-us/articles/15343107263511-Apply-variables-to-designs

Bumping this thread; the suggested solutions using variables and conditionals still doesn't allow to tap into the current size of a frame, in the sense that you can manually resize it (like you can do with a browser window). It might be really useful if it was possible to use a frame size (like the width) in conditional statements of prototypes. 

Bumping this thread; When can we expect this feature? Adding a simple “Window width” trigger to prototype interactions would be a game changer. Proper responsive design is not possible without in figma.