> For the complete documentation index, see [llms.txt](https://docs.vwo.gaprise.jp/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.vwo.gaprise.jp/testing/ab-testing/0l76dnruuq.md).

# A/Bテストを作成する方法

A/Bテストは通常、Webページやアプリの2つ以上のバージョンをテストして比較し、どちらのバージョンのパフォーマンスが優れているかを調べる目的で作成するものです。A/Bテストでは、バリエーションのURLは同じです。

### A/Bテスト作成の基本ステップ

* **テスト用のページを設定する**\
  これは、VWOでA/Bテストを作成するための最初の、そして何よりも重要なステップです。このステップでは、A/Bテストの仮説の指定、ページURLの定義、[訪問者セグメント](https://help.vwo.com/hc/en-us/articles/360020433454)の設定を行います。テスト用のページの設定については、「[VWOでテスト対象のページを設定する](https://help.vwo.com/hc/en-us/articles/900001119746)」をご参照ください。<br>
* **ビジュアルエディターでバリエーションを作成する**\
  A/Bテストキャンペーン用のページの設定が終わったら、次はウェブサイトのバリエーションを作成します。VWOビジュアルエディターを使えば、既存のWebページに素早く変更を加え、テスト用のバリエーションを作成することができます。バリエーションの作成については、「[VWOのビジュアルエディターを使ってバリエーションを作成する](https://help.vwo.com/hc/en-us/articles/900001123923)」をご参照ください。<br>
* **コンバージョン目標を設定する**\
  バリエーションの準備ができたら、VWOで目標のコンバージョンを記録するイベントを定義します。訪問者が定義したイベントを実行すると、VWOは目標コンバージョンを記録します。例えば、訪問者がリンクをクリックしたとき、ページを訪問したとき、フォームを送信したときなど、それを目標のコンバージョンとして記録することができます。コンバージョン目標の追加については、「[VWOでコンバージョン目標を追加する](https://help.vwo.com/hc/en-us/articles/900001119826)」をご参照ください。<br>
* **テストの最終確認**\
  A/Bテストを作成する最後のステップでは、トラフィックの割合をバリエーションに割り当て、VWOのデータをGoogle Analyticsなどのサードパーティ製品と統合するなど、いくつかの高度なオプションを設定します。テスト設定の最終確認については、「[VWOでテスト設定の最終確認を行う](https://help.vwo.com/hc/en-us/articles/900001123963)」をご参照ください。

### **VWOでA/Bテストを作成する手順** <a href="#g2f8wilfb69f" id="g2f8wilfb69f"></a>

**前提条件**

テスト対象のWebページにVWO SmartCodeを追加する必要があります。WebサイトにVWO SmartCodeを追加する方法については、「[WebサイトにSmartCodeを追加する](https://gaprise-cxo.gitbook.io/vwosapto/vwo-ru-men-bian/vwonosmartcode/websaitonismartcodewosuru)」をご参照ください。

{% hint style="info" %}
WebページにSmartCodeが正しく追加されているかどうかを確認するには、VWOアカウントの\[設定] >> \[SmartCode]の\[SmartCodeチェッカー]に対象URLを入力します。\
結果の見方については、VWOの「[SmartCodeチェッカー](https://help.vwo.com/hc/en-us/articles/900000743746)」をご参照ください。
{% endhint %}

**手順**

1. お客様のVWOアカウントにログインします。
2. 左メニューより\[**テスト**] ＞\[**A/B**]を選択してください。
3. 新しいA/Bテストを作成するには、管理画面右上の\[**作成**]をクリックします。
4. デフォルトで表示される\[**キャンペーン名**]横にある編集アイコンをクリックし、テスト名を編集します。
5. \[**ページのURL**]フィールドに、テストするWebページURLを入力します。ページ条件詳細については「[VWOでのURLパターンの使用](/testing/ab-testing/ts05bflvgn.md)」をご確認ください。

<figure><img src="/files/4Ud3Gsl2i4YX6z6EtECj" alt=""><figcaption></figcaption></figure>

{% hint style="info" %}
あるパターンの条件に一致するWebページを除外したい場合は、\[**URLの除外**]オプションが便利です。\
例えば、[https://vwo.com](https://vwo.com/)サイト全体に対してテストを実施したいが、お問い合わせページ (<https://vwo.com/contact-us/>) はテストから除外したいとします。その場合、それぞれのフィールドに以下のようにURLを記述する必要があります。\
**テスト対象のURL**：<https://vwo.com\\*\\>
**除外するURL：**<https://vwo.com/contact-us/>
{% endhint %}

6. \[**デフォルトのURL**]は、プレビューを生成したり、ビジュアルエディターで編集するためのURLを指定します。テストするWebページURLを入力すると自動的に反映されますが、複数URLテスト対象にしている場合は、1つURLを選んで入力してください。
7. \[**仮説（任意）**]のプルダウンから、対象の仮説を選択します。このステップは必須ではありません。設定しておくことでチームメンバーへのテスト情報共有に役立ちます。

{% hint style="warning" %}
まだ仮説を設定していない場合や、新しい仮説を作成したい場合は、仮説プルダウンの下部にある\[**仮説を新規作成**]オプションをクリックします。仮説の詳細については、「[VWOにおける仮説](https://help.vwo.com/hc/en-us/articles/360019569694)」をご参照ください。
{% endhint %}

8. \[**その他のオプション**]を開くと、コード記述によるバリエーション作成／モバイルページでビジュアルエディター表示／テスト対象者を絞るセグメントやトリガーなどを設定することができます。

<figure><img src="/files/dRBkTrNNip9EyrK0dzsn" alt=""><figcaption></figcaption></figure>

9. \[**次へ**]をクリックします。\
   バリエーションページが表示され、新しいタブでビジュアルエディターが表示されます。このエディターでバリエーションに変更を追加し保存することができます。変更を行うには、ドラッグ＆ドロップの機能を使用するか、コードを書いて変更を行うことができます。VWOエディターについては、「[VWOビジュアルエディター](https://help.vwo.com/hc/en-us/articles/360021535813)」をご参照ください。
10. バリエーションの変更が完了したら、「**次へ**」をクリックします。\
    VWOビジュアルエディターが閉じ、**メトリクス（目標）**&#x30DA;ージが表示されます。
11. テストを評価するのに最も重要なゴール指標（例：注文完了、会員登録）はプライマリメトリクスに設定し、それ以外の中間指標（例：詳細ページ遷移、カート追加）はセカンダリーメトリクスに設定してください。

<figure><img src="/files/gkYu4cpmHohEQnqjpEz6" alt=""><figcaption></figcaption></figure>

12. メトリクス設定が完了したら、\[**次へ**]をクリックします。\
    すると、最終確認ページが表示されます。
13. キャンペーンの訪問者のトラフィック配分をカスタマイズするには、\[**トラフィックの割合**]セクションで調整します。
14. テストをVWOによってサポートされているサードパーティの製品と連携したい場合は、\[**サードパーティ製品との連携**]セクションで選択します。
15. テストの詳細オプションを設定するには、\[**詳細オプション**]セクションを展開し、必要なオプションを選択します。各オプションの機能については、VWOの「[VWOでテスト設定の最終確認を行う](https://help.vwo.com/hc/en-us/articles/900001123963)」をご参照ください。
16. テストにラベルを追加するには、\[**ラベルを追加する**]をクリックします。ラベルを使用してダッシュボード上のテストを絞り込み検索することができます。
17. テストの詳細設定が完了したら、\[**完了**]をクリックします。\
    テストの概要が表示され、\[**今すぐ実行**]、または\[**キャンペーンを確認し、後で実行する**]というオプションが表示されます。VWOでのテストのスケジューリング方法については、「[VWOでテストのスケジュールを設定する](https://help.vwo.com/hc/en-us/articles/360021107733)」をご参照ください。（※テストのスケジュール設定はPro以上のプランで利用可能です。）

**事後要件**

バリエーションに加えた変更が適切に反映され、Webサイトの訪問者にとって期待通りに動作することを確認するために、テストを開始する前にバリエーションのプレビューを行ってください。これは、A/Bテストキャンペーンの「プレビュー」タブで行うことができます。このタブに表示されるオプションは、テスト設定全体に目を通すことなく、バリエーションをすばやくチェックして検証するための便利な方法です。テストのプレビューについては、\[[テストの変更事項を確認する](https://help.vwo.com/hc/en-us/articles/360021310593)]をご参照ください。

また、目標が正常に機能しているかどうかを確認するには、\[[ライブ・プレビューを使用して目標の設定を確認する](https://help.vwo.com/hc/en-us/articles/360036220553)]を参照してください。

**例えば**、特定の地域のユーザーを対象としたテストを作成したとします。このような場合、プレビューオプションを使用すると、対象となる訪問者に対して表示されるのと同じ内容がテストページに表示されます。これにより、ユーザー体験を事前シミュレーションすることができ、対象となる訪問者に対してテストが正しく実施されることを確認することができます。

### 新インターフェースで作成する手順

{% hint style="warning" %}
（2023.11時点）管理画面右上のアイコンより、旧インターフェースと新インターフェースを切り替えることも可能です。
{% endhint %}

<div align="left"><figure><img src="/files/C60XEjiiou6Q4ebXZ2bS" alt="" width="266"><figcaption></figcaption></figure></div>

下記では、新インターフェースの画面に沿ってA/Bテスト作成の手順をご案内します。

#### A/Bテスト作成画面を開く

1. お客様のVWOアカウントにログインします。
2. \[**テスト**] > \[**A/B**]を選択し、管理画面右上の\[作成]をクリックします。
3. 作成画面ではデフォルトでテスト名が入力されています。横にある編集アイコンをクリックし、テスト名を編集してください。

<figure><img src="/files/jHtWQsf4FVB7onG16ClO" alt=""><figcaption></figcaption></figure>

#### テスト対象ページを指定する

1. 「Page」でテスト対象ページを指定してください。
2. ページ条件詳細については「[VWOでのURLパターンの使用](/testing/ab-testing/ts05bflvgn.md)」をご確認ください。

<figure><img src="/files/oHosC0mRNsLwV9CJ8Cj1" alt=""><figcaption></figcaption></figure>

#### バリエーションを作成する

1. 「Variation」を選択してください。
2. 「Editor URL」にバリエーション作成するURLを入力してください。複数URLテスト対象にしている場合は、編集用に1つURLを選んで入力してください。
3. 編集したいデバイスをプルダウンから選択してください
4. 「Add Variation」をクリックしてください

<figure><img src="/files/yG7KX9NJ1gIlGZMTCvIU" alt=""><figcaption></figcaption></figure>

{% hint style="info" %}
Variationを追加すると「Traffic split（トラフィック割合」が表示されます。デフォルトは均等配信が選択されています。（例：Control50%、Variation50%）

プルダウンから変更することも可能です。
{% endhint %}

<figure><img src="/files/bNDIJSKGwD1zDWFKwOjh" alt=""><figcaption></figcaption></figure>

5. 追加したVariationに表示される「編集」、もしくは「Open」をクリックしてビジュアルエディタを開きます。

<figure><img src="/files/TOwMVZGD0nUOzX6KIbJ5" alt=""><figcaption></figcaption></figure>

未保存の内容がある場合は、下記のようなポップアップが表示されますので、「save your unsaved changes」をクリックして進んでください。

<figure><img src="/files/j1zeyGhce0AVu9h3CZQ5" alt=""><figcaption></figcaption></figure>

6. ビジュアルエディタ上で変更したい要素をクリックするとメニューが開き編集できるようになります。

<figure><img src="/files/OklgoG5Eif4i1ldxAssJ" alt=""><figcaption></figcaption></figure>

#### メトリクス設定する

1. ​「Metrics」を選択してください
2. テストを評価するのに最も重要なゴール指標（例：注文完了、会員登録）はプライマリメトリクスに設定し、それ以外の中間指標（例：詳細ページ遷移、カート追加）はセカンダリーメトリクスに設定してください。

<figure><img src="/files/dH1VOg61lBrUOsPmKBPK" alt=""><figcaption></figcaption></figure>

#### テスト対象者を設定する

1. 「Audience and Traffic」を選択してください
2. 「Target Audience」では、テスト対象にしたいセグメントを設定してください。
3. 「Traffic Allocation」では、テストに参加する訪問者の割合を設定できます。デフォルトは100％で設定されています。\
   ※ControlとVariationの割合を編集するには、「[バリエーションを作成する](#barishonwosuru)」ステップをご確認ください。

<figure><img src="/files/hFtCfeM0tfaBmWEQBedi" alt=""><figcaption></figcaption></figure>

#### 連携

1. 「integration」を選択し、必要なツール連携を設定してください。

<figure><img src="/files/NL7sp89GnmuWmS8f7rKH" alt=""><figcaption></figcaption></figure>

#### 設定確認とプレビュー

1. 「Review」を選択してください
2. 「Configuration summary」では、テストの設定内容を確認できます。
3. 「ライブプレビュー」では、実際にプレビュー画面を開くことができます。

<figure><img src="/files/NjvYSvpeiaydETfQwZRE" alt=""><figcaption></figcaption></figure>

<figure><img src="/files/zdjZMHXKyrox24Z8QR1y" alt=""><figcaption></figcaption></figure>

内容に問題がなければ「Start Test」クリックでテスト開始することができます。

※テストのスケジュール設定は、「More configurations」より選択できます。（Pro以上のプランで利用可能です。）

<figure><img src="/files/WS5vijRHPyf0jGzd3haw" alt=""><figcaption></figcaption></figure>

※本ページは\[[原文:How to Create an A/B Test in VWO?](https://help.vwo.com/hc/en-us/articles/360021171954-How-to-Create-an-A-B-Test-in-VWO-)]を翻訳・加筆修正しています。