The user needs to take an action or cancel the overlay until he can continue interacting with the original page.
Introduce a mode in which users cannot interact with your application until the mode is closed. Interrupt the user’s attention and halt all other actions until a message is dealt with or dismissed.
Matching button text with the title of the modal increases the feeling of familiarity. As modals introduce a new inturrupting mode, chances are that users won’t connect the action they just performed with the modal popping up. Make sure they know where the modal is coming from.
Allow users to escape the mode by letting them close the modal window when they need to. Popular conventions for close buttons is an ‘X’ icon in the top right corner and/or a ‘Close’ or ‘Cancel’ button at the bottom of the modal window. The ESC key is also often a conventional keyboard shortcut to closing modals – so is clicking outside the modal window.
Although effective in focusing attention, introducing multiple modes comes with the risk of introducing mode errors where the user forgets the state of the interface and tries to perform actions appropriate to a different mode.
This and others patterns are available and ready to use in this massive Wireframe Bundle. Suitable for a wide variety of projects: Website and landing pages, Ecommerce, Dashboard, Flowchart and iOS.
