Request details

← Adobe XD: Feature Requests

Nested Overlays

Allow an Overlay to be applied to another overlay. For example, you have a dialog box Overlay and inside you want to have a drop-down menu which has an Overlay of a list of options. Currently what happens is the drop-down Overlay replaces the dialog Overlay.

I think this is something fundamental that would make Overlays even more powerful. Its omission almost feels like a bug.

227 votes

We're glad you're here

Please sign in to leave feedback
Signed in as (Sign out)
Close
Close

We’ll send you updates on this idea

Nick shared this idea  ·   ·  Flag idea as inappropriate…  ·  Admin →

15 comments

We're glad you're here

Please sign in to leave feedback
Signed in as (Sign out)
Close
Close
Submitting...
An error occurred while saving the comment
  • anon commented  ·   ·  Flag as inappropriate

    Glad to see that this still hasn't been solved 😭Excuse me while I spend several hours doing a bunch of micro-interactions

  • Dejan commented  ·   ·  Flag as inappropriate

    Hey @XDTeam. How come you are not working on implementing nested overlays when it is:

    - an open community request since 2018
    - it's a crucial interaction in modern applications

    You've seen this in many apps too. It's also baked in into iOS. For instance, here is an use case:

    1. The user is on a screen where she triggers an overlay interaction (the screen slides in from the bottom)
    2. The user clicks inside this overlay and triggers another slide in, the second overlay. This one might come again from the bottom, from top, doesn't matter.
    3. Then the story continues for the third time and so on...

    As it's well known, this is still not possible with XD. I think Figma does it and they call it "Overlay Swap", but I'm not an active Figma user.

    Before someone comments this can be done with component states, that is unfortunately only true in limited scenarios because only auto animate ans dissolve transitions are supported between states. Overlay transitions are not supported.

    Then there is a question of usability, while even if overlays could in future be achieved with component states it would be unpractical to overload components with so many states and so many possible scenarios of transition and inherited content.

    Overlays belong on their own artboards. They behave in a way as components, where you call them up when they are needed. We just need a way to have multiple of them stack up on each other.

    Please.

  • DFreundt commented  ·   ·  Flag as inappropriate

    Yes, I need this feature to build my prototypes. It would be great if you can define an originate point from where all the following overlays will be started. Another option ist to move the overlayframe to the desired page.

  • Nathan Wells commented  ·   ·  Flag as inappropriate

    Yes, it would be great to be able to swap an overlay so the overlay can have multiple states without having to create the overlay as a component.

  • c commented  ·   ·  Flag as inappropriate

    Yes! I have just wasted a bit of time trying to figure out why I couldn't overlay an overlay. Guess i'm going to need to manually create this interaction. Glad to see i'm not alone though - hopefully with a future update!

  • Ishwor M. commented  ·   ·  Flag as inappropriate

    A must have feature. Didn't expect that XD doesn't have this feature. Let's hope it's going to be added this basic feature soon.

    Thanks Nick for introducing this request.

  • Miguel Santo commented  ·   ·  Flag as inappropriate

    Was thinking i was doing something wrong... I did not expect to not be able to do this.

    I just wanted to do an overlay on top of an overlay without dismissing the first one (because it evokes the animation of the first overlay and only after that does it trigger the second overlay, which results in a weird behaviour)

  • Armando Tavares commented  ·   ·  Flag as inappropriate

    Yes, overlays are unusable if you have more then a simple menu. Using multiple overlays is very glitchy and doesn't work well for micro-interactions. Or moving from a small overlay to a larger one doesn't work.

  • Jerimy Brown commented  ·   ·  Flag as inappropriate

    Agreed... I am already doing this for a multi-tiered navigation structure idea I have, and it's working, but glitchy, and I have to create a lot of duplication to keep it from completely breaking. Also, even if you select none as your transition, you still get a flash as one overly replaces they other. Would be nice to at least have that replacement be seamless as a start.

    I actually found this because I was in the process of writing this feature request myself ;)

  • Johan Steyn commented  ·   ·  Flag as inappropriate

    This is a must have, otherwise what I am having to do is hack together detailed duplicate screens to make this work which is highly inefficient.

  • Igor Mikelic commented  ·   ·  Flag as inappropriate

    Great idea. Very useful on collapsible (or drop down) menu items. This is easy to implement and solve =D
    exp. You have 1. page (like home) and 1st overlay (main menu) and 2nd overlay (expanded main menu). When you are linking on 2nd overlay there is blank page below instead visible 1. page below. Logic would be show me main screen always below no matter how many overlays i chose to replace (or simple nested overlays)...
    PS
    I can send XD file for developers or PM... or PIC attachment for detail explanation ;)

  • Navish commented  ·   ·  Flag as inappropriate

    This is a good suggestion, I'm trying to design an advanced filter and I have put the filters on an overlay. When i put drop downs or date filters on the overlay you can't click them without dismissing the overlay.

Adobe XD: Feature Requests: 01 : Design mode

Categories

Feedback and Knowledge Base

(thinking…)