6つのABテストの実例とケーススタディ

ABテストは簡単なように思われます：2つの異なる製品バージョンを真っ向からぶつけ、どちらがユーザーにとってより効果的かを確認するのです。

しかし実際には、ABテストは複雑です。あなたのウェブサイトには、ボタン、入力、コピー、ナビゲーションツールなど、実にさまざまな要素があり、そのどれかがコンバージョン率低下の原因になっている可能性があります。このようなケースを解決するために、適切なツールとプロセスを活用する必要があります。

だからこそ、ABテストの事例を分析し、他社がどのような戦略やツールを使って実験を成功させたかを確認する必要があります。

この記事では、6つのABテストの例とケーススタディを見て、他のビジネスで何がうまく機能しているかを確認し、それらのテクニックを自分のビジネスで再現する方法を学びます。ユーザーエクスペリエンス(UX)とコンバージョン率を高めるウェブサイトの改善をテストする新しい方法を学ぶことができます。

見習うべき6つの優れたABテストのケーススタディ

プロダクトやウェブサイトのデザインは、見た目が重要であると同時に使いやすさも追求する必要もあります。 最適な結果を得るためには、ABテストの実施が不可欠です。これは、2つのバージョンを比較し、どちらがより良い成果を出すかを検証するためのテストプロセスです。

スプリットテストとしても知られるABテストは、一定の構造に沿って進行するプロセスです：

• 問題を見つける

• どのように問題を解決できるか、仮説を立てる

• 仮説に基づいて、新しいデザインや異なるコピーを作成する

• 新バージョンと旧バージョンの比較テスト

• 結果を分析する

しかし、この構造の中でも、使用するABテストツールの選択、収集するデータの種類、そしてそのデータの収集方法については多くの選択肢があります。ABテストを学び、改善していく最善の方法の一つは、成功したABテストの事例を参考にすることです。

1.バナーナック：ランディングページ

オンライン広告デザインツールを提供するBannersnack社は、ユーザーエクスペリエンスを向上させ、ランディングページでのコンバージョン（この場合はサインアップ）を増やしたいと考えていました。

Bannersnack社は、どこから手をつければいいのかわからず、Hotjarのクリックヒートマップを利用して、ユーザーがページとどのようにインタラクションしているかを調査しました。このツールを使って、同社は最もクリックされたエリアを視覚化し、ウェブサイトの訪問者が興味を示していない要素を見ることができました。

ABテストによって、Bannersnackは「より大きく、コントラストの強いCTAボタン」が大きな違いを生むことを発見しました。以下のクリックマップ（ビフォー・アフター）からも、その「違い」が明確にわかります。

このデータをもとに、Bannersnack社はユーザー体験を改善するための仮説を立て、元のデザインと並行してテストするための別バリアントを作成しました。

彼らは複数回のテストを実施し、そのたびにヒートマップを確認しながら目標に徐々に近づいていきました。最終的に、「より大きく、コントラストの強いCTAボタン」が必要であると結論づけ、サインアップ数が25%増加する結果を得ました。

プロのヒント： ランディングページを最適化する際は、動機・障害・ひきつけ要素 に分解して考えるのが効果的です。

• 動機は、リードがページに来た理由である。

• 障壁が離脱の理由

• ひきつけ要素がコンバージョンの理由

2. Turum-burum社が靴小売店Intertop社のチェックアウトフローを改善

デジタルUXデザイン会社Turum-burum社は、ウクライナを拠点とするeコマース靴店Intertopの顧客のコンバージョンを最適化させる取り組みを行いました。

UX分析フェーズにおいて、Turum-burum社はアンケート（特に、離脱意向調査ポップアップ）を活用して、Intertop社のチェックアウトページに関するユーザーのインサイトを収集しました。ユーザーがページを離れようとした際に表示されるポップアップで、以下の質問を提示しました： 「なぜご注文の手続きを中断しようとしているのですか？」 その結果、444人の回答者のうち48.6%が「チェックアウトフォームを完了できなかった」と回答しました。

Contentsquareのアンケートは、ユーザーがチェックアウトフローから離脱する理由を明らかにしました。

次のステップでは、仮説を立て、それらをA/Bテストで検証しました。Turum-burumは以下のような変更をテストしました：フォーム項目の数を削減、ページを複数のブロックに分割、時間短縮につながるオートフィル機能の追加、これらの施策により、ユーザーの離脱要因に基づいた改善を図りました。

ABテストは、Turum-burumのコンバージョン率最適化（CRO）モデルである「Evolutionary Site Redesign（ESR）」において重要な役割を果たしています。

ページを少し変更するたびに、同社はセッションリプレイツールとヒートマップを使って、ユーザーが変更をどのように体験しているかを確認しました。ヒートマップでは、ユーザーのクリックやスクロールの傾向が明らかになり、リプレイでは、チェックアウト中にユーザーが遭遇するフリクションであるレイジクリックなどが特定されました。

その結果 テストバリアントではコンバージョン率が54.68%増加。変更を正式にリリースした後、ユーザー1人あたりの平均収益（ARPU）は11.46%増加チェックアウトページの直帰率は13.35%減少しました。

「私たちは、開発ロードマップを通じて、マルチバリアント・テストプラットフォームを通じて、そして日々更新可能なコンテンツの変更を通じて最適化できます。そしてそれらすべてが、Contentsquareによって即座にトラッキング可能です」

— Hobbycraft社、Head of Digital Experience、Jennifer North氏,

3. Clarins社が商品コピーを最適化

お客様に「適切なタイミングで、適切なメッセージ」を届けることは、満足度を高めるだけでなく、「このブランドは自分のことを理解してくれている」と感じてもらうための大きなサインになります。小売業界では、「1枚の画像が千の言葉を語る」とよく言われますが、その画像に少し説明文を添えることで、お客様の理解と行動を後押しすることがあるのです。

Clarins（クラランス）が実施したABテストでは、商品詳細ページ（PDP）上の画像に説明文を追加することで、エンゲージメントが向上しました。 その結果、バスケットページの閲覧数が2.41%増加し、購入数も0.37%増加というポジティブな波及効果が確認されました。

Clarins（クラランス）は、商品詳細ページ（PDP）上の画像に説明文を追加するテストを実施しました。

プロのアドバイス：ABテストでネガティブな結果が出ることを恐れないでください。

eコマースコンバージョン率最適化エージェンシーAWA digital社のCEO、Johann Van Tonder氏は次のように述べています： 「強いネガティブな結果が出たテストは、コンバージョンの“レバー”を発見したことを意味します。ただし、それを“逆方向に引いた”だけ。今度は正しい方向に引くだけです」

Johann氏によれば、ネガティブな結果のほうがむしろ興奮することもあるそうです。なぜなら、それこそがABテストの価値を証明するからです。

「ある有名なレンタカー企業のチェックアウトフローを再設計しテストしたところ、テストなしでそのままリリースしていれば、年間700万ポンドの損失につながるところでした」

とはいえ、ネガティブな結果が避けられないこともありますが、よくあるABテストの失敗パターンを知っておくことで、より良い成果を得ることができます。このガイドの「ABテストでありがちなミス」章も、ぜひご覧ください。

4. The Good社：モバイル・ホームページ

eコマースCRO（コンバージョン率最適化）の専門家である The Good は、アウトドア・旅行・キャンプ用品を扱う小売ブランドSwiss Gear社のモバイルにおけるコンバージョン率向上に取り組みました。

まず、現状の課題やボトルネックを明らかにするために、The Good社は Googleアナリティクス を使用し、訪問者が「どこで」「いつ」「なぜ」サイトから離脱しているのかを定量的に分析しました。

この定量的データを出発点として、同社はヒートマップを活用してユーザーのクリックやスクロールのパターンを可視化し、セッションリプレイによってユーザー行動の「なぜ」を深掘りすることで、仮説立案のための定性的なインサイトを得ました。

The Good社は立てた仮説に基づいてABテストを実施し、各テスト後にもヒートマップやセッションリプレイを再度確認することで、ユーザー行動への影響を継続的に検証していきました。

The Good社は、ユーザーがコンテンツフィルターとどのように接触しているかを把握するために Hotjarのヒートマップを活用し、このデータに基づいて Swiss Gear社のモバイルメニューをよりユーザーフレンドリーに再設計しました。

分析の結果、Swiss Gear社のモバイルサイトにおける アイコンの意味や言葉遣いがユーザーにとってわかりにくい ことが明らかになりました。これを受けて、チームは シンプルで視覚的にわかりやすいメニュー型ユーザーインターフェース（UI） をモバイルホームページに設計しました。

この新しいUIは、人気のフィルターを前面に出すことで閲覧体験をスムーズにし、大きな成果を生み出しました。結果として、Swiss Gear社のモバイルでの直帰率は8%減少し、サイト滞在時間は84%増加しました。

💡プロのアドバイス：モバイルサイトの最適化には、ユーザーインタビューがさらに深いインサイトを提供してくれます。

Contentsquareを使えば、実際のユーザーにインタビューを実施し、モバイル上でのサイト体験について詳しく知ることができます。また、AndroidやiPhoneなど、使用している端末別にインタビューをフィルタリングして、ユーザビリティの傾向を把握することも可能です。

Contentsquareの20万人以上の認証済みユーザーから参加者を抽出し、適切な対象者と確実に話せるよう自動スクリーニングが可能です。

5. Re:member社の申込書を変更し申し込みが増加

スカンジナビアのクレジットカード会社re:member社は、自社のコンバージョンファネルに何か問題があると感じていました。Googleアナリティクスのデータによると、多くの質の高いリードがアフィリエイトサイトから流入していたにもかかわらず、すぐに離脱してしまい、クレジットカードの申込まで至っていませんでした。

同社のマーケティングスペシャリストのSteffen Quistgaard氏は、アフィリエイトサイト経由のセッションに絞って、セッションリプレイやクリックマップを分析しました。すると、ユーザーがページを上下にスクロールしたり、ホームページに戻ったり、特典セクションの上でマウスをホバーさせてクリックしようとしたりしている様子が見られました。

これらの行動傾向から、Quistgaard氏は「リードは迷っており、フォーム上により説得力のある情報が必要だ」と仮説を立てました。

Re:member社は、クレジットカード申込フォームを再設計し、ユーザーの視認性を高めるために右側に視覚的に整理された構成を導入しました。3つの明確なコンテンツセクション、箇条書きの代わりにチェックマーク、リワードプログラムのセクションにはアイコンを追加しました。

Re:memberのチームは、クレジットカードの特長やメリットにユーザーの注意が向くよう、視覚的およびウェブデザイン上の階層構造を活用してフォームを設計し直しました。その後、スプリットテストを実施しました。

その結果、アフィリエイトサイトから訪れたユーザーのフォームコンバージョン率が43%増加、全体でも17%増加しました。

💡プロのアドバイス：Contentsquareを活用すれば、セッションリプレイの検索にかかる時間を削減し、分析により多くの時間を割けます。

あなたのサイトのトラフィック量が多い場合、トラフィック量が多いウェブサイトでは、短時間で大量のセッションリプレイが蓄積されることがあります。そのため、効率的にリプレイを絞り込んで分析することが不可欠です。

Contentsquareのセッションリプレイツールは、セッションのセグメンテーション、イベントトラッキング、エラーフラグ、フラストレーションシグナル、修正が必要な通知機能を備えています。

• 各リプレイには主要イベントの要約モジュールがあり、関連部分にすぐにジャンプして確認できます。

• エラーの急増が発生すると、セッションリプレイがアラートを出し、そのエラーが発生したユーザーセッションにリンクされるため、リアルタイムでエラーの様子を視聴し、対応策を特定できます。

• 数クリックで、同様のバグに遭遇している他のユーザー数を把握し、優先順位を決定して、迅速に修正対応が可能です。

• Contentsquareのアラート機能と連動させることで、今後発生するエラーに自動的にフラグが立てられ、すぐに対処できるようになります。

Contentsquareのセッションリプレイは、レイジクリックなどの望ましくない行動を即座に検出するのに役立ちます。

6. Every.org社が寄付の流れを改善

寄付プラットフォームEvery.org社のシニアプロダクトデザイナーであるDave Sharp氏は、セッションリプレイを確認している際に、ある興味深い現象に気づきました。それは、寄付フォーム上で発生していた「レイジクリック」（短時間に繰り返されるクリック）の急増です。

複数のセッションを視聴した後、Dave氏は、「フォーム上に配置された2つのCTAが、訪問者を混乱させ、フラストレーションを引き起こしているのではないか」と仮説を立てました。

Every.org社の元の寄付フォームでは、2つのCTAボタンが設置されており、訪問者を混乱させ、離脱率の増加につながっていました。

そこで、Every.org社は新しいバージョンの寄付フローを作成し、各ページにCTAを1つだけ配置した2ページ構成に変更。その後、元のバージョンとABテストを実施しました。

ABテストが終了するまでに、コンバージョンはなんと26.5％も増加した。

💡プロのヒント：セッションリプレイを他のツールと組み合わせることで、A/Bテストをさらに最適化するための深いインサイトを得られます。

Contentsquareのセッションリプレイツールでは、匿名のユーザーセッションを記録できるため、ABテスト中にユーザーがどこでつまずき、何をクリックし、どのような経路でコンバージョンに至ったのかをすべて把握できます。

さらに、当社のオールインワン エクスペリエンスインテリジェンスプラットフォームであるContentsquareを使用することで、全体のパフォーマンスを可視化し、ユーザー行動の背景を理解することが可能です。以下のようなツールと組み合わせることで、最適化をさらに加速できます：

• カスタマージャーニー分析：ユーザーがサイトをどのように移動するかを追跡し、主要な行動パターンや離脱ポイントを特定

• ヒートマップ：クリック・スクロール・マウスの動きを可視化し、各要素へのユーザーの関心を明らかに

• インパクト定量化：サイト上のエラーとKPIとの関係を分析し、優先すべき改善ポイントを特定

• フォーム分析：ユーザーがどこでつまずいているかを把握し、フォームの最適化とコンバージョン向上を実現

• Voice of Customer（顧客の声、VoC）：アンケートやコメントによる直接的なフィードバックを通じてユーザー体験を理解

• Product Analytics（PA）：プロダクト機能の利用状況を分析し、リテンション改善に活用

Contentsquareのセッションリプレイは、ユーザーの体験を直接聞くことで、ユーザーを喜ばせることができます。

ユーザーの期待を上回る体験をつくる

ウェブサイトを改善する際、直感だけに頼るのでは不十分です。訪問者にとって心地よく、そして成果につながるサイトを作るためには、実際の証拠とユーザーインサイトの収集が不可欠です。

ABテストの事例を参考にすることで、課題の特定 → 仮説の立案 → サイトのバリアントをテストという明確なロードマップを得ることができます。 こうして改善を重ねていけば、ターゲットユーザーのニーズにぴったり合ったサイトが完成し、リピーターもどんどん増えていくでしょう。

ABテストの例に関するFAQ