UIを分かりやすく設計

ユーザビリティは、利用者が目的を達成するときの使いやすさに関わる考え方です。アクセシビリティは、年齢や身体的条件、利用環境などが異なる人にも情報や機能を利用しやすくすることに関わります。UIを評価するときは、操作の分かりやすさだけでなく、文字の読みやすさ、入力手段、認識しやすい提示なども考慮します。両者は重なる部分がありますが、同じ意味ではありません。

ユーザビリティとアクセシビリティを区別する。

UIには、音声を用いるVUI、身体動作を利用するジェスチャーインタフェース、複数の指で操作するマルチタッチインタフェースなどがあります。タップ、スワイプ、フリック、ピンチ、ロングプレスはタッチ操作の例です。NUIは、人の自然な動作や行為に近い方法でシステムとやり取りする考え方です。利用場面に応じ、入力方法とフィードバックを対応させます。

音声・ジェスチャー・タッチなどの操作方式を区別する。

GUIでは、選択方法に合った部品を使います。ラジオボタンは複数候補から一つを選ぶ場面、チェックボックスは複数項目を個別に選択できる場面に向きます。プルダウンメニューやリストボックスは候補一覧から選ばせるときに使います。ツールチップは、対象を指したときなどに補足情報を表示する部品です。見た目ではなく、選択数や操作の性質で使い分けます。

GUI部品は選択数や操作方法に合わせて使う。

科目Aの形: 四肢択一(このページのために作った問題)

情報アーキテクチャで用いる要素の組合せとして、最も適切なものはどれか。

1. ラベル、ツールチップ、ナビゲーション
2. チャンク、ラベル、ナビゲーション
3. チャンク、ラベル、ジェスチャーインタフェース
4. チャンク、シグニファイア、ナビゲーション

答えと解説を見る

正解: チャンク、ラベル、ナビゲーション

情報アーキテクチャでは、情報をまとまりに分けるチャンク、内容を示すラベル、目的の情報へ導くナビゲーションなどを設計します。シグニファイアやツールチップ、ジェスチャーインタフェースはUIに関係しますが、ここで問う三要素とは異なります。

まちがえやすい点: 情報アーキテクチャの要素と、個別のUI表現や操作方式を混同しない。

科目Aの形: 四肢択一(このページのために作った問題)

アクセシビリティを高める取組として、最も適切なものはどれか。

1. 熟練利用者の操作回数を減らすことを優先し、入力方法は一種類にそろえる。
2. 文字や操作対象を認識しやすくし、異なる利用条件でも情報や機能を使いやすくする。
3. 操作に慣れた利用者の処理時間を短くするため、説明表示を最小限にする。
4. 画面上の情報量を減らすことを優先し、代替となる操作手段は設けない。

答えと解説を見る

正解: 文字や操作対象を認識しやすくし、異なる利用条件でも情報や機能を使いやすくする。

アクセシビリティは、異なる身体的条件や利用環境でも情報や機能へ到達しやすくする考え方です。特定の利用者だけに操作を最適化することとは異なります。

まちがえやすい点: 使い慣れた利用者の効率だけを高めることは、アクセシビリティの説明にならない。

科目Aの形: 四肢択一(このページのために作った問題)

四つの配送方法から一つだけを選択させるGUI部品として、最も適切なものはどれか。

1. ツールチップ
2. チェックボックス
3. ラジオボタン
4. テキストボックス

答えと解説を見る

正解: ラジオボタン

ラジオボタンは、複数の候補の中から一つを選択させる場面に適します。チェックボックスは複数項目を個別に選べる場面、テキストボックスは文字入力、ツールチップは補足表示に使います。

まちがえやすい点: 一つだけ選ぶのか、複数を選べるのかでラジオボタンとチェックボックスを分ける。