Oppia UX guidelines & rationales

Guidelines for Modals

Throughout Oppia we follow three patterns for modal closing:

1. Modal with form(s) inside it.

   • It should only get closed if the user clicks the dedicated close button or by pressing the ESC key.
   • Example:

2. Modals with warnings or suggestions.

   • It should get closed through the dedicated close button or just by clicking outside the modal i.e, in the background or by pressing ESC key.

   • Example:

     

3. Modals which don't have a close button.

   • It should not get closed by users through any process.

   • Example: