Figma Support Forum

What is the best way to create conditional prototype flows between numerous screens?

TL;DR: Can I realise in Figma that, upon clicking radio button (changing component state) to change the ‘Navigate to’ screen on a button, i.e. by changing the button or it’s state, to let the prototype go to a different screen (i.e. continual prototyping logic)?


I’m working on a project where I’m digitising paper documents to an online platform. It’s basically creating a GoogleForms/Typeform questionnaire (quite large, 150+ fields), with an administration dashboard around it to review data. My issue herein is creating conditional prototyping flows. I would like to realise something in Figma that allows me to skip certain screens depending on component states (i.e. radio button states (yes/no or possibly checkboxes).

Option 1: Duplicating screens with changing Continue buttons
If I want to realise that, if ‘question 1 = A, then continue to screen 2, else skip and continue with 3’, then I see no other way than to duplicate screen 3. This way I can do 1-2-3-X or 1-3-X. And with each additional piece of conditional logic, it gets more complex with more duplicates.

Option 2: Make Component X change state of component Y (but how?)
An alternative, for which I absolutely have no idea how to accomplish, is by having components change other component states. For example, clicking RadioButton → Set ‘ContinueButton’ state to ‘NavToScreen3’. But I’m pretty sure this is not an option.

At this point I’m considering offering Google Forms or something similar that features this conditional logic as a way to visualise the proces and designing a few pages to visualise the look & feel of the form separately. That, unless someone can suggest some ways how to create conditional prototyping logic. This would make Figma so incredible.

Well @Sjeefr as of right know, Figma isn’t great for conditional prototyping.
Most of the times you’ll have to duplicate screens to get these specific interactions.

Example here:

2 Likes