モーダルウィンドウ

出典: フリー百科事典『ウィキペディア(Wikipedia)』
移動: 案内検索

モーダルウィンドウ: Modal window)は、何らかのウィンドウの子ウィンドウとして生成され、ユーザーがそれに対して適切に応答しない限り、制御を親ウィンドウに戻さないユーザインタフェース設計になっているもの。モーダルウィンドウはGUIシステムで、ユーザーに注意を促したり、緊急の状態を知らせる目的でよく使われる。

ユースケース[編集]

モーダルウィンドウは以下のような状況でよく使われる。

  • 特に重要な情報への注意を喚起する。この用法は効果的ではないという批判もある[1] [2] [3]
  • 必要な入力がなされるまで、アプリケーションの実行をブロックする。
  • アプリケーションの設定オプションを1つのダイアログに集約する。
  • 今実行しようとしている操作が取り消すことができないことを警告する。ファイルの書き込みや削除でよく見られるが、その意図する効果(間違った操作を防ぐ)は疑問視する向きもあり、代替策もある[4]

利用の適切さ[編集]

Microsoft Windows ではモーダルウィンドウが Multiple Document Interface の要素になっていることもあり、Mac OSX Window System ベースのUNIX系システムよりもよく使われる。Windows でモーダルウィンドウが使われるような状況で、それ以外の環境ではトランジェントウィンドウが使われる。トランジェントウィンドウはモーダルウィンドウと似たような振る舞いをし、常に親ウィンドウの前面に表示され、ウィンドウリストには出現しないが、同じアプリケーションの他のウィンドウの使用を妨げない。

批判[編集]

モーダルウィンドウは、クローズされるまでそのプログラムの他のワークフロー全体をブロックする。ユーザーはモーダルウィンドウが注意を喚起していることに気づかない場合もあり、主ウィンドウが反応しなくなったことで困惑したり、入力すべきデータが判らないといった問題も発生する。

モーダルウィンドウに対する意見は、初期のマンマシンインタフェースにおける基本原則を想起させる。例えば、マイクロソフトは Windows 95 でウィザードを多用した。[5]

今もモーダルウィンドウは多くのGUIツールキットの主要部品の1つであり、よく使われる。多数のモードのないダイアログが表示されるとユーザーが混乱すると考えられているためであり、モーダルウィンドウを擁護する立場からは、ある時間内にユーザーが入力しなければならない情報の量を制限することができるという意見もある。

ユーザインタフェースの専門家は、そのような意見に対して、ユーザーにフラストレーションを与えてまで制限を加えるのは誤りだと指摘している[6]。ユーザーは1度に1つの入力しかできず、モーダルだろうとなかろうとユーザーは常に注意していなければならない。たとえ複雑な情報であっても、それがうまく構造化された論理的設計で表現されていれば、ユーザーはそれを処理できる。

脚注[編集]

  1. ^ Joel Spolsky, User Interface Design for Programmers: Designing for People Who Have Better Things To Do With Their Lives
  2. ^ Raymond Chen, The Old New Thing: The default answer to every dialog box is "Cancel"
  3. ^ Jeff Atwood, Coding Horror: Teaching Users to Read
  4. ^ Aza Raskin, A List Apart: Never Use a Warning When you Mean Undo
  5. ^ David A. Karp, HELP WITH WINDOWS 98
  6. ^ Cooper, Alan (2003年3月17日). About Face 2.0: The Essentials of Interaction Design. Wiley. ISBN 0764526413. 

[編集]

  • ThickBox - jQuery 上に構築された JavaScript のモーダルウィンドウ
  • TinyBox - Prototype 上に構築された JavaScript のモーダルウィンドウ
  • subModal - DHTMLのモーダルダイアログ
  • Control.Modal by Live Pipe
  • MOOdalBox - mootools 上のモーダルボックス
  • Lightbox JS by Lokesh Dhakar
  • GreyBox by Amir Salihefendic

関連項目[編集]