編集(Editor)

ユーザーによる編集作業(データの変更と保存)を受け付ける。
理由:システムで扱うオブジェクトの内容をユーザーが変更できるようにするため。

図例
フォームを用いた編集

効能

  • 情報の閲覧(Viewer)だけでなく、変更もできるようにすることで、システムの利用価値が高まる。

用法

  • 編集対象は、「1個のテキストファイル」「1枚のスプレッドシート」「1件の顧客レコード」など、ユーザーにとって意味のある単位のオブジェクトとする。
  • 入力コントロール(または選択コントロール)によって、編集を受け付ける。
  • 自由帳を使って、ユーザーが気の済むまで試行錯誤してもらう。
  • できる限り、閲覧(Viewer)の状態のまま、その場で編集できるようにする。
  • 入力コントロールは凹型の見た目とし、入力箇所を明示する。
  • 入力時には、「|(Iビーム)」カーソルや、フォーカスリングによって、現在位置のしるしを付ける。
  • ステップ表示などによって、編集作業の開始から完了までの全体像や時間の目安を想定できるようにする。
  • 編集完了のためのボタンを目立たせる。
  • 編集完了のタイミングは、ユーザーの判断に任せる。入力時間の制限を行わない。
  • モードレスインタラクションで編集機能を提供する場合、編集完了の合図(保存ボタンの押下など)を必要とするかは状況による。変更したそばから自動保存された方がモードレスな操作性となるが、一般的には、編編集完了の合図によってハードディスクやサーバーのDBに書き込む。
  • モーダルインタラクションで編集機能を提供する場合、編集完了後には検索結果の一覧画面に画面遷移するなど、ユーザーが次の作業に移行しやすくする。

図例
自由入力を用いた編集

注意書き

  • 編集中にユーザーが画面を閉じようとしたり、別の箇所に移動しようとすると、編集内容が意図せず失われる恐れがある。その場合は、アラートを表示して編集内容を保存できるようにする。
  • 「閲覧」と「編集」を同一箇所でできれば利用効率は高いが、操作が複雑になる恐れがある。入力箇所が多い場合や、細かな操作が発生する場合は、「編集」機能を画面として切り出すことを検討する。ただし、「編集モード」というモードが発生してしまうため、ユーザーの操作の自由度は低下する。

蘊蓄

編集には必ずユーザーの能動的な入力操作が必要であるため、ユーザーとシステムの対話によって作業が進められることになる。