基本ノウハウ
UI/UX改善はユーザーと良好な関係性を維持する上で不可欠の要素であり、重要視する企業が増えています。しかし「実際にどのような策を講じれば良いのか」「UIの変更でUXも向上するのか」といった疑問を持つ方も多いでしょう。
本記事ではUI/UXの改善方法について、Webサイトや製品・サービスを例に挙げて解説します。成功させるポイントや、役立つ思考法もあわせて紹介しています。ぜひ参考にしてみてください。
まずUI/UXの意味について下表を確認しておきましょう。
分類 | 概要 | 例 |
---|---|---|
UI(User Interface) | ユーザーと製品・サービスの接点全般 |
・文字 ・ボタン ・ページの表示速度 など |
UX(User Experience) | 製品やサービスを利用することでユーザーが得られる体験 顧客体験・ユーザー体験とも呼ばれる |
・使いやすい ・役に立つ ・信頼できる など |
例えばユーザーが特定の検索エンジンにアクセスして調べ物をしたとき、「検索画面・検索結果画面」「知りたい情報が掲載されているページ」の表示すべてがUIであり、「知りたい情報を簡単に検索できた」「知りたい情報について詳しく知ることができ面白いと感じた」といった体験すべてがUXです。
ユーザーの体験をより良くするためにUIは重要な役割を果たし、UIとUXは密接に関係しているため、UI/UXとまとめて表記されるケースが多くなっています。それぞれの基礎知識を振り返りたい方は、下記の記事もあわせてチェックしてみてください。
関連記事: 「全企業が向き合うべきUXとは?意味やUIとの違いを分かりやすく解説」
UI/UX改善は、自社が競合他社に後れを取らないよう、製品・サービスの魅力を高めていくために重要な作業です。
自社製品・サービスがユーザーに選ばれるためには、他企業にはない独自の「価値」をアピールできなくてはなりません。しかし、現代の市場はコモディティ化が進み、差別化が難しくなっています。
技術革新や市場の活発化などにより、類似の製品・サービスが増え、競合他社との差別化が難しくなっている状況
関連記事:「コモディティ化とは?要因や対策まで徹底解説【企業事例3選】」
似た製品・サービスが飽和するなか、企業はいかにユーザーに魅力的な体験を提供できるかによって差別化を図る必要に迫られているのです。UI/UX改善により、ユーザーに今まで以上に快適な体験(価値)を提供できれば、自社を選択してもらうきっかけになります。
「UI/UX」と並列して記載されるケースが多い2つですが、実は「UIの改善=UXの向上」とは限りません。UI改善は、UX向上における手段の1つに過ぎないからです。
例えばオウンドメディアのUIを改善して情報を検索しやすくなったとしても、肝心のコンテンツの質が低い状態であったら、調べ物を目的に訪れたユーザーにとっては「必要な情報が手に入らない」ため大きなUX向上につながらないかもしれません。反対に、検索性が低く利用しづらいオウンドメディアであっても、ユーザーにとって必要な情報が網羅されているのであれば、「必要な情報を手に入れる」ことが目的のユーザーにとっては良質なUXといえるかもしれません。
UXの向上を図るためには、UIを改善するだけではなく、対象としているユーザーが求める体験とは何かを理解した上で、その体験を実現するための施策も進める必要があります。
UI/UX改善を成功させるポイントは、主に以下の4つです。
UI/UXの改善箇所や具体策を検討する際は、ユーザー理解を深めることが重要です。効果的な改善策を実行するには、ユーザーを具体的にイメージしたのち「ユーザーにとって最も価値がある体験は何か」を考える必要があるためです。
具体的なユーザー像は、ペルソナを作成する過程で見えてきます。実際にユーザーへインタビューした内容をペルソナに落とし込むと、より解像度が上がるでしょう。具体的な作成方法は、以下の記事を参考にしてみてください。
関連記事:「ペルソナの作り方とは?徹底解説【無料設定シートダウンロード】」
なおユーザーインタビューでは、単にUI/UXに関する意見を聞くだけでなく、実際の行動履歴などの事実情報も明らかにしましょう。例えばユーザーが「使いにくいと感じた」と話した場合、その感情が引き起こされたタイミングや要因を深掘りすると、改善ポイントがより明確になります。
実際に使う・体験する側のユーザーを理解した上で、UI/UX改善の具体策を検討していきましょう。
以下に挙げる4つの原則に沿ってUIを整えると、見やすい・使いやすいといったUXの向上につながります。各原則のポイントは、下表の通りです。
デザインの4原則 | ポイント |
---|---|
近接 |
・関連する要素は近づけ、グループ化する ・関連性が薄い要素は間隔を広げ、まとまりを認識しやすくする ・ボタンやチェックボックスなど行動を促す要素は、関連する情報と近づける |
整列 |
・画像やテキストといった各要素の端を左、中央、右のいずれかにそろえる ・透明な線で各要素の端がつながるように配置する |
対比 |
・サイズや色、形などで各要素に視覚的な差をつける ・重要度の高い情報が最も目に留まりやすいように、各要素のバランスを調整する |
反復 |
・色やサイズ、レイアウトなど特徴的な要素はパターン化して統一感を出す ・デザインが単調になりすぎないよう、適度に用いる |
例えば入力フォームであれば、近接の原則でラベルと入力箇所を近づけることで関係性が分かりやすくなります。またWebサイトのナビゲーションやタイトルを反復の原則に沿って表示すると、ページ構造の理解が深まり、より効率的に操作・回遊できます。
UIを改善する際、何から始めれば良いか分からないという場合は、デザインの原則に沿っているかをチェックすると良いでしょう。
UXを向上させる手法について考える際に、UXハニカムと呼ばれる構造モデルが役立ちます。UXの向上には下記6つの要素が関係しており、6つを満たすことで「価値がある(Valuable)」、つまり価値ある体験を実現できるという考え方をハニカム構造(正六角形を隙間なく並べた構造)で示したモデルです。
「役に立つ(Useful)」「使いやすい(Usable)」「好ましい(Desirable)」の上部3つは以前から重視されてきましたが、Webの発達によって「探しやすい・見つけやすい(Findable)」「信頼できる(Credible)」「アクセスしやすい(Accessible)」の下部3つの重要性が増しています。
「良いユーザー体験とは何か」と迷いが生じた場合はUXハニカムの考え方に立ち返り、課題の洗い出しや改善策の検討に役立てましょう。
UXの設計・改善について考える上では、UXタイムスパンを意識することも大切です。UXタイムスパンとは、製品・サービスにまつわるユーザーの体験を「利用前」「利用中」「利用後」「利用前~利用後」の4つの期間でとらえる考え方です。製品・サービスを実際に利用している「利用中」以外にも、その前後の想像や記憶、繰り返しの利用による累積も合わせてUXと考えます。
各体験のタイミングについて、UX向上のための最適なアプローチ方法を考えることで、UI/UXの改善に役立つでしょう。
UXタイムスパンの種類 | 体験のタイミング | 体験の内容 |
---|---|---|
予期的UX | 利用前 | これから起きる体験を想像する |
一時的UX | 利用中 | 実際に体験する |
エピソード的UX | 利用後 | 体験を内省する |
累積的UX | 利用前~利用後 | これまでの体験を回想する |
具体的なシーンの例として、以下の2つを解説します。
製品・サービスのUI/UXを改善するために、実際に製品・サービスを自分たちで利用して課題を洗い出します。特にUIに由来する「使いづらさ」「見づらさ」などは、自分たちの調査だけでもある程度発見できます。顧客へインタビューあるいはアンケートなどを実施し、自分たちの仮説が正しいかを検証しながら課題を感じた部分を具体化しましょう。
一方でUXの課題は、自分たちだけでは発見しづらい場合があります。まずサービスブループリントの作成・共有などを実施してみましょう。サービスブループリントは、製品・サービスがユーザーに提供されるプロセスと各部門・業務の関係性を可視化するフレームワークです。サービスブループリントによって各業務がUXに影響を及ぼす点を整理でき、UXの改善ポイントを考える上で役立ちます。またユーザーが行動を起こしたタイミングや感情とともに、対応する部門や状況なども整理しておくと、将来起きる可能性がある不安や不満の早期発見につながります。
WebサイトのUI/UXを改善させるアイデアの例は、下表の通りです。
改善アイデア | 期待できるUX |
---|---|
EFO(※1)を施す | 使いやすい |
コンテンツの量と質を上げる | 役に立つ |
接客面の教育に力を入れる(問い合わせ対応など) | 好ましい |
ページの表示速度を上げる | アクセスしやすい |
運営者情報を明記する | 信頼できる |
グローバルナビゲーションを設置する | 探しやすい |
※1エントリーフォーム最適化:入力フォームの使い勝手を改善する手法
関連記事:「EFOとは?BtoB企業での必要性や対策の例を解説|役立つツールも」
コンテンツ制作や従業員の教育などは、一朝一夕では効果が出ません。ユーザーインタビューなどから得た意見や抽出された課題に応じて、中長期的な視点を持ちながら試行錯誤しましょう。
最後にUI/UXの改善に役立つ思考法を、3つ紹介します。
人間中心設計とは、ユーザーニーズの実現を主眼に置いた思考法です。具体的なプロセスは、下表の4つです。
◆ | 目的 | 具体的な手法の例 |
---|---|---|
調査 | ユーザーの利用状況やニーズを把握する |
ユーザーインタビュー 分析 調査結果を整理し、ユーザーニーズを明確化する ・ペルソナ ・カスタマージャーニーマップ |
設計 | 実際の製品・サービスを形づくる |
・プロトタイプ ・ワイヤーフレーム ・スタイルガイド |
評価 | ユーザーニーズを満たせるか、検証する |
・ユーザビリティテスト ・アクセシビリティテスト |
評価の時点でユーザーニーズを満たせていなかった場合は、改めて課題はどこにあるかを考えながら再度調査へとプロセスを繰り返します。評価の理由や背景を深掘りし、より良いプロダクト開発に生かしましょう。
なおユーザーインタビューのやり方は、以下の記事で解説しています。基本的な流れや成功させるコツを知りたい方は、あわせてチェックしてみてください。
関連記事:「【3ステップ】ユーザーインタビューのやり方|目的や種類から成功させるコツまで解説」
デザイン思考とはデザインを検討する際にたどるプロセスを、ビジネスシーンなどにも活用して課題解決を図る思考法です。具体的な流れは、以下のようになっています。
ステップ | 説明 |
---|---|
1. 共感(Empathize) | ユーザーインタビューなどの調査・分析を通じてユーザーのニーズをつかむ |
2. 定義(Define) | ユーザーニーズを定義し、実現するために障壁となる課題の仮説を立てる |
3. 概念化(Ideate) | ブレインストーミングなどを実施しながら課題の解決策を考案する |
4. 試作(Prototype) | 「概念化」で決めたアイデアに基づきプロダクトを試作する |
5. テスト(Test) | ユーザーテストを実施し評価・検証、ブラッシュアップする |
PDCAサイクルと同様にはじめから完璧を目指すのではなく、プロセスを繰り返すなかで新しいアイデアを生み出し、少しずつ改善させることが大切になります。
PDCAの進め方やポイントについて詳しく知りたい方は、こちらの記事もぜひ参考にしてみてください。
関連記事:「PDCAの意味とは? メリットから実践のステップまで解説」
リーンUXとはデザイン思考とアジャイル開発の原則、リーンスタートアップの考え方を取り入れた思考法です。うまく利用できれば優れたUXを短期間に無駄なく構築でき、チームの生産性向上にも寄与します。
そもそもアジャイル開発の原則とは、以下の4つを重視する考え方になります。
重視すること | プロダクト開発の現場の例 |
---|---|
直接的な対話(>プロセスやツール) | チームメンバー内で顔を合わせ、積極的に議論する |
動くソフトウェア(>ドキュメント) | プロトタイプで実際に操作しながら素早く課題を見つける |
顧客との協調(>契約交渉) | 顧客とWin-Winの関係を築く |
変化への対応(>計画の遵守) | ユーザーの反応などを踏まえて、柔軟に設計を変更する |
またリーンスタートアップとは、構築・計測・学習を迅速に行いながら開発を進める手法です。実用最小限の製品(MVP)を短時間で開発し、リリース後にユーザーに満足してもらえる製品であったかどうか結果を評価し、フィードバックすることを繰り返します。最初から時間とお金を投入して完璧な製品を目指すよりも無駄のない開発が可能になります。
リーンUXでは、定期的なフィードバックの機会があり、ユーザー視点の情報を頻繁に収集できます。ユーザーニーズをプロダクトに落とし込んで仮説検証を繰り返すため、効率的にUI/UX改善を進められるのです。ただしMVPは最初から作り込みすぎず、かつユーザーがある程度評価できる状態にする必要があります。
UI/UX改善は、よりポジティブな価値をユーザーへ提供し、事業の売上を上げるために行います。UIはUXの一部分を担うため、ユーザー体験の向上を目指すなら最低限意識しておきたいポイントです。
UI/UX改善を成功させるコツは複数ありますが、特にユーザー理解を深める工程は課題の抽出や効果的な施策の立案に必須です。また「良いユーザー体験とは何か」とチーム内で認識がぶれないようなすり合わせも重要です。ユーザーと良好な関係を維持し売上を拡大させるためにも、自社プロダクトのUI/UX改善を実践しましょう。