Modal slide in

Ask the community
1

Hi all, :slight_smile:
I’m wanting to transition from one frame to another where I blur the background and then slide in a panel from an edge. Would someone be able to tell me how I can set this up to work in prototyping :slight_smile: (I’m rushing to get it done which is why I’m asking rather than researching myself!) :smiley:

Thanks!!

2

Do you have any specific part that you don’t know how to do or you don’t know how to implement it at all?

3

Yeah so I don’t know how to set up a transition from one frame to the next where something off screen will slide in as I go to the next screen. :slight_smile: Does that make sense?

e.g. A side panel will slide in when I click a button (terribly quick example attached)

image
image2439×726 4.61 KB

4

Ok.

  1. Create a final result screen with all the necessary elements and effects (as on the right in your screenshot);
  • Button, background blur layer, modal panel.
  1. Duplicate your screen frame;
  2. Move the modal outside of the frame and change the opacity of the background blur layer;
  3. Create an interaction from the button on the duplicated frame to the final result frame by choosing the settings you want (for example, Animation: moving from left, with smart animate matching layers).
5

Oh you’re fantastic thank you! It was the checkbox I’d not seen for matching layers.

Thank you so much for your time, really appreciate it. :smiley: