「このサイト、使いやすい！」「このサイトは使いにくいな、ほしい情報になかなか辿り着けない…」
普段インターネットを使っていて、このように思ったことはないでしょうか？
ユーザーに「いいサイト」と思ってもらうにはどのようにすればよいのでしょう。
この疑問を解決するのに欠かせない概念が「UIとUX」です。
今回は「UIとUX」について、お話していきます！

UIとは？

UIはユーザーインターフェース（User Interface）の略で、
インターフェースには「接点」や「境界面」という意味があり、2つ以上の異なるものを結びつける際に必要な窓口のようなものを指します。
UIはざっくりと言うと「製品と使用者（ユーザー）が接する部分」を指します。
たとえば、PCを操作するマウスやキーボードは、ハードウェアにおけるUIの例です。
アプリやWebサイトの「見た目」自体、ユーザーとの接点となるのでUIと言えます。

UXとは？

UXはユーザーエクスペリエンスの略で、
「Experience：エクスペリエンス」が「体験、経験」と訳せるように、UXは「人がモノやサービスに触れて得られる体験や経験」のことです。
ちなみに、なぜUEではなく、UXと略されているかというと、英語読みでは「Ex」を「エクス」と読むため、UXになっているそうです。
たとえば、とあるWebサイトを訪問した時に、サイトのUIがユーザーにとって見やすかったり、使いやすかったりしたら、あなたはそのWebサイトを見てどのように思いますか？
きっとこのような感想を持つのではないでしょうか。

・デザインが美しい
・フォントが見やすい（読みやすい）
・なんの情報がどこにあるか分かりやすい
・ページの読み込み速度が速くて使いやすい

これらの感想がUXです。
商品やサービスに触れて、ユーザーが感じることすべてがUXとなります。

WebサイトにおけるUIとUXの違い

パソコンという製品のUIという観点で見れば「キーボードや画面の大きさ、解像度など」を指し、
見ているWebサイトのUIという観点であれば「Webサイトの見た目（デザイン）や操作のしやすさ」を表します。
一方、UXというのは、もっとユーザー寄りの話です。Webサイトを見ている人が「このサイト、いいな〜分かりやすいな〜使いやすいな〜」と感じる体験＝UXなのです。

まとめると、

◯ UIとは（User Interface）：キーボード（ハードウェア）やWebサイトの見た目や操作性など。
◯ UX（User Experience）：Webサイトを通じてユーザーが得る体験のこと。

最悪のUIのWebサイト

以前、海外メディアで取り上げられて、巷を賑わせていた、「User Inyerface」というサイトを知っていますか？
「最悪のUI」つまり、とても使いにくいWebサイトとして話題となりました。
このサイトはベルギーの「BAGAAR」という会社が直感的に操作しやすいUIのルールにあえて反して、普段意識しないで利用しているUIをあべこべにしたらどうなるかという意図で制作したといいます。

実際に体験してみる

メールアドレスを入力して（架空のものでOK）最後のページまで進み、
登録完了画面を表示させることができればクリアというゲームなのですが、英語が苦手な人ほど直感的に操作できず苦戦してしまうでしょう。

どのようなサイトか、実際に体験してみましょう！

サイトURL：【https://userinyerface.com/】

こちらが最初の画面です。
どこをクリックすれば次に進めるのか見つけるところからすでに大変…。
中央の「NO」というボタンでもなければ、その下に下線が引いてある“click”という箇所や、色が変わっている“next page”という箇所ををクリックしても先には進めません。
さっそくややこしく、イライラしてしまいますね…

最後はこんなページです。最後のページまで、たどり着けるのでしょうか！
みなさんも挑戦してみてください！

まとめ

今回はUIとUXについてお話しましたが、User Inyerfaceを体験することで意識しないで利用しているUIデザインという素晴らしい設計に気づくことできました。
確かにサイトやアプリにおいて、見た目のカッコよさや美しさは必要かもしれません。ですがそれ以上にユーザー目線に立って考えられるデザインがとても重要です。
WEBサイトやアプリを設計する際には、ぜひこのUIとUXことも心がけてみてください。