NIJIBOX
【今さら聞けない】ユーザーインターフェース(UI)とは?UXとの関係性までやさしく解説

【今さら聞けない】ユーザーインターフェース(UI)とは?UXとの関係性までやさしく解説

「UI(ユーザーインターフェース)」。
Webサイトやアプリのデザインに関する話題の中で、よく耳にする言葉ではないでしょうか。
そしてUXという用語もUIと共によく用いられますが、正しく意味を理解できていますか?
この記事では、なんとなく理解しているけど今さら聞けないUIとは何かについて、UXとの違いや関係性もあわせて徹底解説します!

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

直訳すると「User Interface = ユーザーとの境界・接触面」
ユーザーインターフェースとは、ユーザーとサービスの接点全て、もしくは、ユーザーと道具を「つなぐ」ものを意味します。
Webサービスであれば、サイトのデザイン・文字のフォント・メディア(画像・動画)・サイト内検索機能など、ユーザーとの接点全てがUIにあたります。
なお、Webサイトやアプリ(ソフトウェア)のUIの良し悪しが語られがちですが、ハードウェアにもUIは存在します。
例えばTVのリモコンです。
リモコンは電源をつける・チャネルを変える・ボリュームを調整するといった操作が可能で、ユーザーとTVを「つなぐ」存在です。
UIとは

UIの進化とコンピューター普及への貢献

コンピューターのUIはモニター・キーボード等のハードウェアとソフトウェアの組み合わせによって形作られますが、UIの進化がコンピューターの普及に多大なる貢献をしたことはご存知でしょうか。

コンピュータが誕生した当初は、Character User Interface(CUI)と呼ばれるUIが用いられ、キーボードから文字(コマンドライン)を入力することでしか操作することが出来ませんでした。
操作のためには、まず“コマンド”を覚える必要があったため簡単には使いこなせず、ユーザーはごく一部に限られていました。
その後誕生したのが、「Graphical User Interface(GUI)」と呼ばれるUIです。

AppleがGUIを採用したことで「カーソルを動かし、アイコンをクリックしてアプリを起動する」という視覚的・直感的な操作が可能となり、ユーザー数を飛躍的に伸ばすことに成功しました。
ご存知のとおり、近年ではタッチスクリーンの導入によりUIが更に使いやすくなったことで、多くの人がコンピューターを操作できる時代となりました。

また、APIというワードを耳にされたことはありませんか?
実はAPIも、インターフェースの一種です。
UIはユーザーと道具を「つなぐ」ものですが、APIはソフトとソフトをつなぐ「ソフトウェアインターフェース」の代表格です。

APIとは、アプリケーション・プログラミング・インターフェース(Application Programming Interface)の略で、ソフトとソフトのやり取りを可能とする仕様を指します。

例えば、レストランのHPに表示されているGoogle Mapsも、API連携によるものです。
APIがあることで、自社で全ての機能を作る必要がなくなり、開発コストを抑えることが可能となりました。

この他に、コンピューターとプリンターのように、ハードウェア(機械)同士を「つなぐ」、ハードウェアインターフェースも存在します。
USBやHDMI等の規格がそれにあたります。

UIが注目される理由

このように、ユーザーと道具を「つなぐ」存在であるUIは、決して新しい概念ではありません。
では、なぜ昨今UIが注目されているのでしょうか。
それは、UIがユーザーの満足度に影響を与えるものとして、特にWebサービス・アプリにおいてはその影響度が大きく、収益にも直結してくるためです。

UI改善がユーザーの満足度に影響を与えた例

では、UIの改善が成功につながった例として、2008年オバマ大統領の選挙キャンペーンを紹介しましょう。

彼のチームは、キャンペーンサイトに掲載するメディア(動画・画像)と登録ボタンの文言を複数パターン用意・テストすることで、
最も効果的な組み合わせを検証しました(この検証手法は“A/Bテスト”と呼ばれています)。

この結果、サイト訪問者の登録率(CVR:コンバーションレート)は40.6%改善し、最終的には63億円の追加寄付を集めることに成功したといわれています。

なお、最も効果的なUIは、家族写真と“LEARN MORE(もっと知りたい方へ)”の組み合わせだったそうです。
彼のチームは、メディアにはオバマ大統領のスピーチ動画が好ましいと考えていたため、この結果は驚きと共に受け止められました。

UIとUXの違いと関係性とは?

UIとUXの違い

UI(ユーザ−インターフェース)とUX(ユーザーエクスペリエンス)。
よくUI/UXと表記され一緒に語られがちですが、この二つの言葉の意味は異なります。

前述の通り、UIとは、「ユーザーとサービスの接点全て、もしくはユーザーと道具を「つなぐ」もの」を意味します。
対して、UXとは、「ユーザーが、会社や製品・サービスと接触・利用した際に得られる体験・感情の総称」を意味します。

UIとUXの関係性

UIとUXの関係性
なぜUIとUXが一緒に扱われるのでしょうか?
その理由はUIが、UXを高めるための要素のひとつになるからです。

先ほどの選挙キャンペーンを例に説明します。
選挙キャンペーンにおけるUXとは、ユーザーが選挙キャンペーンについて知るところからはじまり、サイトを訪れ、そしてキャンペーンサイトで寄付をするといった一連の体験や感情を指します。

サービスと接触・利用したときからユーザー体験は始まるため、実際サイトを訪れる前に友人や知人にサイトの存在を聞いた場合はその瞬間から、UX(ユーザー体験)は始まっていると言えます。
サービスに関するユーザー体験について語る際、必ずしもUIであるサイトと直接接触している必要はありません

UIである選挙キャンペーンサイトによって、例えばユーザーが簡単に知りたい情報を得て満足できたとすると、優れたUIが結果的にUX向上に貢献したといえます。

このように、UIはUXの中で、非常に重要な役割を果たします。

Webサービス・アプリにおいて、特に重要なUIですが、UIがユーザー満足度の全てを決めうるわけではない点には留意が必要です。
「ユーザーエクスペリエンス(UX)」はより広い視点で捉える必要がある概念です。
UXに関してもっと詳しく知りたい方は、以下の関連記事をご参照ください!
■関連記事:
ユーザーエクスペリエンス(UX)とは?〜UIとの違いから具体事例まで〜

使いやすいUIとは?

UIがユーザーの満足度に大きく影響を及ぼすことがこれまでの説明でおわかりいただけたのではないでしょうか?
では、実際にユーザーに「使いやすい」「わかりやすい」と思われるUIとはどのようなものなのでしょうか。

実際にUIを改善していくためには、ユーザーの視点に立ってユーザーにとっての使いやすさを追求していく必要があります

以下の記事では、実際の改善例を紹介しながらUI改善プロセスについてご紹介しています!
気になる方はぜひ参考にしてみてください。
■関連記事:
UI改善の方法とは?具体的なプロセスを事例付きで解説!

また、UI設計でおさえておきたい考え方のひとつに、「OOUI」という概念があります。

ユーザーがマニュアル不要で簡単に操作ができる「使いやすい」UIの追求のために、ぜひOOUIの考え方をおさえておきましょう。
詳しくは以下の記事をご覧ください!
■関連記事:
OOUI(オブジェクト指向UI)とは?デザイナーなら知っておきたいメリットや設計方法まで解説

UIのこれから

近年関心を集めるUIですが、TVのリモコンもUIであるように実は身近な存在であり、かつ、その進化の歴史も長いということがわかりました。
特にコンピューターの登場でその複雑さが増したUIですが、優れたUIとは一体何でしょうか。

それは、流行りのデザインや凝りに凝ったグラフィックが使われていることではなく、
今も昔も変わらず、「ユーザーにとっての使いやすさ」ということに尽きると思います。

では今後、UIはどのような進化を遂げていくのでしょうか。
「使いやすさ」を追求した結果、今やスマホ1つでオーディオ等の家電が操作可能になりました。
更には、音声認証AI(人工知能)を兼ね備えたスマートスピーカーが、早くもユーザーとデバイスが「常時つながっている」状態を生み出しつつあります。
この大きなトレンドを意識し自社製品のUIはもちろん、商品設計自体を考える必要があることを、忘れてはなりません。

ここまで、UIについて解説してきましたが、いかがでしたか?
ニジボックスではサイト制作や開発における、情報設計やビジュアル設計といったUIデザイン面に加えて、ユーザビリティテストなどによるUI改善のご支援も可能です。
これまでも、クライアントの課題に寄り添ったデザインプロセスを、実際にリクルートや大手クライアント様の新規/既存事業でも数多く実践し、検証と改善を続けてきました。
ご興味を持たれた方はぜひ、下記ダウンロードリンクよりご参照ください。

ユーザービリティテスト実績資料DLバナー

■参考サイト:Optimizely Blog
https://blog.optimizely.com/2010/11/29/how-obama-raised-60-million-by-running-a-simple-experiment/