CampusDownWiki
Total citations 15,834한국어KO 2,696EnglishEN 10,825日本語JA 771中文ZH 1,542
CampusDown ↗
English

Modal Dialog

⚙️ Engineering & Technology By CampusDown Wiki Editorial Team Last updated
A modal dialog is an interface element that overlays the current screen and prevents interaction with the content behind it until the user responds or dismisses it.
Contents
  1. 1. A powerful tool that stops flow
  2. 2. Confirmation overuse and timing
  3. 3. Focus management and mobile
  4. 4. FAQ
  5. 5. References

A powerful tool that stops flow

Modals concentrate attention entirely. Raskin (2000) warned that modes invite errors, and Bailey and Konstan (2006) showed interruptions increase time, errors and anxiety. Fessenden (2017) advises modals only for irreversible actions, essential input or critical warnings. Lighter alternatives are toast notifications for results and bottom sheets for secondary choices.

Confirmation overuse and timing

Cooper et al. (2014) note repeated 'Are you sure?' prompts train habitual clicking; undo is usually safer. Adamczyk and Bailey (2004) found interruptions at subtask boundaries least harmful, so rating requests on launch or promotions mid-typing are the worst timing. Avoid confirmshaming such as 'No, I hate discounts', a dark pattern recorded by Mathur et al. (2019).

Focus management and mobile

Per WCAG 2.2 (W3C, 2023), move focus into the modal on open and return it on close; containing focus is intended, but Esc or a close button must always exit. On small screens centred modals are easily hidden by keyboards, so consider full-screen views or bottom sheets for input, and make close buttons large and reachable.

FAQ

Are modals and popups the same?
Popup is broader; a modal is a popup that blocks the background until answered.
Must delete confirmations be modal?
If reversible, an Undo toast is often better; reserve modals for irreversible deletion.

Sources reviewed: 2026-10-27

References

  1. Fessenden, T. (2017, April 23). Modal & nonmodal dialogs: When (& when not) to use them. Nielsen Norman Group. When to use and avoid modal dialogs.
  2. Cooper, A., Reimann, R., Cronin, D., & Noessel, C. (2014). About face: The essentials of interaction design (4th ed.). Wiley. Critiques needless confirmation dialogs as flow breakers.
  3. Raskin, J. (2000). The humane interface: New directions for designing interactive systems. Addison-Wesley. Classic argument that modes cause errors.
  4. Bailey, B. P., & Konstan, J. A. (2006). On the need for attention-aware systems: Measuring effects of interruption on task performance, error rate, and affective state. Computers in Human Behavior, 22(4), 685–708. Interruptions raise task time, errors and anxiety.
  5. Adamczyk, P. D., & Bailey, B. P. (2004). If not now, when? The effects of interruption at different moments within task execution. In Proceedings of the SIGCHI Conference on Human Factors in Computing Systems (pp. 271–278). ACM. Interrupting at task boundaries reduces harm.
  6. Mathur, A., Acar, G., Friedman, M. J., Lucherini, E., Mayer, J., Chetty, M., & Narayanan, A. (2019). Dark patterns at scale: Findings from a crawl of 11K shopping websites. Proceedings of the ACM on Human-Computer Interaction, 3(CSCW), 1–32. Documents confirmshaming and other dark patterns.
  7. World Wide Web Consortium. (2023). Web Content Accessibility Guidelines (WCAG) 2.2. Focus order (2.4.3) and no keyboard trap (2.1.2) criteria.

Reports and materials that use this theory (Korean)

There are no materials dedicated to this theory yet, but you can search related reports in the CampusDown library (Korean).

Find more reports · Search '모달 대화상자' on CampusDown →

You may also like

Latest ArticlesView all ›

New guides for college study and assignments (Korean)

This article was last updated on October 27, 2026. It is based on widely recognized original works and textbooks; when citing it in a paper, please check the original sources listed in the references.