-
73. メニュー項目の位置を変化させない
アクションやナビゲーションの項目が並ぶメニューでは、項目同士の位置関係が状況によって変化しないようにする。ユーザーはメニューの中で目当ての項目を空間的に記憶するので、位置関係が変わってしまうと学習できない。
-
74. ハイライト表現は構成要素をひとつだけ変化させる
複数の同列項目の中でハイライト項目を表す上では、その項目の視覚的な構成要素をひとつだけ変化させる。あるいはひとつだけ追加する。変化が大きすぎるとハイライトではなく別な種類の要素に見えてしまう。
-
75. 錯視を考慮する
グラフィックに一貫性を持たせるために、要素のサイズ、形、位置、色などを統一したり等分したりすることは重要だが、画面構成の状態によっては目の錯覚が生じて意図しない見え方になることがある。様々な錯視のパターンを知り、必要に応じて目視ベースで調整する。
-
76. 空間的に記憶できるようにする
デスクトップやスプリングボード、ウィンドウやパレットなど、ユーザーが2次元上の任意の場所にオブジェクトを置いて空間的に記憶できるようにする。システムはその位置情報を保存して次回起動時に再現する。システムの都合で勝手に変更しない。
-
77. プロスペクティブメモリー
ユーザーが未来の自分のために手がかりを残せるようにする。後から再び参照できるよう、コンテンツにブックマークやフラグを付けたり、ウィンドウを開きっぱなしにしたり、バーチャルな付箋やマーカーをつけたり、下書き保存したりできるようにする。
-
78. タッチ操作する要素の大きさは 7mm 以上にする
タッチスクリーンでは、ボタンをはじめ各種UIコントロールの大きさを、指で十分に押しやすい 7〜10mm 四方以上の大きさにする。またタッチする要素自体が指で隠れてしまうので、要素同士の間隔をあけて押し間違いを防ぐ。
-
79. ジェスチャはコマンド式ではなく直接操作式にする
特定の入力動作の組み合わせををジェスチャというが、ジェスチャに対する画面の反応は、できるだけ、一連の入力動作に対して対象の要素が直接的に追従するような振る舞いにする。単に決まった動きによってシンボリックに対応コマンドが実行されるだけのジェスチャは、動作とその意味の対応が恣意的になるので学習しづらい。
-
80. ドリルダウンは上→下、左→右
ナビゲーションのために画面をいくつかのペインに分割して階層化する場合、その位置関係は、上で選択した項目の内容が下に、左で選択した項目の内容が右に表示されるようにする。ただしRTL言語(アラビア語など)では左右関係を逆にする。
-
81. 左が戻るで右が進む
左が戻るで右が進む – 画面遷移の方向性を水平軸で示す場合、左を戻る(過去)に、右を進む(未来)に対応させる。ただしRTL言語(アラビア語など)では左右関係をすべて逆転させる。
-
82. モバイルでは包括的より階層的に
デスクトップのアプリケーションでは作業空間の全体像を包括的に現すのが良いが、モバイルでは一度に見せる情報を限定して階層的に見せるのが良い。
-
83. 単純なものは単純なままに
製品が成熟して多機能化すると、一般的で単純な機能が高度な機能群の中に埋もれてしまうことがある。シンプルな製品では簡単にできたことが成熟した製品では複雑な操作を要するのではいけない。単純なことは引き続き単純に行えるようにする。
-
84. 色やフォントを使いすぎない
配色や書体によって特定の要素を強調したり情報のグループを表すことができるが、種類を増やしすぎると画面が乱雑になってしまうので注意する。
-
85. 整然とレイアウトする
画面要素は、グリッドに沿って整然と配置する。余白や揃えに反復性と一貫性を持たせる。これにより視覚的な安定感を生み出し、領域の包含関係、形状の連続性など、情報の構造を論理的に示す。
-
86. カスタマイズ機能に頼らない
ユーザーごとに要求が少しずつ異なることへの対処としてカスタマイズ機能に頼ることは、システムをより複雑にしてかえって学習のしやすさや保守性を低下させる。まずベストなUI仕様を決定し、カスタマイズ機能は慎重かつ控えめに提供する。
-
87. ユーザーの道具にする
システムは提供者の物ではなくユーザーの物として作る。提供者の要求を押し付けるための道具ではなく、ユーザーが自分の行為を強化するための道具と位置づける。システムは、ユーザーに何かをさせる物ではなく、ユーザーが何かをする物と考える。例えばECサイトであれば、売るための仕組みではなく買うための仕組みとして設計する。
-
88. ユーザーが自分なりの方法で作業を遂行できまたそれを改善できるようにする
マニュアルレス(手順が覚えやすい)よりも、モードレス(手順が固定されていない)な道具を作る。道具の使い方を工夫することが創造性の源。そのような人と道具の相互発展を促すデザインを試みる。
-
89. ユーザーを教育するのではなくユーザーが学習できるようにする
システムは、対象ドメインの経験をもつユーザーであれば自力で使えるものでなければならない。インターフェースに操作説明を書くのではなく、インターフェースを自己説明的にして使い方が自明になるようにする。
-
90. UIをロックしない
GUI では、1. ユーザーのアクション → 2. プログラム処理 → 3. 結果の表示、の繰り返しで作業が進められる。UIがロックされるとは、2 に時間がかかって 3 がなかなか起こらず、UIが次のアクションを受け付けない状態になること。数秒以上UIがロックされているとユーザーはアプリケーションを自由にコントロールしている感覚を失ってしまう。
-
91. ゲームを持ち込まない
ユーザーは目的を達成したいのでありゲームをしたいのではない(それがゲームアプリでない限り)。偶然性、意外性、ギャンブル性、難解さ、判断や操作のスピードの要求、器用さの要求、勘の良さの要求、などのゲーム性をインターフェースに含めてはいけない。
-
92. 動かしたままに動くのではなく動かしたいように動く
インターフェースはユーザーの操作に素直に応じて動くべきだが、思いどおりにコントロールできていると感じさせるためには、入力デバイスからの値をそのまま反映するのではなく、適切な「あそび」や、経験則からの「補正」を含める。
-
93. ホットスポットを広げる
ボタンなどについて、表示されている矩形よりも広い範囲をタップ/クリック可能にする。そうすることによって視覚的なバランスと押しやすさを両立できる。ただし対象要素とホットスポットが分離していてはいけない。
-
94. 音声読み上げに対応する
スクリーンリーダーや音声ブラウザなどで利用できるよう、画像などの非テキスト情報には代替テキストをつける。プラットフォームや開発環境の標準的な仕様に従って実装し、アクセシビリティを高める。
-
95. 文字の拡大に対応する
文字の表示サイズを大きくして利用できるよう、プラットフォームやブラウザのテキスト拡大機能に対応する。標準的な仕様に従って文字列表示を実装し、アクセシビリティを高める。
-
96. 色に依存させない
インターフェースを色に依存した表現にしない。色がなくても情報が伝わるようにする。濃淡のコントラスト、枠線や下線による装飾、形状や位置関係によるマッピング、文字による補足、などを用いる。インターフェースをグレースケールで表示してみて確認するとよい。