Using key/gamepad interactions to select a variation

Hello - I am very new to Figma so apologies if this has a really obvious answer! (and also if I get any terminology wrong…)

Scenario: a component group has say 5 variants. I would like to add prototype interactions using the key/gamepad option that allows me to call each of the 5 variants by pressing a key assigned to that variant (e.g. numeric keypad 1-5 calls variant 1-5). So far, I have this working by connecting each variant to every other variant so, no matter what variant was last called, pressing keypad 1 calls variant 1 etc. This seems a very long way to achieve something that should be a lot easier, but the only option appears to be you have to connect one variant to another and assign a keystroke to that connection, rather than simply assign a keystroke to a variant. I’m hoping I’m missing something really obvious here! Thanks in advance

Any suggestions welcome

Hello @thirdspace the way I see it you’re doing it the right way (which is the one that takes longer).
One other way I could suggest is this:

  1. add all your variants outside your page’s frame so they’re not normally visible
  2. add any shape without fill to your page, where you want your components to appear.
  3. Connect the invisible shape (add interaction) to your variants
  4. Now add keys respectively to each variant and set them to Open Overlay
  5. Set overlay to Manual and define the position of your variants (to appear in)
    This is the faster way but has one BIG drawback. Each component opens as an overlay so they stack on top of each other. You can work around this problem as well though by adding a Close Overlay interaction to the variants themselves.

I also found this very helpful:

Thanks for these replies - lots for me to digest here so I’ll take a look - much appreciated

1 Like

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.