フレキシブルペイン

画面をいくつかの伸縮可能なペインで構成する。各ペインをモードレスなダイアログもしくはナビゲーションメニューと位置づけ、作業の状況に合わせて必要なペインの表示／非表示を切り替えられるようにする。
理由：シングルウィンドウのアプリケーションにおいて、画面の構成する機能要素を柔軟に変化させることで、UIの合理性と作業効率を高めるため。

効能

• シングルウィンドウのシンプルさを保ちつつも、補助的な機能をその中に柔軟に組み込める。
• プロパティシートや一覧操作（Manipulator）機能が複数ある場合でも、それらを1画面内に俯瞰できるため、情報の入手効率がよい。また複数のウィンドウを行き来せずに効率的に操作できる。
• 条件と結果の対応や、情報の入れ物と中身の対応を理解しやすい。
• モードレスインタラクションとしての自由度を確保しつつも、機能の提示順序をある程度限定的にできることで、モーダルインタラクションとしてのガイダンス効果を期待できる。

用法

• ペインとは、ひとまとまりの機能やオブジェクト群を示す表す独立性の高い矩形領域。
• 例えば、検索（Retriever）、閲覧（Viewer）、編集（Editor）、再生（Player）、一覧操作（Manipulator）、設定（Configurator）、といった粒度でひとつのペインを定義する。これらを単独のウィンドウもしくはダイアログとしてマルチウィンドウ式のアプリケーションにするのではなく、ひとつの画面を構成する部品として用いる。
• 画面を2〜4つ程度のペインに区切る。各ペインは画面の上下左右いずれかの辺に接するようにする。
• それぞれのペインはできるだけモードレス利用できることが望ましい。ある操作状況ではこのペインは使えない、といったことが少ない方がよい。また、あるペインでの操作を終えなければ他のペインの操作に移れないといったこともない方がよい。
• ペイン同士の関係には、次のようなものがある
  • ペインAで選択したオブジェクトの内容（コンテンツ）をペインBに表示する。
  • ペインAで選択したオブジェクトのプロパティ表示（およびその変更操作）をペインBで行う。
  • ペインAで選択したカテゴリー／フォルダの内容をペインBに表示する。
  • ペインAの内容を切り替えるナビゲーション機能（「前へ／次へ」など）をペインBに表示する。
  • ペインAで表示したコンテンツに対する編集ツールをペインBに表示する。
  • ペインAで選択したオブジェクトを、一時的にペインBに保管する。
  • 他ペインと直接関係しないが、作業の助けとなるミニアプリケーションをひとつのペインにする。
• それぞれのペインは、必要に応じてユーザーが自由に開閉できるようにする。ひとつが開かれると、その分他のペインの領域が縮小する。ひとつが閉じられると、他のペインの領域が拡大する。常に画面全体が隙間なくペインで満たされるようにする。
• ペインAにおけるある操作がペインBでの次の操作を促す場合、もしペインBが閉じていれば、自動的にペインBを開く。例えばペインAにリストがあり、そこで選択した項目の内容がペインBに表示される場合、ペインBが閉じていれば、リスト上での項目選択と同時にペインBを開く。
• ユーザーが任意にペインの表示／非表示（開閉）の切り替えを行えるよう、そのためのボタンを常に表示されている領域に配置する。
• ボタンによるペインの開閉や自動的な開閉の際には、アニメーションによる補完表現を用いて、ペインが画面の端から出てきたり引っ込んだりするような効果を持たせるとよい。
• ペインAとペインBが同時に開いていると不整合が起きる恐れのある場合、片方が開かれたらもう片方は自動的に閉じるようにする。もしくは、ひとつのペイン内でAとBの内容を切り替えるようにする。
• 必要に応じて、スプリッターボタンの使用を検討する。

注意書き

• ペインが多くなると画面が複雑になって分かりにくくなる。ひとつのペインをメインペインと位置づけ、その他は必要な時以外閉じておけるようにするとよい。例えば初期状態ではメインペインだけを表示しておき、ユーザーが操作の流れに応じて他のペインを開いていくようにすると、全体の機能性を段階的に学習できる。