成果が出るホームページを構築するうえで欠かせない概念の1つに「UI（ユーザーインターフェース）/ UX（ユーザーエクスペリエンス）」があります。一緒に語られることの多いUIとUXのそれぞれの単語の意味の違いについて、しっかり理解していますか？

デザイナーの方は理解されている方が多いと思いますが、デザイナー以外の方も、UI/UXについてしっかり理解しておかないと、デザイナーとのコミュニケーションに齟齬が生じてしまう可能性があります。

今回は、意味を混同してしまいがちなUIとUXの違いや改善事例を紹介します。

UI（ユーザーインターフェース）とは？＝ユーザーとサービスとの接触面

UIは「ユーザーインターフェース（User Interface）」の略です。Interfaceとは「接点、接触面」という意味で、UIはユーザーと製品・サービスの接触面を指すので、「ユーザーの目に触れる部分使用する部分」はすべてUIとみなすことができます。

***

Webサイトの場合、パソコンやスマートフォンに表示されるデザイン、フォントなど、製品であれば製品そのものや外観など、ユーザーの視覚に触れる全ての情報が「UI（ユーザーインターフェース）」と呼ばれます。

UX（ユーザーエクスペリエンス）とは？＝ユーザーがサービスを利用して獲得できる体験

よくUIと同列に語られるものとして、UXがあります。UXは「ユーザーエクスペリエンス（User Experience）」の略です。Experienceとは「体験、経験」を意味し、UXとは「ユーザーが製品・サービスを通じて得られる体験」を指します。

***

例えばWebサイトの場合、

  • デザインがキレイ
  • フォントが読みやすい
  • お問い合せフォームや購入ページまでの導線がわかりやすい

といったWebページの印象で変わる表層的な部分から、

  • 商品を注文したらすぐに届いた
  • 対応が丁寧だった
  • 商品のクオリティが高い

というようなサービスの質に関わる部分も「UX」です。サービスを利用する一連の行動の中で、ユーザーが感じたこと全てがUXになると捉えましょう。

UX（ユーザーエクスペリエンス）向上の企業事例

ここまでUIとUXの違いについて説明してきました。UIの改善にについては、Webサイトやアプリの設計の見直し、デザインなどのリニューアルなど、イメージがしやすいのではないでしょうか？一方、UXについては、改善したくても、具体的なイメージが湧きづらいかもしれません。UXが向上した企業の事例をみながら、UXについての理解を深めましょう。

味だけではなく、“お出かけ”と“コレクション”も楽しめる「CokeON」

coca.png
画像引用：【導入事例】日本コカ･コーラ株式会社様 | 株式会社アイ・エム・ジェイ

赤いボトルでお馴染みのコカ・コーラをはじめ、幅広い世代に愛されている日本コカ・コーラのドリンク。コカ･コーラでは、ドリンクの“味”だけではなく、“外へ出かける”ことを楽しくするためのサービスとして、「CokeON」というアプリを提供しています。

CokeONはBluetoothを利用したスマートフォンと自動販売機の連動アプリ。ユーザーはこれを利用すると、スマートフォンだけでドリンクの購入ができるだけでなく、15スタンプでドリンクが一本もらえるポイントサービスが受けられるようになります。

スタンプは、購入したドリンクのロゴを利用したものが多く、「他の種類のスタンプも集めたい」とワクワクできる仕様。さらにアプリには歩数カウントの機能もあり、「外へ出かけてコカ・コーラの自動販売機を見つけ、購入する」ことを最大限に楽しめる工夫が散りばめられています。

ただ単にドリンクの味やボトルのデザインを改良していくだけではなく、ユーザーがドリンクを購入し、味わうまでの一連の動作＝体験を楽しめるようにする。これがUXを改善するということです。

参考：
導入事例】日本コカ･コーラ株式会社様 | 株式会社アイ・エム・ジェイ

“VIPでしか味わえない体験価値”を積極的に伝えて売上を2倍にした「Oisix」

Oisixでは、受注の70%を占めるVIP会員に向けて「VIP専用売り場」を用意しています。しかし、VIP専用売り場を利用した売上はわずか14%。VIP会員の受注数に対し、閲覧数やVIPページからの受注単価は年々低下傾向にあったそうです。

そこでOisixでは、現状の課題を「VIP会員が自分がVIPだと気が付かず、特別な売り場の存在を認識していないため」だと考え、この状況の改善に動きました。

具体的には、「VIPであることに気づいてもらう」「VIPでしか得られない価値を伝える」「瞬間的に美味しそうだと思えるクリエイティブで訴求する」の3つを実施。お客様自身に“特別な存在であること”や“VIPでしか味わえない食材があること”、“VIP素材を使った特別なレシピ”などを積極的に伝えることで、VIP専用売り場の売上を2倍に伸ばしたそうです。

参考：
OisixのUX体験設計　デザインの力でECの売上が2倍にアップ！　お客様の行動心理に基づいたUX改善例

UI（ユーザーインターフェース）とUX（ユーザーエクスペリエンス）の違いとは

UI（ユーザーインターフェース）はUX（ユーザーエクスペリエンス）を高めるための1つの要素

UI/UXとセットで語られることが多いため誤解を生みやすいのですが、上記で解説したとおり、UIとUXは単純にセットで語れるようなものではありません。

ユーザーにより良い「体験」をしてもらうには、優れたUIが欠かせません。ユーザーとの接触面であるUIを蔑ろにして、ユーザーにとって非常にわかりにくい構成にしてしまうと、ユーザーは自然と離れてしまうからです。

しかし、ユーザー体験を得られるのは「UI」の部分だけではありません。例えばECサイトの場合、商品購入から到着までのスピードや対応の良し悪し、商品やサービスそのものの質もUXに含まれます。

つまり、UIはUXを高めるための1つの要素に過ぎません。UXを高めたいのであれば、UIだけに固執せず、ユーザーにコンバージョンしてもらうためにはどのような感情を喚起すればいいのかを考えましょう。

UI（ユーザーインターフェース）/UX（ユーザーエクスペリエンス）の改善に必要なこと

UI/UXどちらもターゲットを念頭に置く

UIとUXは、ターゲットを明確に据えることが重要です。ターゲットに受け入れられるUIでなければすぐに離脱してしまいます。例えば電動髭剃りを販売するECサイトで女性に人気のキャラクターがメインで使われていたら、男性はそのページを見たいと思うでしょうか。

UXは特にターゲット選定が重要です。同じ商品やサービスでも、得られるユーザー体験は人によって違います。自社がターゲットとするユーザーが何を良いと感じるのかを明確に把握する必要があるでしょう。

UI/UXを改善するはじめの一歩

UI/UXの改善にはターゲットが何を求めているのかを意識する必要があります。そもそもターゲットが誰なのか？どのような生活をしているのか？などが定まっていなければ、闇雲にWebサイトの更新を繰り返してしまうことになりかねません。UI/UXを改善したいのであれば、まずはペルソナを設定してみましょう。そのペルソナにとって最適なWebサイトやECサイトはどのようなものかを考えてみてください。

UI/UXについてもっと学べる記事

GoogleのUX指標「Core Web Vitals（コアウェブバイタル）」とは？LCP・FID・CLSを解説

GoogleのUX指標「Core Web Vitals（コアウェブバイタル）」とは？LCP・FID・CLSを解説

Googleは2020年5月28日、検索ランキングの指標を「Core Web Vitals（コアウェブバイタル）」と既存のシグナルを組み合わせると発表した。今回はCore Web Vitalsを構成する3つの指標、LCP・FID・CLSについて解説していく。
マーケティングにおけるアウトカムとは？CSやUXの観点から解説

マーケティングにおけるアウトカムとは？CSやUXの観点から解説

企業のマーケティング担当者にとって「アウトカム」は「アウトプット」よりも重視すべきポイントです。とはいえ「アウトカム」と聞いてもピンと来ない方もいらっしゃるでしょう。アウトプットが成果物を指すのに対して、アウトカムは成果物がもたらした本質的な価値や変化を指します。この記事では、アウトカムの意味に加えて、どのようなものがアウトカムに当てはまるのか、どうすればアウトカムを最大化できるのか、という点についても解説。マーケティングの効果を高めたい方は是非参考にしてみてください。