UIは「人から機械へ」と「機械から人へ」の往復路

ユーザーインタフェースを考えるときは、きれいな画面を作ることだけに注目してはいけません。人が目的を伝え、機械が現在の状態や処理結果を返すまでの、やり取り全体が対象です。たとえば券売機では、行き先を選んで代金を入れる操作が入力に当たり、選択中の切符や不足金額の表示、発券を知らせる音などが出力に当たります。

入力にはキーボード、マウス、タッチパネル、マイク、カメラなどが使われます。出力にはディスプレイ、スピーカー、振動機能などが使われます。これらは物理的な入力装置と出力装置ですが、UIには、画面上のボタンの配置、選択の手順、表示する言葉、操作後の反応も含まれます。同じ装置を使っていても、情報の示し方や操作の順番が違えば、別のUIになります。

文字で命令するCUIと、図形を動かすGUI

コンピュータの代表的なUIには、文字で命令を入力するCUI（キャラクタユーザーインタフェース）と、ウィンドウ、アイコン、メニューなどの図形を操作するGUI（グラフィカルユーザーインタフェース）があります。CUIでは、決められたコマンドを覚える必要がある一方、同じ操作を正確に繰り返したり、複数の命令を組み合わせたりしやすいという特徴があります。

GUIでは、候補や操作対象が画面に見えるため、利用者はすべての命令を暗記せずに選べます。スマートフォンのタッチ操作もGUIの一種で、指で対象に直接触れる感覚を利用しています。このほか、音声で指示を出して音声で返答を受ける方式もあります。どの方式が常に優れているということではなく、利用する場所、操作の頻度、求められる速さなどに応じて適した方式が変わります。

押した後の反応までがボタンの設計

画面にボタンを置くだけでは、分かりやすいUIにはなりません。利用者が「これは押せる」と気づき、押したことが機械に伝わり、処理が進んだかどうかを確認できる必要があります。操作できることを色、形、ラベルなどで知らせる手掛かりはシグニファイアと呼ばれます。

操作に対して状態を返すことをフィードバックといいます。ボタンの色が変わる、読み込み中であることを示す、入力に誤りがあれば該当箇所を知らせる、といった反応がその例です。反応がなければ、利用者は入力が受け付けられたのか判断できず、同じボタンを繰り返し押すかもしれません。

誤操作を起こしにくくする工夫も重要です。選べない項目を操作不能な表示にする、削除前に対象を確認できるようにする、入力形式の例を近くに示すなど、間違いを防ぐ段階と、間違えても戻れる段階の両方を考えます。また、同じ役割の部品は同じ位置や表現にそろえると、前の画面で覚えた操作を次の画面にも応用できます。

使いやすいUIは利用者と場面によって変わる

UIの評価は、作った人が分かりやすいと思うかどうかだけでは決まりません。目的の操作を達成できるか、余計な手順や迷いが少ないか、使った結果に納得できるかという観点が必要です。こうした使用時の達成しやすさに関わる考え方がユーザビリティです。

さらに、見え方、聞こえ方、身体の動かし方や利用環境は人によって異なります。色だけで状態を区別しない、文字を拡大しても内容が欠けない、キーボードでも操作できる、画像の内容を文字でも伝えるなど、複数の方法で情報へ到達できる設計が必要です。これはアクセシビリティの観点です。分かりやすい情報の順序や強弱を整える情報デザインとも深く関係します。

設計を確かめるには、想定する利用者が実際の目的に沿って操作し、迷った箇所や誤った箇所を観察します。説明を追加するだけでなく、選択肢を整理する、言葉を具体的にする、手順そのものを短くするといった改善につなげます。一度完成したら終わりではなく、利用状況を確かめながら見直す対象です。

画面がなくてもUIは存在する

UIという略語からアプリやWebサイトの画面を思い浮かべがちですが、人と機械の接点は画面に限られません。自動ドアのセンサー、家電のスイッチ、イヤホンから流れる通知音、ゲーム機の振動も、状態や操作をやり取りする仕組みの一部です。音声だけで操作する機器では、聞き取り中か、処理中か、命令を理解できなかったかを音で区別して返す必要があります。

また、見た目が同じUIでも、利用する状況によって使いやすさは変わります。屋外では画面の見え方が変わり、騒がしい場所では音だけの案内を聞き取りにくくなります。手袋を着けた状態では細かなタッチ操作が難しくなることもあります。UIを画面装飾ではなく往復する情報の設計として捉えると、表示、音、振動、物理的な形を組み合わせる理由が見えてきます。