Interaction actions - change to

I would like to request a new feature for Penpot’s prototyping capabilities, inspired by a functionality available in Figma. The feature I’m referring to allows users to add interactions to any component such that, when interacted with (e.g., clicked, hovered over), the component swaps out with another specified component.

In Figma I noticed under the prototyping section, users can define interactions for components that allows us to swap the component for another. This is extremely useful for creating dynamic and interactive prototypes that better simulate real-world application behavior. Here’s how it works in Figma:

  1. Select a Component: Choose the component that you want to be interactive.
  2. Add an Interaction: Define the interaction (e.g., On Click, On Hover).
  3. Set Swap Action: Select the change to action and under it select the component that should replace the original component upon the interaction.

Thank you for considering this feature request. I believe it will be a valuable addition to the Penpot platform. I also would like to express my appreciation for the amazing work the Penpot team does. Your dedication to providing a free, open-source design tool is truly commendable, and the product you have developed is incredibly powerful and user-friendly(love the design changes). Keep up the fantastic work!

1 Like

Hello @loki899

I’m not 100% sure but it seems that your idea is quite close to this one I gave a while back: New interaction feature: on "trigger" -> Swap Component

Hi @RenanMayrinckDesign,

They are the same I believe, thanks for pointing that out, I guess I didn’t search with the correct terms before posting, I apologise for that.

1 Like