-
25. オブジェクトは自身の状態を体現する
GUI において、アイコン、選択可能項目、各種コントロール、ペインやウィンドウなど、画面上のすべてのオブジェクトは、自身の状態を視覚的かつリアルタイムに体現し続けなければいけない。ユーザーはそれを、インタラクティブな操作を通じて変化させながら、作業内容を目標状態に近づけていく。
-
26. 名詞→動詞 の操作順序
ユーザーがまず対象物(名詞)を選び、それからアクション(動詞)を選ぶようにする。これが GUI の基本的な操作順序。アクションを先に選ばせると「対象物の選択待ち状態」が発生して操作の自由度が下がってしまう。
-
27. グラフィックのトーン&マナーを揃える
各グラフィック要素の間で、色調・彩度・明度、グラデーションのつけ方、ボーダーのつけ方、影のつけ方、角の取り方、塗りと線のあり方、線の太さ、カラー/シルエット、具象的/抽象的、などの度合いを揃える。
-
28. データよりも情報を伝える
ユーザーは数値よりもその意味を知りたい。例えば現在ディスクを何バイト使っているのかよりもあと何割ぐらい残っているのかを知りたい。音楽プレーヤーを買う時はストレージの正確な容量よりも何曲ぐらい入るのかを知りたい。
-
29. ユーザーがとれる操作がひとつしかないなら自動化する
複雑な入力を少ない操作で行えれば情報効率の高いUIと言える。現在許された入力が1種類だけであればわざわざユーザーがそれを行うことは情報効率としてゼロを意味する。システムが自動で代行するべき。
-
30. ペンは紙の近くに置く
ツール類は処理対象の近くに配置する。対象物が見えているのにわざわざ別のウィンドウを開くなどして操作しなければならないのでは、机から立って廊下にペンを探しに行くようなもの。その場でモードレスに操作して逐次結果を確認できるようにする。
-
31. 視覚的に何であるかを示し文字で説明する
オブジェクトの存在や状態を視覚的に把握できるようにし、文字情報でそれを補足する。アイコンを使って項目の性質を表現しラベルで明確化する。情報をグラフィカルに表現し数値などで詳細を伝える。
-
32. 前提条件は先に提示する
事前に満たしておくべき前提条件を長い手続きの途中や最後になってから求めると、そこまでのユーザーの労力が無駄になる恐れがある。例えばアプリケーションの外部から参照する必要のある入力情報や、同意する必要のある規約など。
-
33. ナビゲーション項目は名詞にする
多くの場合、ナビゲーション項目がやることベースの動詞表現になっているとそこに何があるのかわかりづらく、またやること別に画面を作ると似たような一覧表示画面が増えてしまう。情報の種類ごとに画面を作り、ナビゲーション項目は名詞表現にする。
-
34. アイコンは名詞または形容詞を表す
アイコンはそれが象徴するオブジェクト(名詞)、あるいはそれを選んだ結果として得られる状態(形容詞)をモチーフにする。処理(動詞)は絵で表すのが難しいので、いくつかの一般的なものを除いて無理にアイコンにしない方がよい。
-
35. データをバインドする
同じオブジェクトが同時に複数のビューで画面上に見えている時、それらの状態を常に同期させる。双方向のリアルタイム更新によって、ユーザーは内部的なデータ入出力処理について気にすることなく、対象オブジェクトに直接働きかけている感覚を得られる。
-
36. ゼロ・ワン・インフィニティ
個数に関して恣意的な仕様を作らない。要素の存在可能な個数は基本的に0か1か無限とする。一覧の項目数、フォルダの階層数、入力欄の文字数など、ユーザーが増やせるものに数の制限をつけない。またどれだけ増えてもUIが破綻しないようにする。
-
37. すべての操作可能な要素は意味を持つ
画面上で現在操作可能な要素や選択可能な項目はすべて、ユーザーのタスクにとって何らかの意味を持っている必要がある。意味のない要素は存在しているだけでタスクの阻害要因になるので、ディスエーブルや非表示にする。
-
38. ユーザーが入力したものはユーザーのもの
ユーザーが入力した値や設定した内容は基本的にすべて保存されるべき。ユーザーが追加した項目はユーザーが削除できなければいけない。ユーザーが入力した内容はユーザーが変更できなければいけない。
-
39. 整合性を損なうような操作をユーザーに求めない
情報の整合性が損なわれる可能性がある操作をユーザーに求めない。ブレーキランプを手動でオンにさせてはいけない。例えば、生年月日と年齢を両方入力させるようなことはしない。
-
40. 入力フォームにはストーリー性を持たせる
入力項目はユーザーにとって意味のあるグループにまとめる。項目の並び順は、ユーザーにとって身近なことや単純なものを先にし、複雑なものを後にする。
-
41. 操作の流れを作る
視覚ゲシュタルトを利用したグルーピングやストーリー性のある項目配置によってユーザーの視線と操作を誘導する。アクションボタンは流れの終点を示唆する(ボタン重力という)のでユーザーがそこまでのパスを見出せるようにする。
-
42. よいデフォルト
選択式の入力欄や設定項目に妥当性の高いデフォルト値を与えることでユーザーの操作を減らせる。よいデフォルト値とは、よりリスクの少ないもの、より一般的なもの、より中立的なもの、現在の状態を反映したもの、ユーザーの操作履歴を反映したものなど。
-
43. 制限コントロールを活用する
既定項目の選択、数値入力、日付入力など、入力可能な内容に制限がある場合は、ラジオボタン、ドロップダウンメニュー、ステッパー、スライダー、ピッカー、などの制限コントロールを用いて有効な値のみが入力可能となるようにする。
-
44. 選択肢の文言は肯定文にする
選択肢の文言はできるだけ肯定文にする。特にラジオボタンやチェックボックスのようにオンオフを切り替える選択コントロールでは、ラベルが否定形であると選択行為が「否定を肯定する」という意味になりわかりにくい。
-
45. 値を入力させるのではなく結果を選ばせる
多くの場合ユーザーは自分で入力するよりも選択肢から選ぶことを好む。パラメーターの値を設定させるよりも、得られる結果を示して選ばせる。
-
46. 入力欄を構造化する
入力すべき値の書式に合わせて入力欄を分割または制限コントロール化する。それにより、ユーザーに入力内容を示唆し、入力操作を効率化し、エラーを減らす。ただし単純なテキストボックスに比べて操作効率が下がる場合もあるので、入力する情報の性質や利用シーンを考慮する。
-
47. デフォルトボタンには具体的な動詞を用いる
モーダルなダイアログやフォーム画面では、デフォルトボタン(一番主なボタン)のラベルに、「OK」や「はい」ではなく、「保存」や「消去」など、そのボタンで実行されるアクションを表す具体的な動詞を用いる。
-
48. ラジオボタンは単数選択、チェックボックスはオンオフ
ラジオボタンは選択肢からの単数選択に用いる。デフォルト値が必要。チェックボックスはひとつひとつが独立したオンオフ項目。選択肢からの複数選択にも用いる。AかBかの場合はラジオボタン、真か偽かの場合はチェックボックス。