ご相談はこちら
お問い合せ

Let’s Talk!

まずはお気軽にお問い合わせください。 担当より折り返しご連絡いたします。
092-292-9749(平日10:00〜19:00)
This is some text inside of a div block.
This is some text inside of a div block.
This is some text inside of a div block.
This is some text inside of a div block.
This is some text inside of a div block.
This is some text inside of a div block.
Oops! Something went wrong while submitting the form.

【わかりやすく解説】UX/UIとは?言葉の意味や違いとその重要性

企業やビジネスシーンでのDX化が進む中で、UX(ユーザーエクスペリエンス)とUI(ユーザーインターフェース)がサービス・プロダクトの成功には欠かせません。

今や優れたUX/UIの重要性は、業界・分野問わず繰り返し強調されており、これまで以上に重要性が高まっています。

経済産業省による、DX(デジタルトランスフォーメーション)の定義:

企業がビジネス環境の激しい変化に対応し、データとデジタル技術を活用して、顧客や社会のニーズを基に、製品やサービス、ビジネスモデルを変革するとともに、業務そのものや、組織、プロセス、企業文化・風土を変革し、競争上の優位性を確立すること。

そこで本記事では、UXUIの言葉の意味や違いから、優れたUXとUIの実例、重要性まで分かりやすく簡単に解説していきます!

読んでほしい人

・UXとUIの意味や違いが曖昧な人

・UXとUIの重要性や必要性がいまいちよく分からない人

・優れたUXとUIがどういった影響を与えるのか知りたい人

・UXUIの実例を見てみたい人

上記に該当する人はぜひ読んでみて下さい!

UXってなに? ユーザー体験のこと

UXとは User Experience の略で、「ユーザー体験」を意味します。ユーザーがサービスやプロダクトを通じて得られる「優れた体験や経験」を指します。UXデザインは、その体験を提供することを目的とした手段になります。

つまり、ユーザーがサービスやプロダクトと関わる「利用前/利用中/利用後」の一連のフローを通じて思う感情や、その過程で得る時間、目に見えない体験は全て「UX」と捉えることができます。

ちなみにですが、ユーザービリティの第一人者とも言われるヤコブ・ニールセンと、人間中心設計のアプローチを提示し、ヒューマン・インターフェイスやユーザビリティに多大な貢献を果たしたドナルド・ノーマン率いる、Nielsen Noriman Group によると、

"「ユーザーエクスペリエンス」には、エンドユーザーと異業、そのサービス、および製品との相互作用の全ての側面が含まれる。"

と定義されています。

良いUX vs 悪いUX

写真に写っている男性と同じような体験をしたことがある方はいますか?


コップのデザイン(UI)は可愛いですが、実際にコップを使って飲み物を飲むと、耳がちょうど目に刺さってしまっていますよね。これでは、いくらコップのデザイン(UI)が魅力的でも、ユーザーにとっては不快感を覚える体験となってしまいます。

「耳の間から飲めるよ!」という声も聞こえてきそうですが、個人的には写真の状況で「この飲み方をすると耳が目に刺さるからこっちから飲もう」と、ユーザーに考えさせてしまうのは良いUXではないと考えます。直感的に使うことができ、飲みたい飲み物をスムーズに飲めて身も心も満足できる体験こそが良いUXだと思います。

次に、上記で示した「UI」の意味について説明していきます!

UIってなに? ユーザーとの接点のこと

UIとは、User Interface の略で、ユーザーとの接点を意味します。つまり、ユーザーとサービス・プロダクトとの接触面(視覚的要素)は全てUIと捉えることができます。分かりやすく、身の回りにあるUIの具体例をいくつか紹介します。

UIの具体例

・Instagram を使う場合 ▶︎ 携帯/アプリ上で操作するボタン/見たり読んだりするフォントなど

・ハンドクリームを使う場合 ▶︎ クリームが入っている容器/フタなど

・ドアを開ける場合 ▶︎ ドアノブ

・食器を洗う場合 ▶︎ 食洗機/食洗機のボタン/手袋など

UIが何か少しずつイメージが湧いてきていますでしょうか?UIデザインは、接触面(上記の具体例で紹介した)を設計する方法です。

UIデザインは具体的に何をするのか説明すると、アプリ開発においてはデザイン原則に基づき情報設計やプロトタイプ作成/ビジュアルデザインなどを行います。利用者がサービスやプロダクトを認知/理解し、「使いやすいな/面白いな」と感じられる価値ある体験を構築する要素の1つとしてUIが存在します。

ここで、UIについて理解できた方へ、どんなUIが良いとされ反対に何が悪いとされるのか「ドア」を例に説明します。

良いUI vs 悪いUI

良いUIは、上の写真のようにドアノブ(UI)の形に応じて、ドアを引くか押すか直感的に判断することができます。日常の中でよく使っている玄関のドアや、お店の入り口のドアもよく見るとそうではないでしょうか。

対して、人が開ける必要のない「エレベータ」「自動ドア」には取っ手がないはずです。ドア(UI)を見て奥に押すか、手間に引くか、横にスライドか、自動ドアか立ち止まって考えてしまうような場合は良いUI(ドアノブ)とは言えません。

ここまでをまとめて、UI UXとは?

ここまで、UI UXとは?UIとUXについてそれぞれに分解して解説してきました。

おさらいしておくと、UI(User Interface)はユーザーとサービス・プロダクトの接点(視覚的要素)を指します。一方でUX(User experience)は、ユーザーがサービスやプロダクトを通じて得られる「優れた体験や経験(ユーザ体験)」、つまり利用の前後を含めた一連のフローを通じて得られる感情や時間、目に見えない体験の全てを指します。

上に挙げた例のように、ユーザーが使いづらさを感じてしまうと、継続したサービス・商品の利用が見込めず、そもそもサービスを深く体験する際に離脱してしまう可能性もあります。だからこそ、UX/UIデザインはとても重要なのです。

ただここまで聞いても、なんだかぼんやりしているというか、分かったようだけど、もっとはっきり意味を捉えたいという方もいるかもしれません。確かに、それぞれにしっかりとした定義がありながらも、境界線が曖昧なため同一のものとして扱われることも珍しくありません。

そこで、次の章ではUI UXとは?のもう一つ先の「違い」について紹介します!そこまで読んでいただければ、これから、もし「UI UXとは?」と聞かれてもバシッと答えれると思います!

UXとUIの違いはなんですか?

UXとUIの違いについて、UXは「ユーザーがサービスやプロダクトを通じて課題を解決するまでの過程」を示し、UIは「プロダクトのビジュアル面や見た目などの視覚的要素」だと言えます。

「UXUIの違い」このテーマは人によって様々な見解があるので、違いについて分かりやすく書かれていた元 Google のプロダクトマネージャーの方の意見もご紹介します。

UXは、ユーザーが問題を解決するまでの道のりに焦点をあて、UIは、製品の表面の見た目や機能に焦点を当てる。 ユーザーインターフェーズ(UI)は、ユーザー体験(UX)の一部でしかない。私は、レストランに例えるのが好きです。UIはテーブル、椅子、皿、グラス、食器です。UXは料理、サービス、駐車場、照明、音楽に至るまで全てです。

出典元:UI vs. UX from UserTesting[1]

UXとUIの違いが理解できた方に、補足で1点お伝えしたいことがあります。それは、「優れたUI = 優れたUX」ではないということです。UIはあくまでUXの中の1つの要素にすぎず、一方が他方なしでは成り立ちません。

Youtube を例にあげて考えてみましょう。

Youtube を開いた時に表示されるボタンや、レイアウトのデザインは分かりやすく綺麗な見た目(UI)です。ですが、動画視聴時のローディングに5分かかってしまう場合、あなたはどうしますか?おそらくローディングに5分かかる場合、大抵のユーザーはその5分を待たないと考えられます。


理由は、人間が次の行動を行うまでに反応できる時間の閾値は0.4秒以内であることが判明しており、人はシステムの反応が0.4秒以上経過すると不快に感じてしまう(UX)からです。


不快に感じたユーザーはアプリを閉じるか、使えないなと感じたら類似アプリを探しに行くなど、アプリから離脱することが考えられます。

大事なことなのでもう一度言わせてください。良いUIデザインだからといって、それが必ずしも優れたユーザー体験(UX)を提供できているとは限りません。

「違いは分かった。じゃあ、どうしてUXとUIは大事なの?」という方に、UXとUIデザインの重要性についてお伝えします!

なぜUX/UIデザインが必要なの?

ビジネスの成功において、顧客満足度は不可欠です。理由は、サービスやプロダクトに満足感を覚えた顧客は、「サービス/プロダクトの情報を拡散」「リピーターになる」といったアクションを起こすことが想定され、結果的に直接利益に繋がる可能性が高くなるからです。

UXUIに配慮したデザインは、総合的な顧客満足度を高め、継続的にサービス・プロダクトを使ってもらう可能性を高めていくことができます。


ここで、UIUXの重要性について、実例を用いて説明していきます。

300億円ほどの売り上げを逃す原因となった、「3億ドルのボタン」のケース

出典記事:The $300 Million Button

上記はあるECサイトのログイン/新規登録画面です。 一見シンプルで誰もがよく見る画面だと思いますが、何が問題なのか分かりますか?

 

“問題はレイアウトではなく表示タイミングだった”

この画面は、ユーザーが買い物かごに商品を入れ「購入ボタン」を押した後に表示されていました。つまり、ユーザーは支払時に必要な情報を入力する前にこの画面と遭遇することになります。

このフローに対して担当のデザインチームは、「リピーターの利便性を重要視するためであり、新規顧客は購入する際に生じる登録の手間はあまり気にしないだろう。」と考えていました。

“ところが、ユーザー調査の結果は意外なものに”

この記事の著者が、「サイトで商品を購入したい人」を対象に行ったユーザー調査では、意外な事実が判明。ユーザーは、驚くほどに登録に対して抵抗感を持っていたのです。そんなユーザー達の声は、、

・ただ商品を買いたいだけ

・いつも使っているメールアドレスとパスワードが使えずイライラする

・新規利用かそもそも覚えていない

・しつこい営業メールなのかと疑った

“リピーターにも全くメリットがなかった”

また、リピーターの2回目以降の利用を考慮して作ったフォームのはずが、実際は多くのリピーターが以下の理由からフォーム入力で躓いていることが分かったそうです。

・登録したメールアドレスとパスワードを覚えていない

・登録したメールアドレスを覚えていないので「パスワードをお忘れの方」も使えない

・ログインを諦めて再登録する

“多くのユーザーがパスワードの再設定と会員登録を複数回行なっていた”

サイトのデータベースを分析した結果でも、商品購入者の約45%が複数回のパスワード再設定/会員登録を行なっていたことが明らかになっていた。再設定や再登録後に購入まで完了したユーザーは少なく、このフローの途中で約75%のユーザーが離脱したようです、、驚きですね。

“この問題に対する解決策は、すごくシンプルだった”

サイト設計者の解決策は、登録(ログイン)ボタンを取り除き「次へ」のボタンとシンプルなメッセージを配置するというもの。この結果、購入者数が45%増加し1年でサイトの売り上げは300億まで増加したとのことです。

ボタン1つだけで売上に300億円もの差が出るなんて驚きですよね。UXUIの重要性がわかりやすく数字に表れている事例を紹介しましたが、いかがでしたでしょうか?3億ドルのボタンの例をもって、ユーザー視点に立つUXUIデザインの重要性があなたに届いていると嬉しいです。

まとめ

最後まで見て頂きありがとうございました!

より多くの方に使ってもらう、愛されるプロダクトやサービスを開発するには、優れたUIとUXの両方が必要不可欠です。これから何かサービスやプロダクトを作ろうと考えている方には、この記事で述べた「UX/UIが何なのか」「両者の重要性」等について知って頂くと、課題解決に繋がるプロダクト・サービスを社会に生み出す事ができるのではないかと思います。

また、UIデザインに焦点を当てて、CUIやGUIなどのUIの歴史を辿った記事も書いていますので、興味のある方はぜひそちらもご覧ください!

▼関連記事▼

UIデザインの歴史を今後について考える

今、この記事を読んで下さった方で、「顧客満足度をもっと高めたプロダクトを開発したい」「開発会社を探している」、または「アイデアはあるけど何から始めたらいいか分からない」という方がいましたら、JIITAK までお気軽にお問い合わせください。

JIITAKでどんなデザインを行なっているのか気になった方は、ぜひこちらも覗いていってください。UXUIの重要性を深く理解しているメンバーが、ヒアリングから丁寧にサポートさせて頂きます。

参考/引用元サイト

[2]
[3]
[4]
[5]
[6]
[7]
[8]

目次

記事をシェアする

この記事を書いた人

Rio

UIUXデザイナー。人の行動を動かす心理原則や仕組みを知ることが好き。 エナジードリンクはカフェラテ。

Contact Us

プロダクト開発・新規事業・DX支援を行っています。
まずはお気軽にお問い合わせください。