Using overlays greatly reduced the amount of duplications in my frames, still there are flows when I start with an overlay in a given position and would like for it to be swapped with a differently positioned overlay.
Currently I do that by targeting a new frame and using a timed overlay opening from that. Looks fine in the prototype, but adds few extra steps/duplications that I’d happily do without.
Yes . Would be good to be able to set the position of the new overlay when doing Swap Overlay. I use the same poor workaround as Dario1 in the meantime… But that makes my design overcomplicated and less reliable.
Alternative that may work too: Get rid of the Swap Overlay option and replace it with Open Overlay (which allow you to set the position) + a Close Other Overlays option (to do the same as a swap). 🙃
Currently when using ‘Swap Overlay’ we are not allowed to position the overlay on the screen
At certain time it is required that overlays are positioned differently e.g. while designing overlays for user on-boarding journey.
It will be a great feature addition and will eliminate need to duplicate the background.
Using overlays greatly reduced the number of frame duplication. However, there are flows when I start with an overlay in a given position and would like for it to be swapped with a differently positioned overlay.
I see that other designers have brought this topic up about a year ago. Figma, please make this happen.
Going from an overflow menu overlay to a modal overlay is a common enough flow (i.e. “product details,” “sizing tips”). It would really benefit from this function.
Figma says: Note: You can’t set a different position for the new overlay. Figma places the new overlay in the same position as the original overlay.
Why can’t we set a different position for the new swapped overlay? =( Will this be developed into a feature in future?
Hi guys, in my design i made a pop up using “open overlay”, I placed this pop up in the bottom-center of the frame and it has a action button to open a modal with additional info, the thing is that usually modals goes centered and have a background, when I use the “Swap overlay” interaction, I just can choice which frame i want to swap but I can’t choice the position or if I want to set a background, the frame is just shown in the same place I spotted the pop up.
As a user, I want to swap overlay and set a different position for new overlay, and set all other properties for new overlay, so that I can customize the prototype because it is needed in some cases like when snack bar appears after clicking on pop up modal action.
I have this problem too. Does anyone know a workaround? Not sure why they would change the modal positioning options in this particular flow, which is super common.
This topic was automatically closed 90 days after the last reply. New replies are no longer allowed.
I use swap overlay a lot but it would be very helpful for me if I could specify where I want my swapping overlay to begin. Figma automatically swaps it in the center of the screen. I know it’s not possible yet and some people have brought this up as well (image below), but @Figma_Moderation if you could maybe let us in if this feature made it to your backlog and if so, when we might be able to expect this feature release? Thx
I also think this would be useful.
Opening a modal overlay at the center of a screen, from a manually positioned overlay is quite common when prototyping.
Echoing the sentiment here. I love overlays so I don’t have to manage so many frames when building a prototype. Position changes on swap would be valuable.
Maybe even more flexible would be being able to specify which frame the overlay appears on so you can set the overlay to appear over a frame that is different from the one where it was triggered.
+1. I tried to use a Close Overlay and Open Overlay together as a workaround but this did not work.
+1 for this feature. I run into this issue all the time.
+1 for this feature. This would enable us to replicate overlay menus and action sheets in iOS. For example, when a ‘Delete’ action is selected from an overlay menu at the top of the screen and the confirmation of the delete action is then presented in an action sheet at the bottom of screen.
I ran into this problem when swapping a smaller modal with an expanded one. After using Swap Overlay, the taller modal shifted downward instead of remaining centered. Here’s what worked for me:
• Create an empty frame sized to match the expanded modal’s height.
• Place the smaller modal inside that frame and center it.
• Use the empty frame as your overlay and apply Swap Overlay to move between the collapsed and expanded states.
The frame’s height stays consistent, so the expanded modal remains centered. Plus, Smart Animate now provides a smooth “grow” transition. Hope this helps someone. If anyone has a more elegant approach, I’d love to hear it!
Enter your E-mail address. We'll send you an e-mail with instructions to reset your password.
