2

What are the advantages of using full screen vs normal modal? I've seen sites like Airbnb & Slack use white full-screen overlay. How does it impact usability? Are there any advantages for using such type of overlay?

  • The first thing that comes to mind is that a full screen modal hides content, this may be something you should consider depending on when you want to display the modal – Yates Feb 27 '18 at 10:34
  • But the problem I'm facing is people are losing context. They don't where they are currently. – NB4 Feb 27 '18 at 11:04
  • 1
    Then it seems that you're using modals incorrectly. What is it you want to achieve with the modal, what triggers it and what are the users currently looking at? – Yates Feb 27 '18 at 11:53
  • But somehow full screen (similar to Airbnb/Slack - white overlay without transparency/opacity) makes people lose context. For the user, it seems its a new page instead of overlay. – NB4 Feb 27 '18 at 12:06
  • 1
    If your users don't understand where they are any more because of a full page modal then obviously you should not be using one. Make it a normal modal, if that does not have enough space for the information you wish to display in the modal and the user has to manually toggle the modal in the first place just redirect them to a designated page. – Yates Feb 27 '18 at 13:04
2

A full screen modal interrupts the workflow of the user and forces their attention towards the modal content. This works well if you want users to undertake actions which require full attention and/or precautions, and you don't want users to be distracted by content laying beneath the modal.

The choice between full screen modals and overlay modals depends on what you want to achieve; is your complete undivided attention required as a user? Then opt for full screen modals. Are the modals simply offering more information to the content that lies below the modal? Show the content underneath for context.

If your users are losing context - don't use full screen modals. If you have too much content to show, dedicate a page to it.

  • we do have a dedicated page for it as well but full-screen modal provides the user with quick of the data. If the user is really interested and wants to deep dive into the data then the user opens it in a new page. – NB4 Feb 27 '18 at 11:26

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.