ユーザーエクスペリエンス（UX）成功事例6選！デザイン改善手順も解説
「ユーザーエクスペリエンスって何？Webサイト運営に関係ある？」
「ユーザーエクスペリエンスって本当に重要？」
「ユーザーエクスペリエンス改善と言われても…やり方がわからない」
ユーザーエクスペリエンスは、ユーザーとの関係を強化し、競合よりも特別に思ってもらえる存在になるための考え方です。もちろん、コンバージョンやSEOの最終目標である売上アップにもよい影響が期待できます。
そこで、この記事ではユーザーエクスペリエンスの基礎知識や実際の事例について解説します。
- ユーザーエクスペリエンスとは何か？なぜ重要なのか？
- ユーザーエクスペリエンスの改善で成功した事例
- ユーザーエクスペリエンス改善の具体的な方法
上記について、初心者の方でもわかりやすく解説します。この記事を読んで、ユーザーが競合に乗り換えないためのWebサイトづくりに取り組んでみませんか？
- 目次
ユーザーエクスペリエンスとは？
ユーザーエクスペリエンス（UX／User eXperience）とは
ユーザーが商品やサービスを利用したときに感じる心理的・感情的な経験のこと
ユーザーエクスペリエンスに影響する要素
ユーザーエクスペリエンスを左右する要素として、以下が挙げられます。
- 使いやすさ
ユーザーが迷うことなく、目的の情報にたどり着けるか
操作が簡単でわかりやすいか - 情報量・情報の質
ユーザーが必要とする情報が適切に提供されているか
情報が正確で信頼できるか - デザイン
見やすく、美しいか
ユーザーにとって心地よいデザインになっているか - コンテンツ
ユーザーにとって興味深く、価値のあるコンテンツであるか - パフォーマンス
Webサイトの読み込み速度はユーザーにストレスを与えていないか
動作が安定しているか - アクセシビリティ
視覚障害者や聴覚障害者など、すべての人が使いやすいデザインになっているか - 顧客対応
Web上でも対面での接客と同様の気づかいを感じられるか
つまり、ユーザーエクスペリエンスとは「ユーザーが商品やサービスを使ってどんな気持ちになるか」ということです。
【 ユーザーエクスペリエンスの具体的な事例 】ネットショップでの商品購入
- 商品ページ
見やすくわかりやすくレイアウトされ、探している商品を見つけやすい→購入意欲が高まる - 決済手続き
シンプルで、スムーズに完了できる→気持ちよく買い物ができる - 商品到着後
丁寧に梱包されていて質問対応やアフターフォロー窓口がしっかり案内されている→またそのお店で買い物がしたくなる
このように、ユーザーが商品やサービスを利用する日常的な経験こそがユーザーエクスペリエンスなのです。
なぜユーザーエクスペリエンスが重要なのか？
ユーザーの「よい買い物体験」は、お店にとってもたくさんのメリットをもたらします。
メリット
- 顧客満足度の向上
お客様が気持ちよく買い物できれば、満足度が高くなり、また利用しようという気持ちになります。 - 顧客ロイヤリティの向上
満足度の高いお客様は、リピーターやファンとなり、長く利用し続けてくれます。 - アクセス数・コンバージョン率の向上
使いやすいWebサイトは、お客様の滞在時間が長くなり、閲覧ページ数も増えるため、アクセス数やコンバージョン率の向上につながります。 - ブランドイメージの向上
ユーザーエクスペリエンスが良好なWebサイトは、お客様から好印象を与え、ブランドイメージの向上にもつながります。
確かに「目的の商品がどこにあるのかわからなかった」とか「お会計で自分のせいじゃないのに手間取った」経験があるお店は避けようと思うかも…
そういった“ささいなできごと”でもユーザーが離れてしまうことは珍しくないんです。「よい買い物体験」を提供することは、お店の売上向上や顧客との良好な関係構築につながります。
ユーザーエクスペリエンスとユーザーインターフェースの違い
ユーザーインターフェース（UI／User Interface）とは
ユーザーが商品やサービスとどのように接するか設計したデザインや操作のこと
【 ユーザーインターフェースの構成要素例 】
- ボタンやメニューの配置
- フォントや色
- 画像や動画
- 操作方法
ユーザーエクスペリエンスとユーザーインターフェースは、密接に関係しあっています。なぜならよいユーザーエクスペリエンスを実現するためには、よいユーザーインターフェースが不可欠だからです。
例えば、使いにくいWebサイトを訪れたユーザーはストレスを感じ、満足度の低い印象を持ちます。
一方、使いやすく、美しいデザインのWebサイトであれば、ユーザーは気持ちよく利用し、満足度の高い体験をすることができます。
つまり、高いレベルのユーザーエクスペリエンスを実現するためにユーザーインターフェースを改善していくことで、ユーザーにとってよりよい商品やサービスを提供できるのです。
Webのユーザーエクスペリエンス改善で成功した事例
Webサイトやオウンドメディアのユーザーエクスペリエンス改善ヒントになる成功事例として、以下6社の事例を紹介します。
CASE STUDY 1
Coke ON
Coke ONは、コカ・コーラ社が提供するWebサービス提供アプリです。
ユーザーエクスペリエンス改善施策
- スタンプ機能の導入
Coke ONでドリンクを購入するとスタンプが貯まり、景品と交換できる - 歩数計測機能の導入
設定した目標歩数に到達すればスタンプが貯まり、ユーザーの健康に貢献 - スマホ決済機能導入
主要なQRコード決済サービス・クレジットカード決済サービスで支払いができるほか、Coke ON限定の電子マネーでの支払いも可能に - サブスクサービスへの対応
同社商材のサブスクサービスをアプリから利用可能
結果
- ユーザーエンゲージメント向上
アプリ利用機会の創出増 - アプリダウンロード数の増加
お得で便利な機能の提案 - ユーザー満足度の向上
エンターテインメント性の高いインセンティブの提供
ユーザーにとって楽しみながら利用できる機能を導入することで、ユーザーエンゲージメントを高め、アプリの利用促進に成功した事例です。
CASE STUDY 2
LINE
LINEは、日本国内で圧倒的なシェアを誇る無料通話・無料メッセージアプリです。
ユーザーエクスペリエンス改善施策
- タイムライン機能の導入
誰が・いつ・何を発信したのか、明確な状態でユーザー同士の情報共有を可能に - スタンプ機能の充実
豊富な種類のスタンプで、気軽なノンバーバルコミュニケーション（言語を使わないコミュニケーション）がWeb上で成立 - グループ機能の強化
人数が無制限のグループを作成できる
結果
- ユーザー数の増加
大人数でのコミュニケーションが簡単で便利に - 利用頻度向上
大規模シェアを占める身近なメッセージアプリに成長 - ユーザー満足度の向上
エンターテインメント性の高いスタンプなど
ユーザー同士のコミュニケーションを促進する機能を充実させることで、ユーザー数を増やし、利用頻度を高めることに成功した事例です。
LINEも！？日常的に使っているけど知らなかった！
CASE STUDY 3
FABRIC TOKYO
FABRIC TOKYOは、オーダーメイドスーツのオンライン販売サービスです。
ユーザーエクスペリエンス改善施策
- 採寸不要のオーダーメイド
初回のみ店舗で15～30分程度サイズ計測後、スマホでオーダーメイド注文 - 豊富な生地とデザイン
自分好みのスーツ製作依頼がWeb上で完結
結果
- コンバージョン率の向上
「オーダーメイド＝敷居が高い」イメージの払しょく - 顧客満足度向上
オーダーメイド注文にかかる手間を最小限に - ブランドイメージの向上
オーダーメイドスーツの利用機会がなかったターゲット向けの市場を開拓
FABRIC TOKYOは従来のオーダーメイドスーツの課題を克服し、利便性の高いサービスを提供することで、ユーザーとの距離感を縮めました。
その結果、コンバージョン率を高め、顧客満足度を向上させることに成功した事例です。
CASE STUDY 4
クックパッド
クックパッドは、多くの人に認知・利用されている料理レシピ投稿Webサイトです。
ユーザーエクスペリエンス改善施策
- レシピ動画の充実
多くのレシピに動画を掲載 - 検索機能の強化
食材や料理名で簡単にレシピを発見、カテゴリ分けも可能 - ユーザー同士の交流機能
クックパッドの利用者同士が感想コメントできる機能
結果
- ユーザー数の増加
豊富で探しやすいレシピの掲載により料理レシピWebサイトとしてのブランド確立 - 利用頻度の向上
動画・画像によって、具体的なイメージが湧き作ってみたくなるレシピを掲載 - ユーザー同士のコミュニケーション促進
レビューやコメント機能により、レシピの感想やアレンジが共有され交流が生まれる
ユーザーにとって役立つ情報を豊富に提供しつつ、ユーザー同士の交流を促進することでユーザー数を増やし、利用頻度を高める仕組みづくりに成功した事例です。
CASE STUDY 5
千葉銀行
千葉銀行は、千葉県に本店を置く地方銀行です。
ユーザーエクスペリエンス改善施策
- スマホアプリのリニューアル
「面倒、不便」というイメージを払拭する直観的な操作性 - デザイン
「伝統的」「堅実」というイメージを刷新する、「かわいい」キャラクターや「シンプルで親しみやすい」デザイン - 的確な効果検証
ユーザーのWebサイト内カスタマージャーニーを明確にたどり、ユーザビリティ向上を徹底的に検証・改善
結果
- 顧客との接点創出
デジタルチャネル（アプリ）利用率の向上によるもの - 顧客満足度の向上
「使いにくい」イメージが先行していた金融系アプリを使いやすく - ユーザー数増
営業時間など制約の多い銀行サービスをアプリで提供
アプリというデジタルチャネルを強化することで顧客の利便性向上・ユーザーとの接点創出を実現し、ユーザー増につなげた事例です。
CASE STUDY 6
Netflix
Netflixは、世界最大級の動画配信サービスです。
ユーザーエクスペリエンス改善施策
- パーソナライズされたおすすめ機能
ユーザーの視聴履歴に基づいて、おすすめの作品を提案 - 高画質・高音質のオリジナルコンテンツ
競合にない良質なオリジナルコンテンツで快適な視聴体験を提供 - 多彩なデバイスに対応
パソコン・スマホなど、デバイスを問わず視聴可能に
結果
- ユーザー数の増加
“おもしろい”がある程度約束されているコンテンツが簡単に見つかる機能性 - 利用頻度の向上
デバイスにとらわれない利用機会の提供 - 顧客満足度の向上
Netflixでしか見られないコンテンツ提供
ユーザー一人ひとりに最適な視聴体験を提供することで、ユーザー数を増やし、利用頻度を高めることに成功した事例です。
ユーザーエクスペリエンス改善は、ユーザー満足度・アクセス数・コンバージョン率の向上、ブランドイメージ確立など、様々なメリットが期待できます。
ユーザーエクスペリエンス改善でよくある失敗事例
ユーザーエクスペリエンス改善時に起こりがちな失敗事例や原因を3つ紹介します。
CASE 1
ユーザー調査を怠る
ユーザーエクスペリエンス改善で最もよくある失敗は、ターゲットユーザーを理解していないことです。
ユーザーのニーズや行動を把握していないと、どんなに優れた機能やデザインを開発しても、ユーザーにとって使いにくいWebサイトやオウンドメディアになってしまいます。
具体的な失敗事例
- ユーザーアンケートを実施せずに、機能を追加する
- ユーザーインタビューを実施せずに、デザインを変更する
- 「結論ありき」ですすめてしまい、ユーザーからの意見や要望を無視して、開発を進める
対策
- アンケート調査、インタビュー調査、ユーザーテストなど、様々な方法でユーザー調査を実施する
- アンケートなどユーザーへの質問は、質問意図を明らかにして、誘導しないようにする
- ユーザーの行動データを分析する
- ユーザーからのフィードバックを積極的に収集する
ユーザー調査は、UX改善の基盤となる重要なものです。ユーザーインタビュー、アンケート、分析ツールなどを活用して、ユーザーのニーズや課題を丁寧に把握しましょう。
CASE 2
ターゲットユーザーを理解していない
ターゲットユーザーを理解していないと、そのユーザーにとって最適なユーザーエクスペリエンス改善施策を実施することができません。
具体的な失敗事例
- 高齢者向けのWebサイトで、文字が小さくて読みづらい
- スマホユーザー向けのWebサイトで、パソコンでの閲覧を前提にしたデザインになっている
- 専門知識がないユーザー向けのコンテンツで、専門用語が頻繁に使われている
対策
- ターゲットユーザーの属性、ニーズ、課題などを明確にする
- ペルソナを作成して、ターゲットユーザーを具体的にイメージする
- ターゲットユーザー目線で改善施策を検討する
- ユーザーエクスペリエンス改善を継続的な取り組みと捉える
- 定期的にユーザー調査を実施し、課題を把握する
- ユーザーからのフィードバックを積極的に収集し、改善に活かす
- 最新のトレンドや技術を常に取り入れる
まずはターゲットユーザーの年齢・性別・職業・興味関心などを明確に定義しましょう。ターゲットユーザーのペルソナを作成し、そのペルソナにとって最適なユーザーエクスペリエンスを考えてみましょう。
CASE 3
デザインが使いにくい
ユーザーエクスペリエンスを考える上でデザインは重要な要素ですが、使いやすさを忘れてはいけません。
見栄えばかりこだわって操作が複雑だったり、情報がわかりにくかったりしては、ユーザーにとって使いにくいWebサイトやオウンドメディアになってしまいます。デザインが使いにくいと、ユーザーはストレスを感じ、離脱してしまう可能性が懸念点です。
具体的な失敗事例
- 派手なデザインばかりで、情報が埋もれて探しにくい
- 最新のトレンドを取り入れすぎて、使い方がわかりにくい
- モバイル端末での閲覧に最適化されていない
対策
- シンプルでわかりやすいデザインを心がける
- ユーザーにとって見やすく、読みやすいフォントを使用する
- 色使いは控えめにし、統一感のあるデザインにする
- 操作方法をわかりやすく説明する
シンプルでわかりやすいデザイン、ユーザーにとって使いやすい操作性・視認性を意識しましょう。レスポンシブデザインを採用し、様々なデバイスで使いやすいようにしましょう。
ユーザーエクスペリエンス改善の具体的な方法
ユーザーエクスペリエンス改善の具体的なプロセスを4つのステップに分けて紹介します。
STEP 1
ユーザー調査
ユーザーエクスペリエンス改善の第1歩は、「誰のために」改善するのかを明確にすることです。そのためには、ユーザー調査が欠かせません。
ユーザーのニーズや課題を理解するために、アンケート・インタビュー・観察など様々な方法で情報収集を行いましょう。
具体的な方法
- アンケート調査
Webサイトやアプリ内にアンケートを設置したり、メールでアンケートを送信したりして、ユーザーから意見を収集 - インタビュー調査
ユーザーに直接話を聞いて、ニーズや課題を深く掘り下げる - ユーザーテスト
実際にユーザーに商品やサービスを使ってもらって、操作方法やデザインについて意見を収集
STEP 2
ペルソナの作成と課題の把握
ユーザー調査で得た情報をもとに、ペルソナを作成します。ペルソナとは、典型的なユーザー像を具体的に設定したものです。
例：ファッションアイテム通販のWebサイト
ターゲット設定：20代女性
ターゲットが抽象的で幅広すぎるために、このような失敗も…
- 「20代女性っていっても色んな人がいるから、とりあえず商品一覧でざっと閲覧できるようにしておくか…」
- 「20代女性だからWebサイトのデザインはかわいいほうがいいに決まってる！」
- 「ターゲット向けのおしゃれなレイアウトにするために、文章はできるだけ省略してスタイリッシュにしないと」
具体的にペルソナ設定をした場合
- ペルソナ1：20代女性「田中 花子」さん
- 年齢：28歳
- 職業：会社員
- 趣味：ショッピング、旅行、投資
- 悩み：時間がない、お金がない
- ニーズ：便利で使いやすいWebサイトやオウンドメディア
ターゲット像がある程度具体化されているため、改善案も以下のように具体的に！
- 「28歳会社員ってことは、“かわいい”よりも“シンプル”や“きれいめ”が好きそう」
- 「経済的にファッションにかけられるお金は制限がありそう…商品を価格帯で絞り込める検索機能があったほうがいいかも」
- 「投資もしているってことは金銭感覚に関しては堅実派ってことか。セール商品ページへの動線をわかりやすくしておこう」
ペルソナを作成することで、ユーザーのニーズや課題が具体的になりましたね！
改善施策も根拠にもとづいた提案になっていますよね。
ペルソナ作成のポイント
- 具体的な情報を盛り込む
年齢、性別、職業、趣味など、できるだけ具体的な情報を盛り込むことで、よりリアルなペルソナを作成することができます。 - ニーズと課題を明確にする
ペルソナが抱えているニーズと課題を明確にすることで、ユーザーエクスペリエンス改善施策の方向性が見えてきます。 - 複数のパネルを作成
ターゲットとなるユーザーが複数いる場合は、それぞれのパネルを作成する必要があります。
STEP 3
ワイヤーフレームの作成とデザイン検討
ペルソナのニーズと課題を踏まえて、ワイヤーフレームを作成します。
ワイヤーフレームとは、Webサイトやアプリの画面構成を簡易的に描いたものです。ワイヤーフレームを作成することで、Webサイトやアプリ全体の設計を明確にすることができます。
ワイヤーフレーム作成のポイント
- ユーザーの操作フローを意識する
- 見やすく、わかりやすいデザインにする
- ユーザーの意見を取り入れる
次に、作成したワイヤーフレームをもとに、デザインを検討していきましょう。デザインはユーザーにとって見やすく、わかりやすく、使いやすいものである必要があります。
デザインの具体的な注目点
- カラーパレット
Webサイトやアプリ全体の雰囲気を決めるカラーパレットを作成 - フォント
読みやすく、見やすいフォントを選択 - レイアウト
ユーザーが情報を見つけやすいように、レイアウトを検討
デザイン検討のポイント
- ペルソナのニーズや課題を意識する
- 最新のデザイントレンドを取り入れる
- ユーザーテストを実施して、デザインの改善点を見つける
STEP 4
A/Bテストと改善
デザインが決まったら、A/Bテストを実施します。
A/Bテストとは
2つの異なるデザインをユーザーにランダムに表示し、どちらのデザインのほうがいいのかを比較するテスト
A/Bテストの実施方法
A/Bテストはユーザーエクスペリエンス改善に欠かせない手法ですが、効果的な実施にはいくつかのポイントがあります。
- 目的を明確にする
A/Bテストを実施する前に、何を検証したいのか、どのような結果を期待しているのかを明確にすることが重要です。
例えば、コンバージョン率向上、ユーザーの滞在時間延長、離脱率減少などの目的が考えられます。 - 変数を設定
A/Bテストでは、比較したい2つのデザインを準備する必要があります。この2つのデザインは、1つの要素のみを変更するようにしましょう。
例えば、ボタンの色・フォント・レイアウトなどがよくある変更検討ポイントです。 - サンプル数を確保
A/Bテストの結果を統計的に有意義なものにするためには、十分なサンプル数を確保する必要があります。サンプル数は、検証したい目的や変数によって異なります。 - テスト期間を設定
A/Bテストは、一定期間実施する必要があります。テスト期間は、サンプル数が十分に確保できるまで継続する必要があります。 - ツールを使う
A/Bテストは、専用のツールを使うと簡単に実施することができます。A/Bテストツールには、Google OptimizeやVisual Website Optimizerなどがあります。 - 結果を分析
A/Bテストが終了したら、結果を分析してみましょう。 - 改善点を反映する
A/Bテストの結果に基づいて、改善点を反映する必要があります。改善点は、段階的に反映していくようにしましょう。
SEOとユーザーエクスペリエンスの関係
SEOとは、検索エンジンで上位に表示され多くの人にWebサイトを見てもらうための施策です。実は、SEOとユーザーエクスペリエンスは密接な関係にあります。
SEOとユーザーエクスペリエンスは密接な関係
ユーザーエクスペリエンスは、Webサイトを訪れたユーザーが快適に利用し、満足を得られるようにするための施策です。ユーザーにとって使いやすいWebサイトは、検索エンジンにとっても評価の高いWebサイトであることが多くあります。
例えば、「ユーザーにとって使いやすいWebサイト＝よいユーザーエクスペリエンスをもたらすWebサイト」は、滞在時間が長くなり閲覧ページ数が増える傾向があります。滞在時間が長く、閲覧ページ数が多いWebサイトは、検索エンジンから評価の高いWebサイトと判断されやすくなります。
結果的に、検索エンジンから上位に表示され、さらに多くの人のアクセスが期待できるのです。
一見、SEOとUXは別々の施策のように思えますが、実はどちらもWebサイトの成功には欠かせない要素と考えられます。
ユーザーエクスペリエンスを意識したSEO施策とは
ユーザーエクスペリエンスを意識したSEO施策とは、ユーザーにとって使いやすいWebサイトを作ることを意識したSEO施策です。
例えば、以下のような施策はSEOによい影響を与えると考えられるユーザーエクスペリエンス改善施策です。
- 使いやすいデザイン・レイアウトにする
- 読みやすい文章にする
- 必要な情報を見やすく配置する
- Webサイトの読み込み速度を速くする
- モバイル端末にも対応する
- ユーザーの声を反映する
など
これらの施策を実施することで、ユーザーにとって使いやすいWebサイトとなり、検索エンジンからも評価されるようになります。
逆に、使いにくい、デザインが見にくい、情報がわかりにくいなどの不満があれば、ユーザーエクスペリエンスが低下し、SEO上のネガティブな影響も懸念されます。
よくある質問
Webサイトのユーザーエクスペリエンス改善を目的としたA/Bテストの場合、どのように勝ち負けを判断すればいいですか？
A/Bテストで勝ち負けを判断するために、適切な統計指標を複数選定する必要があります。
Webサイトの場合、統計指標は以下の代表的なSEO指標が用いられることが多いです。
コンバージョン率 Webサイトの目標達成率 クリック率 特定の要素をクリックするユーザーの割合 滞在時間 ユーザーがWebサイトに滞在する時間 離脱率 Webサイトから離脱するユーザーの割合 売上 Webサイトを通じて発生した売上 顧客満足度 ユーザー満足度調査の結果 これらの指標の中から、A/Bテストで検証したい目的に合った指標を複数選定しましょう。
ユーザーエクスペリエンスって、Webサイトだけのことですか？
いいえ、Webサイト以外にも家電製品、スマートフォンアプリなど、ユーザーが触れるあらゆる商材に関係します。
例えば、使いやすい家電製品は、ボタンの位置や操作方法がわかりやすく、誰でも簡単に使えるものです。使いやすいスマートフォンアプリは、直感的な操作で目的の機能にたどり着けるようになっています。
ユーザーエクスペリエンスをより深く理解するために「ユーザー視点で考えてみる」練習をしてみましょう。
まとめ
ユーザーエクスペリエンスは、商材を利用するときにユーザーが抱く心理的な印象や感情をもとにした経験です。商材利用でよい感情を経験すると、ユーザーは再び商材を利用したくなります。
日本国内に限らず、Webサイトやアプリのユーザーエクスペリエンス改善でユーザー数増やコンバージョン機会の創出、ブランドイメージ確立ができた成功事例も多々あります。
Web上のユーザーエクスペリエンスを改善すればアクセス数増加・コンバージョン率向上も期待できるでしょう。
まずは、ターゲットが何を求めているのか調査し、ペルソナのニーズに基づいたデザインを設計、A/Bテストによる効果検証と改善を徹底してみてください。
