ユーザーの満足度が高いWebサイトやアプリを開発するには、UI(ユーザーインターフェース)が重要なポイントとして注目されています。
UIとは、ユーザーが製品やサービスを利用する際におけるすべての接点のことです。
ボタンの配置、フォント、レイアウトなどの視認性に関することやユーザーの操作にシステムが音声や画面の推移などで的確に反応することやアクセシビリティなどが含まれ、UIはユーザー体験を意味するUX(ユーザーエクスペリエンス)を作り上げる重要な要素です。
数多くのWebサイトやアプリが溢れる現代において、ユーザーの満足度を高めて、継続的に利用されるにはUIの改善が欠かせません。
しかし、UIの重要性は広まってきているものの、見た目の美しさや提供側が伝えたいことばかりが重視されて、「使いづらい」「次はどのボタンを押せばいいかがわからない」など、ユーザーにストレスを与えてしまっているWebサイトやアプリも存在します。
開発に携わるデザイナーやマーケター、エンジニアにはUIへの理解が不足している人もまだまだ多いのかもしれません。
そこでこの記事では、UIの意味や重要性をわかりやすく解説しながら、UIデザインを向上させるポイントを具体的に説明します。UIデザインを改善した事例も紹介しているので、ぜひ最後までご覧ください。
・Webサイトやアプリの継続率を高めたいマーケター
・製品・サービスの価値向上を図りたいプロジェクトマネージャー
目次
UI(ユーザーインターフェース)とは
UIとは「ユーザーインターフェース(User Interface)」の略称で、ユーザーが製品・サービスを使用する際のあらゆる接点を指します。英語の「インターフェース(Interface)」という単語そのものには、「接点」や「境界面」という意味があります。
UIには、具体的に以下の要素が含まれます。
● 画像や動画
● レイアウト
● ボタンの配置
● 入力補助機能
WebサイトのUIを例に挙げると、「迷わず申し込みボタンをクリックできる」「フォーム入力で補助機能があって便利」など、「デザインの美しさ」ではなく操作性や機能性がUIでは重視されます。
UIの種類
UIの種類は、以下の3つに大別できます。
・CUI (Character User Interface)
・GUI (Graphical User Interface)
・NUI (Natural User Interface)
それぞれの特徴を見てみましょう。
CUI (Character User Interface) | コンピューターのキーボードを用いた、文字入力によるユーザー接点のこと。 コンピューターが登場した当時はCUIしかなく、コマンド入力の専門知識を持った人しか使いこなすことができなかった。 |
---|---|
GUI (Graphical User Interface) | コンピューターのグラフィック(画像やアイコン)をマウスでクリックし、ドラッグ&ドロップすることで簡単に操作できる仕組みのこと。 WindowsやMacのシステムで広く使われている。 |
NUI (Natural User Interface) | 画面タッチ、音声入力、身体の動きに対する反応など、自然な方法でコンピューターやスマートフォン、スマートスピーカーやゲーム機などを操作できる仕組みのこと。 直感的に操作でき、プロダクトの使いやすさが大幅に向上する。 |
文字入力だけのCUIからGUIへと進化したことで、パソコン画面にグラフィックスが表示されて、マウスによる直感的な操作が可能になりました。
最近では、スマートフォンや券売機のタッチパネル操作が身近なものになりました。スマートスピーカーやゲーム機などでは、ボタン操作しなくても身体の動きに反応して操作できる事例も増え、これらはNUIと呼ばれています。
UX(ユーザーエクスペリエンス)との違い
UIとしばしば一緒に言及される単語として、「UX」が挙げられます。UXとは「ユーザーエクスペリエンス(User Experience)」の略称で、ユーザーが製品・サービスの利用中に得られる体験のことを指します。
例えば、以下のような「体験」がUXに該当します。
● 迷わず決済完了まで進むことができて、次回以降の買い物で利用できるポイントも貯まった
● 注文した商品が、スピーディーに自宅に届いた
このように、「満足のいく買い物ができて嬉しい」「すぐに欲しい商品が手に入って便利」など、特定のサイトやアプリなどの利用を通して得られる体験すべてを「UX」といいます。
UI(Webサイトやアプリを操作するための接点、仕組み)は、UX(利用体験の全体)に内包されるため、「UIはUXの一部」という関係性です。
UI(ユーザーインターフェース)が重視される理由
なぜ昨今、UIが重視されるようになったのでしょうか。その理由を解説します。
現代のデジタル社会では、多数のWebサイトやアプリが存在します。このような状況の中、ユーザーに自社のサービスを選択して継続利用してもらうためには、他社と差別化を図る必要があります。
そこで、ユーザーがサービスの利用目的をスムーズに達成できるよう、使いやすいUIが重要です。
「文字数が多くて読みにくい」
「ナビゲーションがわかりにくく、目的の情報にたどり着くまでにストレスを感じる」など、UIの使い勝手が良くない場合、ユーザーは目的を達成できず、離脱してしまう可能性があります。
一方、使い心地が良く、情報が整理されていてわかりやすいUIのWebサイトやアプリは、ストレスを感じることなく快適に利用できます。
優れたUIは、UXの向上、さらにはCX(カスタマーエクスペリエンス)の向上にもつながりやすくなります。CXとは、製品・サービスの利用前後も含めたすべての体験のことです。
CXを通してユーザーは「快適な利用体験を得られたから、また今後も利用しよう」「周りの人にもすすめたり、クチコミをしよう」などの意向を持ったロイヤルカスタマーへと成長します。
このような好循環を生み出すためには優れたUXが必要であり、UXを構成するUIの質の向上もまた不可欠だといえます。
UIを向上させるポイント
UIを向上させるには、ユーザーの目線でわかりやすいデザインを目指すことが重要です。
その「ユーザー視点」を検証するための取り組みが、デザインリサーチです。
ユーザーがWebサイトやアプリの利用に際して直面する課題や、どのような気持ちで接しているかを理解するには、検証や改善を重ねる必要があります。
また、ユーザーがUIの改善ポイントを直接教えてくれるわけではないので、データや調査から導き出す必要があるのです。
なおUIデザイン面の基礎知識については、以下の記事も参考にしてください。
デザインリサーチを実施する
まずは、調査(デザインリサーチ)を実施しましょう。
デザインリサーチとは、UI/UXに関わるリサーチ全般のことです。UIにおける特定機能の課題抽出・改善や、新規機能の創出に役立ちます。リサーチを通じてユーザーの志向を徹底的に追求することで、ニーズを正しく把握できるようになり、UIに反映できます。
デザインリサーチにはさまざまな手法があります。ここでは、ユーザビリティ調査とエキスパートレビューを紹介します。
電通マクロミルインサイトのデザインリサーチのサービス資料は、こちらからご覧ください。
ユーザビリティ調査
ユーザビリティ調査は、ユーザーにプロダクトを実際に操作してもらい、その様子を観察してユーザーが感じたことをヒアリングする手法です。
プロダクトの不具合を発見するだけでなく、コンテンツや機能が十分であるかなどの課題も見つけだします。
英語の「ユーザビリティ(usability)」という単語は、日本語で「使いやすさ」と訳されます。
一方、製品・サービスの国際規格であるISOでは、「ユーザビリティとは、あるプロダクトが一定の目的のために利用される際の有効性、効率、満足度の要素で評価される」という趣旨が述べられています。
つまり、単に「プロダクトが使いやすいかどうか」だけではなく、以下の点を評価することが大切です。
● 目的の作業を正確に達成できるか(有効性)
● 短時間で達成できるか(効率性)
● 快適に使えて、また使用してみたいと思えるか(満足度)
エキスパートレビュー
エキスパートレビューとは、ユーザビリティの専門家が、想定ユーザーに代わって対象サイト・アプリを操作し、体験しながら課題を抽出する方法のことです。
例えばWebサイトなどで、サイト内の情報構造(必要な情報にたどり着けるか)や、ナビゲーションにわかりにくい点がないかを評価します。
エキスパートレビューもユーザビリティテストと同様に、以下の3つの観点で評価を行います。
● 有効性
● 効率性
● 満足度
Webサイトやアプリのワイヤーフレームの段階でも情報構造の不具合を指摘でき、マイナー機能の評価まで広範に実施できる点がメリットです。
ユーザビリティ調査やエキスパートレビューで発見できるポイントは、「ボタンではない箇所が、ボタンに見えるデザインになっている」といった明らかな課題だけではありません。
「目的の操作画面に到達するルートが複数あって、最短で辿り着けない」など、ユーザー自身も気づいていないような暗黙的な課題までも抽出が可能です。
これらの調査を通して、デザインの要件・仕様の「あるべき姿(To-Be)」を特定できるようになります。
UIの改善策を検討する
調査によって課題を抽出した後は、次に改善点を検討します。リサーチを通じて明らかになった課題について掘り下げ、具体的な改善策を模索する段階です。
ユーザーの視点に立って「どのように改善すれば、より使いやすくなるだろうか」とアイデアを出しましょう。改善策を検討する際に、UIが優れている他社サービスを参考にする方法が有効です。高く評価されているサービスのUIを確認し、なぜ優れているかを分析します。
実行して検証する
改善案を立案したら、施策を実行して結果を検証しましょう。
そのうえでなお、UIに課題があれば再び原因を検証し、改善を繰り返していくことが大切です。
UIデザインを改善した事例
ここでは、電通マクロミルインサイトがUI改善に向けて取り組んだ2つの事例を紹介します。
子供の習慣化アプリ
子供の習慣化アプリ(生活や学習の習慣化を支援するアプリ)において、エキスパートレビューを実施して改善のプロトタイプを作成し、ユーザー調査を行った事例です。
このアプリの「あるべき姿(To-Be)」とは、アプリ利用を通じて子供の生活・学習習慣の定着を助けることです。
そのためのUI改善案として、調査を通じて以下の項目が導き出されました。
● 「生活習慣」「スポーツ」「学習」「学校」「習いごと」など、習慣化したいジャンル一覧への導線を新たにつくる
● 「習慣化したいこと」をユーザーが新規入力しやすいよう、テンプレートを導入
● 達成度合いを可視化できるダッシュボード機能の追加
妊婦さん向け情報提供アプリ
妊婦さん向け情報提供アプリ(妊娠・出産〜産後まで)において、ログ解析からの仮説立案、改善版のプロトタイプ化、ユーザー調査を行った事例を紹介します。
このアプリの「あるべき姿(To-Be)」は、赤ちゃんの様子と週数ごとのメッセージを基点に「頼れる情報媒体」としてのポジションを獲得することです。これを踏まえ、UI改善案として具体的に次のような項目が導き出されました。
● 「人気記事」など、レコメンドコンテンツへの導線を設置。たくさんの情報に触れて、不安を解消したいというユーザーニーズに応えられるようにする
UI(ユーザーインターフェース)の改善は電通マクロミルインサイトにお任せください
「サイトやアプリのユーザー数を増やしたい」「リピート利用されるサイト・アプリを目指したい」、といった課題を抱えている企業も少なくないはずです。
このような課題解決のプロセスでは、リサーチによってユーザー行動や心理を客観的に理解し、本質的な改善策を導き出すアプローチが有効です。
電通マクロミルインサイトでは、UI改善のためのサービスを提供しています。
● CX向上を実現するために、UI/UXの実装だけでなく、顧客・マーケットの理解からリリース後の改善まで、一気通貫でリサーチが可能
● デザインリサーチ、定量/定性調査、グローバルリサーチなど幅広い調査手法から最適なリサーチソリューションを提案
● 広告代理店「電通」とリサーチ企業「マクロミル」の強み・ノウハウを掛け合わせてサービスを提供
● 電通による数多くのマーケティングプロジェクトに参画した経験と、マクロミルが保有する豊富なデータとテクノロジーを活用できる
UI改善に向けた調査なら、電通マクロミルインサイトにご相談ください。
電通マクロミルインサイトのUXリサーチのサービス資料は、こちらからご覧ください。
数々の部門横断型プロジェクトを経験したのち、電通マクロミルインサイトにおいてUI/UXリサーチの新サービスを立ち上げ。
責任者として、様々な企業のUI/UX改善プロジェクトに参画。