Better ways to build prototypes using interactive components

Here are some examples that I’d love to be able to handle via interactive components:

  • A radio button list (have some logic where the state of one component can change the state of another)
  • Active states for interactive components (our designers will need to manually link frames together to make their prototypes, but because interactions can’t really “stack” we can’t build in active states into our components like Tabs, Switch, Dropdowns, etc.)
  • Text Inputs that are editable in prototypes (maybe not specific to interactive components, but it would be a huge win if our TextField component could actually be editable when viewing it in prototype mode)
  • On Open animations (we have a lot of components like tooltips, modals, dialogs, sidesheets, banners, snackbars, etc. that are prompted to show up after the user takes an action. Currently there is no way for us to build in these “on-open” animations for how they should animate in when being used, thus the burden for getting these animations and timings correct is put on our designers rather than the systems team building the components - which will lead to incorrectness or inconsistencies)
2 Likes

This is exactly what I would like as well. Example of swatches for a Product page, click one changes the image, select another, the current selection should go back to default.

If repeated instances of an interactive component could have a listening event and toggle off and on that would be one more interaction I wouldn’t have to use another Frame to replicate.
Would be nice to build that into the Design System we are working on right now to manage those microinteractions as well.

1 Like