たとえるなら
お店の内装や案内表示です。商品がどこにあるかすぐわかる棚の配置、読みやすい値札、押しやすい呼び出しボタン。お客さんが直接見て触れる部分の作りが良いほど、迷わず気持ちよく買い物ができます。
もう少しくわしく
UI(ユーザーインターフェース)は、利用者(user)とシステムの接点(interface)という意味で、画面のボタン、文字、色、配置、メニューなど、利用者が直接見て触れる部分すべてを指します。アプリの画面デザインはもちろん、文字の大きさや押したときの反応まで、目と指に触れるものはみなUIです。
画面だけとは限りません。券売機のタッチパネル、ATMのボタン、スマートスピーカーへの話しかけ、リモコンの並び——人と機械のあいだにあるものは、すべてUIです。IT以前から使われてきた考え方で、押しにくいエレベーターのボタンも「UIが悪い」と言えます。
「UIがいい」と言われるのは、見た目が美しいだけでなく、説明されなくても使い方がわかるときです。押せるボタンは押せそうに見える、いま自分がどの画面にいるかわかる、間違えそうな操作の前には確認が出る。良いUIは空気のように意識されず、悪いUIは「使いにくい」という形でだけ気づかれる、と言われます。
設計にはいくつか定石があります。似た機能は近くに置く、重要なものは大きく目立たせる、同じ意味のものは同じ見た目にする、操作したら必ず反応を返す。どれも当たり前に思えますが、機能を足していくうちに崩れやすく、意識して守り続ける必要があります。
逆に、悪いUIの例もはっきりしています。押せるのか押せないのかわからないボタン、小さすぎて指で押せないリンク、何をすればいいかわからないエラー文、送信するまで間違いを教えてくれない入力欄。利用者が「自分が悪いのかな」と思ってしまう画面は、たいていUIの側に原因があります。
UXとの関係は「部分と全体」です。UIは体験のうち画面まわりの接点を指し、UXはサービスを知ってから使い終わるまでの体験全体を指します。UIが良くてもUXが悪いことはある——画面はきれいなのに手続きが多すぎて面倒、というのが典型例です。
UIを専門にデザインする職種はUIデザイナーと呼ばれます。感覚だけでなく、「人間はどこに目線を動かすか」「指で押しやすい大きさはどれくらいか」といった知見に基づいて設計する専門職で、エンジニアと協力しながら画面を作り上げていきます。
現場での使われ方
「このアプリ、UIがわかりやすいですね」
画面の作りが直感的で、迷わず操作できる、という褒め言葉です。
「UIの調整だけなら、仕様は変わりません」
ボタンの配置や見た目を整えるだけで、機能の中身(どう動くか)は変えない、という修正範囲の説明です。
「このボタン、押せるように見えないです」
見た目から操作できると伝わっていない、という指摘。UIのレビューで最もよく出る種類の指摘です。
「UI/UXデザイナーを募集しています」
画面の設計と体験全体の設計をあわせて担当する職種の求人。現場ではセットで語られることが多い言葉です。
よくある質問
UIとデザインは同じ意味ですか?
UIは「利用者が触れる部分」という範囲を指す言葉で、デザインは「設計する行為」です。UIデザインと言えば、その部分を使いやすく設計することを指します。見た目の美しさだけでなく、使いやすさの設計が含まれるのがポイントです。
UIとUXの違いは何ですか?
UIは画面まわりの接点、UXはサービスを知って使い終わるまでの体験全体です。UIはUXの一部にあたります。「画面はきれい(UIが良い)けれど手続きが多くて面倒(UXが悪い)」という状態がありうる、と考えるとわかりやすいです。
UIデザイナーになるには何が必要ですか?
デザインツールを扱えることに加えて、「なぜこの配置なのか」を言葉で説明できる力が重視されます。見た目の好みではなく、使う人にとっての理由で説明できるかどうかです。HTMLとCSSの基礎を知っていると、エンジニアとの会話がぐっと楽になります。
UIの良し悪しはどう判断すればいいですか?
いちばん確実なのは、初めて使う人に触ってもらって様子を見ることです。作った人は使い方を知っているので、自分では迷いに気づけません。どこで手が止まったか、何を押そうとしたかを黙って観察するだけで、多くの問題が見つかります。
エンジニアもUIを考える必要がありますか?
あります。押したときの反応、読み込み中の表示、エラー文の書き方は実装で決まる部分が多く、設計書には書かれていないことも珍しくありません。「このままだと使う人が迷う」と気づいて声を上げられると重宝されます。