Is there a way to add multiple interactions of the same type?

[Teon_Beijl]

I would like to add multiple interactions of the same type (like after delay)

For example:
I have a button that upon clicking changes into a button with a loading indicator. After this button is back to normal I want to overlay a success message.

I would prototype that like this

• OnClick > Open overlay (Button with spinner)

• After delay > Close overlay (Button with spinner)
• After delay > Open overlay (Success message)

• After delay > close overlay (Success message)

[tank666]

But this is done in a slightly different way. You don’t need to tear off the button as an overlay. Use the “Mouse Down”, “Mouse Up” triggers for the button.
You can see my example:

Figma

I also noticed that if you open the overlay when the animation of another component (button) is in progress, it stops. When the overlay is closed, the button animation continues. More:

Interactive component animation stops when opening overlay

Creating an example for this topic, I found a bug of stopping animation of an interactive component when the overlay is open. Expected result If the animation of the interactive component is in progress, and the overlay is opened at this time, the animation of the interactive component should not stop. Actual result When the button shows a loading animation, an overlay appears on the frame, and the button animation stops until the overlay is closed. Additional information Prototype: File…

[Teon_Beijl]

You legend! Learned something new today

[Teon_Beijl]

I think that the interactions you used are the interactive components beta I still have to wait on, am I correct?

[tank666]

Oh yes, these are interactive components. If you are not registered for the beta version, then, unfortunately, you will not be able to see how it works. By the way, you can sign up for the beta here:

Interactive Components Beta Signup →

Thank you for your interest in the beta program. With interactive components, you can add interactions between variants and reuse them in your prototypes with no extra work. As a member of the beta program, you’ll be able to start using interactive components before it becomes available to all Figma users. This is a great chance to start exploring the possibilities for design systems and prototyping, as long as you understand that beta features can come with some performance issues a…

Here is a prototype video of how an interactive component should work for your task:

[Teon_Beijl]

Thanks! I was able to inspect everything including the interactions you used, but couldn’t apply it to other layers. I did register, but haven’t been able to access it. Still I hope that the ic is released soon, so we can really speed up our processes:)