大人の知識力テスト

UIとUXってどう違うか、説明できる?

「UI」と「UX」の違いを正しく説明できますか? UIとUXの違いをカフェに例えて解説。またWeb担当者にUX視点が必要な理由も紹介します。

内藤 貴志(Web担編集部)

7:05

「UI/UX」とセットで言われることの多いUIとUX。

デザインチームとやり取りするなかで、「UIとUXって、具体的にどう違うの?」と疑問に思ったことはありませんか?

どちらもWebサイトやアプリの制作・運用において欠かせない概念ですが、混同したままプロジェクトを進めてしまうと、チーム内での認識ズレや、成果の伸び悩みにつながってしまいます。

UIとUXの根本的な違い

一言で言うと、UIは「接点という手段」であり、UXは「体験という結果」です。

UI(ユーザーインターフェース)は、ユーザーがサービスと触れ合う「見た目や操作の仕組み」すべてを指します。たとえば、次のようなものです:

  • 画面のレイアウト
  • ボタンの配置や配色
  • フォントの種類
  • 入力フォームの設計 など

そもそも「インターフェース(Interface)」とは、英語の「inter(〜の間)」と「face(顔・面)」が合わさった言葉。何かと何かが情報をやり取りする際の「接点」を指します。

一方で、UX(ユーザーエクスペリエンス)は、ユーザーがサービスを利用するプロセスのなかで得られる「体験や感情」すべてのこと。次のような総合的な満足度がUXです:

  • 情報が見つけやすくて感動した
  • 購入手続きがスムーズでストレスがなかった
  • 使っていて気分が良い など

カフェの場合で考えるUIとUX

概念的な話だけではイメージしづらいため、身近なカフェに例えて考えてみましょう。

カフェにおけるUI

カフェにおけるUIとは、次のような「目に見えたり、身体に触れたりする設備や道具」のことです:

  • おしゃれなインテリア
  • 見やすいメニュー表
  • 持ちやすいコーヒーカップ
  • 座り心地の良い椅子

Webサイトで言えば、次のようなものが該当します:

  • 読みやすいフォント
  • 押しやすい購入ボタン
  • わかりやすいナビゲーション

カフェにおけるUX

一方で、カフェにおけるUXとは、次のような「顧客として得た体験や感情」のことです:

  • 落ち着いた空間でリラックスできた
  • 注文から提供が早くて助かった
  • またこの店に来たいと思った

Webサイトで言えば、次のような体験そのものを指します:

  • 欲しい商品がすぐ見つかって買えた
  • 信頼できるサイトだと感じた

いくらメニュー表というUIが美しくデザインされていても、注文してからコーヒーが出てくるまでに時間がかかったり接客が悪かったりすれば、顧客の体験であるUXは不満なものになります。

逆にコーヒーがどれだけ美味しくても、メニューが見づらく注文方法が不明瞭であれば、注文を諦めて帰ってしまうかもしれません。

なぜWeb担当者にUX視点が必要なのか

Web制作の現場では、どうしても目に見えるデザインであるUIの議論に時間を割きがちです。しかし、成果やコンバージョン率の向上を目指すうえで重要なのは、常にUXを出発点にすることです。

デザインが良いからといって、必ずしも成果が出るわけではありません。どれだけ先進的で美しいUIを作っても、ユーザーがどこを押せばいいかわからない、あるいはページが重いと感じたらUXは損なわれてしまいます。

ユーザーが商品を予約したり購入したりするのは、ボタンの色が好きだからではなく、「このサイトなら安心して購入できる」「自分の悩みを解決してくれそう」という感情や体験が得られたからです。成果につながるのは、まさにこのユーザーの感情の変化です。

優れたWebサイトを作るための実践プロセス

Web担当者が施策を動かす際は、まずUXというゴールを定義することから始めます。「誰にどんな感情になってほしいのか」「どういう体験を提供して課題を解決したいのか」を明確にすることが先決です。

次に、その定義したUXを実現するために最適な画面や動線というUIへ落とし込んでいきます。忙しいユーザーが迷わず短時間で申し込みを完了できる体験を作るために、入力項目を極力減らしたフォームを作ったり、スマホで押しやすい大きなボタンを用意したりするアプローチをとります。

最後に、アクセス解析による離脱率や滞在時間の確認、ユーザーテストを行い、狙い通りのUXが提供できているかを検証して改善を重ねていきます。

まとめ

UIはユーザーとの接点であり、画面やボタンなどの手段。UXはユーザーが得る体験であり、使いやすさや満足感といった結果を意味します。

優れたUIは、優れたUXを作るための強力な武器です。Web担当者として施策の企画やデザインのレビューを行う際は、このUIは狙った良い体験につながっているだろうかという視点を常に意識してみてください。