2018.05.05

UIとは?UXとは?その違いとデザインとの関係性について

UI/UXという言葉自体はIT関係の業界にいる方なら一度は聞いたことがある言葉ではないでしょうか。
 
最近では、お客様側でも、ホームページをリニューアルしたい、アプリを作りたいetc様々な場面で重視したい項目にUI/UXをあげられる方も増えてきました。
 
ではUI/UXとはなんでしょうか。その違いはなんでしょうか。
 
これから何かを外部に発注されようとしているようでしたらその言葉の意味を理解することで、本当にUI/UXがわかっている業者に依頼できるようになると思います。
 
UI/UXとは抽象的な言葉なので具体的にイメージしやすい例を交えながら
今回は

  • ●  UI( ユーザーインターフェース)とは?
  • ●  UX( ユーザーエクスペリエンス)とは?
  • ●  誰のためのUI/UX?
  • ●  UI/UXを高めるためのペルソナ・カスタマージャーニーマップの必要性
  • ●  UI/UXに必要な能力

 
についてご紹介していきます。
 
 

UI( ユーザーインターフェース)とは?

UI( ユーザーインターフェース)とは?=ユーザーと製品・サービスとの接点である。

まずはじめにUI(ユーザーインターフェイス)とは何かですが、UI(ユーザーインターフェイス)とはUser Interfaceの略です。
ユーザーと製品・サービスとの接点を指します。
 
製品やサービスによってUIの範疇が変わりますが、例を使って説明します。
 

  • ●  パソコンの場合

パソコンにおけるUIとはユーザーが接触したり、目にするキーボード、ディスプレイなどを指します。
 

  • ●  ホームページ、アプリの場合

先ほどはパソコンという形があるものを対象にUIを説明しました。
 
今回はパソコンやスマホで表示されるホームページやアプリの場合の説明です。
 
ホームページやアプリはパソコンやスマホで表示し、パソコンやスマホを操作します。
ユーザーが目にする(グローバルナビ、ボタン、画像などの各要素やそのサイズ、色、フォントetc)、ボタンを操作した際、画面をスクロールさせた際、リンクを押下した際の操作感などをUIと言います。
 
厳密にUIを説明するとUI=モノ・対象を指しており、上記でいうと、ホームページのグローバルナビ、ボタン、画像などの各要素などを指しています。
 
ただし、IT/WEB関係でのUIという言葉の使われ方としては、デザインという見た目の話、操作性という使い勝手の話、情報設計という点でのわかりやすさなどを含んだ言葉として使われています。
 
 

UI( ユーザーインターフェース)とは?=手段である。

例えば、「ニュースを伝える」という目的があるとします。
 
新聞社でしたら、新聞を家に届け、お客様(ユーザー)は新聞と接触し、新聞を読むことでニュースが伝わります。
 
TV局でしたら、TVのニュース番組、ラジオ局でしたらラジオのニュース番組を通してニュースを伝えます。
 
今ではアプリやニュースサイト、動画サイトでニュースを届けたりすることも可能です。
 
つまり、「ニュースを伝える」という目的に対して、

  • ●  新聞
  • ●  TVのニュース番組
  • ●  ラジオのニュース番組
  • ●  ニュースアプリ、ニュースサイト

 
は全て手段となります。
 
 

UX( ユーザーエクスペリエンス)とは?= ユーザーの製品・サービスを利用した際の体験である。

UI(ユーザーインターフェイス)がUser Interfaceの略であり、ユーザーと製品・サービスとの接点を指していたのと同じようにUX(ユーザー エクスペリエンス)はUser Experienceの略であり、ユーザーの体験を指しています。
 
UIが接触点・手段のみを指していたのに対して、UXは体験という感情を扱いますのでその製品・サービスをどこまでと捉えるかで理解が少し難しくなります。
 
 

UX・・・製品・サービスに出会ってからの体験

UXはどこを範疇とするかで考える範囲が変わります。
 
UXは簡単にいうと、ユーザーの体験の事ですが、その体験は製品・サービスに出会ってからの体験と出会う前の体験があります。
 
まずはわかりやすい製品・サービスに出会ってからの体験について説明します。
 

  • ●  パソコンの場合

UI:ユーザーが接触したり、目にするキーボード、ディスプレイなどを指します。
UX:上記のユーザーが接触する接点のみでUXを捉えると、パソコンを見た時に例えばMacBookであれば、パソコンの形状自体が美しいなとか、持ち上げてみれば軽いなと感動するのではないでしょうか。
 
キーボードをタッチしてみて、スムーズで押しやすいなというのもUXです。
 
外出した際にMacBookをカバンに入れて持ち運んだ際も軽いなと感じたり、起動したら時間があまりかからなくて快適だなとか、最近のものでしたら外出してもバッテリーが1日持って便利だなと感じたなどの体験全てUXです。
 

  • ●  パソコン以外も対象にした場合

MacBookが綺麗な箱に入っていて、宝物みたいに感じた。嬉しいなと感じた。MacBookというパソコン以外の箱までを対象にした場合にはこのような感情、体験もUXです。パソコンの箱はユーザーと接触するUIとも言えます。
 
 

UX・・・製品・サービスに出会うまでの体験

 
次に、製品・サービスに出会う前の体験について説明します。
 

  • ●  パソコンに出会う前、つまりAppleがMacBookを売るまでも含めた場合

ユーザーは、例えばTV CMで新しいMacBookが出るのかと認知し、いやーまた今回もカッコいいなーと感じます。
 
そして、銀座のAppleの店舗に向かいます。ここで、いろいろな国の人たちが自分たちの製品を熱く語ります。
 
こうして、銀座という場所で、何か特別なものを買おうとしているんだなと、ワクワクし、いろいろな国の人が働いている姿を見て、このMacBookを使えば自分ももっとグローバルに仕事ができるかもなと感じます。
 
そして、店員が熱く語る姿を見て、製品に対する愛を感じ、自分もこのMacBookを大切に使おうと感じます。
 
そして購入し、MacBookを使っていて、様々な感動を得ました。
 
ある日、MacBookが故障しました。カスタマーサポートへ連絡します。
 
そこで、また丁寧でわかりやすくサポートをしてもらい感動します。
 
感動した結果、また何年かしてもMacBookを買おうと思います。
 
これら一連の体験全てUXです。
 
 

誰のためのUI/UX?誰にどのような体験を提供するのか。

UIはUXを高めるための一つの手段

UIの場合にはユーザーがMacBookというパソコンに対しての接触面への使い勝手や操作性を高めることのみで、UX(ユーザーの満足度=体験)を高めようとする活動です。
 
つまり、UIとはUXの一部の手段です。
 
また、ユーザーと接触面(インターフェイス)という主にデザインに関してのUX(体験)を高めるのがUIの役割とも言えます。
 
 

誰のUI/UXを高めるのか。ターゲット・ペルソナが重要。

先ほどの例ではMacBookが使いやすくて感動したというUI/UXの説明をしました。
 
これは20-30代の私の周りにいる比較的WEB/ITに詳しい人間をイメージして、説明した例です。
 
ただし、誰をターゲットにするのかによってUI/UXは変わります。
 
これが例えば私の父親(70代)でしたら、数年前にwindowsを使い出したというITに関してのレベルです。
 
父親の場合でしたら、恐らく今MacBookを触っても使い勝手が違うため、感動せず、使いにくいなと感じることでしょう。
 
つまりUXは誰をターゲットにするかで変わるのです。
 
 
UIについても同様です。例えば、ひらがなが多用されたホームページがあるとします。
 
これは大人にとってはただ読みにくいですが、まだ漢字がわからない子供には読みやすいということが起こります。
 
UI/UXも同じものを同じように提供しても人によって感じ方は異なるのです。
 
つまり、万人にとって、優れたUI/UXというものはないのです。

 
 

UI/UXを高めるにはペルソナ・カスタマージャーニーマップが必要。

【ペルソナ】
さきほど、誰をターゲットにするのかによってUI/UXは変わるという例を説明しました。
 
ターゲットとは先ほどの私の父親のように70代、男性、ITには詳しくないというざっくりしたレベルです。
 
ペルソナはもっと具体的で、ある特定人物の特徴を表したものになります。
 
田中 太郎、73才、男性、四国出身、大阪在住 趣味は釣りで日々、釣り番組をみたり、釣り関係のホームページをチェックしている。
など、ユーザー像がかなり細かくなったものです。
 
誰でもいいというよりも売りたい製品・サービスの典型的なユーザー像を上記のような具体的な形でまとめたものをペルソナと言います。
 
万人によっての優れたUIというものはなく、UIを考える場合には自分たちが価値を届けたいターゲット、ペルソナをきっちりと設定することで意味のあるUI設計が可能になります。
 
 
【カスタマージャーニーマップ】
カスタマージャーニーマップとは顧客(カスタマー) 旅(ジャーニー) 地図(マップ)で、顧客がどのようなプロセス、タッチポイント、感情・思考でどのような体験をするかを1枚に視覚化したものです。
 
上で、MacBookの例で「製品・サービスに出会うまでの体験」としてTV CMで認知し、購入後のカスタマーサポートの話までをしました。
 
ここでは一つの例として、私の友達がTV CMでMacBookの認知から購入後のカスタマーサポートまでの感情・思考の変遷を旅しているような形です。
 
こういうものをまとめたものです。
 
一つにまとまっていることで企業が設定する理想的なゴールに対して、ユーザーに一貫した体験を提供しやすくなるためのツールです。
 
例えば、こういうものがない場合には、TV CMの現場では20-30代をターゲットにせず、お年寄りにも使いやすいという訴求をするかもしれません。そして、そのお年寄りは店舗に行くといかにも若者向けな店舗でちょっと違ったなという感覚になるなど、一貫性がないことが起こるということです。
 
 

UI/UXに必要な能力はデザインではなく、コンサルティング・ビジネス能力

ここまでの説明でUI/UXに必要な能力、特にUXはそうですが、綺麗にデザインするという能力はUXのうちのUIのある特定分野でしか必要のない能力だと分かったと思います。
 
UIでもターゲットを定めて、ペルソナをきっちりと設計しない場合にはなんとなく綺麗だけどターゲットがずれていて的外れなデザインになってしまいます。
 
UXは特にですが、カスタマージャーニーマップのように製品・サービスとユーザーが出会う前から出会った後までを考え、その中で例えばホームページ、アプリはどうあるべきかを考えるのがUXです。
 
これはもう経営センス・ビジネス・コンサルティングの領域の仕事です。

 
 

まとめ

いかがだったでしょうか。
 
UI/UXという言葉がよく聞かれるようになってきましたが、きっちりやろうとするととても難しい仕事です。
 
私も実際に本当にこの領域を得意にしている業者・デザイナーにはほとんど出会ったことがありません。
 
私たちはただ作ることを目的とせず、UI/UXを考慮したコンサルティング、制作を得意としております。
もし、ちょっと自分たちでやるには大変だなと感じられたら、一度私たちにご相談ください。
確実にメリットがある情報をご提供させていただきます。