Initial thoughts

Initial thoughts

Overall – really impressive feature that has a lot of potential. However, here are a few observations that I think are worth noting.

The good

The potential of this feature is huge! I spent 5 minutes making an interactive radio button that can be re-used. Bish bash bosh.

When designing a long service before this feature - this tiny interaction would have taken me hours. This feature will speed up the prototyping workflow 10-fold. Great work :+1:

It’s a a super easy feature to pick up. Very small learning curve.

The could be better

Auto-layout and nested variant interactions
I’ve noticed that auto-layout components containing interactive variants that expand and collapse does not respond well.

Example of component and interaction:

Example of component failing to adapt to nested interactive variants, leaving blank spaces and hiding expanded states:

I was expecting it to behave in a similar way to how when I toggle the nested variants in the master component within the editor.

Need for click-off event?

In order to imitate a browser experience it would be great if there was a click-off event to remove the active state for inputs.

Example of not being able to remove focus state once user clicks-off:

Rule for the active/selected item in regards to navigation/lists

Thinking in terms of navigations… what would be really useful and the icing on the cake would be the ability to rule one variant as the selected/active state. Thereby when an inactive item is clicked on, the previously active item switches to the default state of inactive.

Example of current problem: multiple navigation items in the active state when clicked on:

Toggle for interactive components

One small bug I found was in the toggle of turning interactive components on and off. I made quite a few components interactive, toggled the feature off to see if it changed the speed of the prototype preview - to only find all the interactions to have been removed when I toggled the feature back on again.

1 Like

Wow, thanks for the detailed feedback!! A few notes:

  • We’re working on Auto Layout! Our goal is to have it working with Interactive Components before we move this feature out of beta. :slight_smile:
  • A click-off event/blur event is a great idea for prototyping in general. I’ll make sure we’re tracking it internally.
  • Re: rules for selected items, there’s not anything on the roadmap that we’re ready to talk about but we’ve been thinking about how we can introduce more logic to prototyping in general. For now, as a workaround for your example I think you could create a component set with variants for each possible active state.

And thank you for letting us know about the behavior when toggling the interactive components checkbox on and off. I’ll share this with the team tomorrow so we can investigate!

Ok, I just checked with the team and none of us are able to reproduce the issue where the interactions disappear after unchecking the interactive components checkbox.

In the example below I’ve unchecked the checkbox, but I can still see the noodles for the interactive component. When I turn the checkbox back on, they play as expected.

Are you still seeing this issue? If so, can you send a file our way?

1 Like

Thanks for your response @Kelsey_Whelan

  • Auto-layout and interactive components. Let’s gooo! :clap:
  • Look forward to seeing how a click-off event/blur might be implemented
  • I suppose what I could do for now is also use the “open overlay” feature to imitate a navigation, thanks :+1:

Regarding the bug, it seems I cannot replicate it also. Ha - always the case. It could be that whilst I was prototyping initially – it hadn’t saved. I closed the browser and opened it again to see no interactions so that would be my guess at what happened.

Thanks, Joe

1 Like