ノーコードツールBubbleには慣れてきたでしょうか。本日はSegment(セグメント)とGoogle Optimize(オプティマイズ)についてご紹介します。
この類の話に詳しい方も、そうでない方もじっくり読んでいただけたら幸いです。
Segment(セグメント)
Segmentとは?
Segmentは、Webプロパティから生成されるデータを管理するためのサードパーティツールです。一言で言えば、データの「ソース(例：Bubbleアプリ)」とデータが流れる「デスティネーション」を接続することができます。
デスティネーションには、Google Analyticsのような分析ツール、Mailchimpのようなマーケティングツール、Snowflakeのようなデータウェアハウスなどがあります。
Bubbleでは、Segment を使用しています。これにより、製品に必要なすべてのイベントロギングを一度に実装でき、そのデータストリームを他のすべてのツールに転送できるからです。
Segmentプラグインをインストールする
Segmentプラグインは、他のプラグインと同じように、マーケットプレイスにあるBubbleエディタのPluginsタブで見つけることができます。(ここでは、bubble-madeのSegmentプラグインについて説明します)。
インストールすると、このようにプラグインの設定が表示されるはずです。
「書き込みキー」は、セグメントUIで確認できます。「ソース」タブ→「設定」→「APIキー」で確認できます。
これは、アプリとSegmentアカウントを接続するために必要な最低限のものです。
Google Analyticsと使用する
Google Analyticsは、アプリへのトラフィックを測定したり、イベントをログに記録したりするための人気のあるツールです。その代わりに、SegmentアカウントのデスティネーションとしてGAを接続する必要があります。
Segment -> Google Analyticsの接続を完了させるには、Destinationタブ&Settings(Google Analyticsの場合)で、必ず設定してください。
Segmentプラグインに関する詳細
write key
このキーは、アプリからSegmentにデータを送信するために使用されます。この情報は、Segment UIの「Sources」→「Settings」→「API Keys」で確認できます。
Segmentでイベントを追いかける
Segmentは、一度に複数のアナリティクスサービスと接続します。このアクションはイベントを追跡し、MixpanelやHippなどに送ることができます。
Mixpanelでアカウントを作成し、プラグインタブでキーを入力する必要があります。このアクションはクライアント側でイベントを追跡します。
Event name: 送信するイベント名を選択します。既存のものを選択するか、新規に作成してください。
Additional Values: 年齢や性別など、より多くのデータをSegmentに送信するためのキー/値を定義します。
Segmentでイベントを追いかける(サーバー)
このアクションはイベントを追跡し、クライアントの代わりに bubble サーバーから Segment に送信します。この方法は、広告ブロッカーがイベントを中断させないようにするため、より信頼性の高いイベントを追跡する場合に使用します。
このアクションは容量を使用するので、重要なイベントのみに使用してください。このオプションは、ページ、ユーザーエージェント、ロケール、IPアドレス、ユーザーの電子メールなどのクライアントデータを自動的にパッケージ化します。
Event name:送信するイベント名を選択します。既存のものを選択するか、新規に作成してください。
Additional Values: 年齢や性別など、より多くのデータをSegmentに送信するためのキー/値を定義します。
ページビューをSegmentに送信する
これはページビューをSegmentに登録して、例えばGoogle Analyticsに送信します。
Page Category: ページのカテゴリを定義します。既存のものを選択するか、新しいものを作成します。
Additional Values: 年齢や性別など、より多くのデータをSegmentに送信するためのキー/値を定義します。
Segmentでユーザーを特定する
このアクションを呼び出すことで、すべてのイベントがSegment内の関連するユーザおよびSegmentが接続する他のサービスにアタッチされていることを確認します。
以上ここまでがSegmentに関する説明した。ここからはGoogle Optimizeに関する説明です。後半も張り切っていこう!
Google Optimize(A/B Testing)とは?
bubbleはGoogle Optimizeとのプラグインを構築しており、アプリ作成者としてbubbleアプリでA/Bテスト(ランダム化されたスプリットテスト)を実行できるようにしています。
A/Bテストは、ユーザーに達成してもらいたい明確なアクションがあり、そのアクションを達成してもらうために、アプリの中で2つの少し異なる体験を決めている場合に最適です。例えば、以下のような場合です。
・ランディングページには2つの異なるバージョンがあり、どちらのバージョンがユーザーのサインアップ率を高めるかを確認したいとき。
・あなたのホームページには3つの異なるコピーセットがあり、どれがより多くのユーザーに特定のボタンをクリックさせるかを確認したいとき。
・ユーザーがログインした後にポップアップを表示することで、ユーザーが何かを購入する可能性が高まるかどうかを確認したいとき。
何が必要なのか
・Googleアナリティクスのアカウントを登録する
・Google Optimizeアカウントにサインアップする – Optimizeは、Google Analyticsと同じ製品のスイートの一部であり、寛大な無料層を持っています。
・アプリを(1) Google Analytics、または(2) Segmentのいずれかに接続し、Google Analyticsを送信先として使用します。これらのツールは、ユーザーのアクティビティに関するデータを取得するのに役立ちます。
Segementを使用しているときは
Google OptimizeでSegmentを使用するには、Google AnalyticsのSegment設定で、Connection ModeをDevice Modeに設定します(これは重要です！現在、Google OptimizeではCloud Modeはサポートしていません。)
同じページのさらに下の方に、Optimize Container IDを入力する必要があります。
OptimizeコンテナIDは、ホーム画面の optimize.google.com で確認することができます。
注：4月以前のコンテナIDは “GTM “で始まり、4月以降のコンテナIDは “OPT “で始まります。
Google Optimizeプラグインをセットする
Googleは、他のプラグインと同様に、プラグインタブを介してbubbleエディタでプラグインを最適化するインストールします。インストールすると、プラグインのこの設定ページが表示されるはずです。
optimize.google.com にある Optimize コンテナIDを提供する必要があります。
Optimizeで実験を作成したら、ここでも実験IDとバリアントの数をコピーします。
注：4月以前のコンテナIDは “GTM “から始まり、4月以降のコンテナIDは “OPT “から始まります。
Google Optimizeで実験をセットする
最初にGoogle Optimizeを設定する際には、Google Analyticsのアカウントと連携させます。
Optimizeのフローに従って、「サーバー側」の実験を作成します。
①Optimizeで実験を作成する
②実験目的を設定する
③実験のターゲットを設定する
④バリアントの作成
⑤実験開始
⑥実験IDの取得
気に留めておきたいこと
・エディタページを「SERVER-SIDE」に設定します(他の何でも構いませんが、アプリ上の実際のURLと一致しないようにしてください)。
URL ターゲティングのルールと一致しないという警告が表示されるかもしれませんが、これは無視しても大丈夫です。
・バリアントの数に注意してください、そして、オリジナル(実験における「コントロール」)がバリアントとしてカウントされることにも注意してください。つまり、あなたがテストするコントロールと他の1つのデザインを持っている場合、それは2つのバリアントになります。(この数は、Google Optimizeの設定のプラグインタブに入ります。)
・Google Optimizeのバリアントの名前を変更することができます。
・オーディエンスのターゲティングは、もはや最適化されたUIからは何の影響も受けない
実験を開始する前に、バリアントの成功を測定するために実験が見る定量的な目標であるObjective(s)を設定する必要があります。以下のいずれかを行うことができます。
①リストから選択：これにより、Googleのデフォルトの目的(バウンス、ページビュー、セッション時間)にのみアクセスできるようになります。
②カスタムを作成: これにより、特定したイベントにアクセスしてGAに送信することができます。
過去にSegment / GAカスタムイベントを送信したことがある場合、イベントアクションを’your_event_name’と同じにするオプションを見つけることができるはずです。
これらのコンポーネントがすべて準備できたら、実験を開始することを確認してください！
Bubbleエディタで実験をデザインする
今回の実験では、Segmentに送信するカスタムイベントを測定してみましょう。
簡単に紹介すると、Segment プラグインを設定している場合、bubble Editor のワークフローアクション “Track an event with Segment” を使用することができます。
例えば、Aページの「Conversion Event！」というボタンをクリックすると、「user_did_a_thing」というイベントがログに記録されるようにしたい場合は、次のように設定します。
Segmentインターフェースで確認すると、このイベントはかなりすぐに “Debugger “に表示されるはずです。
Google Optimize の目的ページで確認すると、既知のカスタムイベントのドロップダウンリストにこのイベント名がポップアップ表示されるはずです。
重要なステップ：Optimizeにユーザーに注意を払うように伝える
Optimizeプラグインは、アプリを訪問したすべてのユーザーが実験に参加していると自動的に仮定しません。むしろ、ユーザーが実験に参加しているとみなされるタイミングをOptimizeに伝える必要があります。
(なぜこのような方法なのか: bubbleアプリのログインしたダッシュボード上でのみ実験を行っていると想像してください。この場合、多くのユーザーがランディングページを訪れるかもしれませんが、これらのユーザーのほとんどはログインしていません。したがって、正確な数値を得るためには、ページを訪問し、ログインしているユーザーのみを対象に実験を実行する必要があります。)
ユーザーを実験の対象とするようにOptimizeに指示するには、関連性のあるときにワークフローアクション「このページにGoogle Optimizeの実験を設定する」を実行する必要があります。
多くの場合、このアクションを「ページが読み込まれたとき」に実行することになると思いますが、もっと複雑なロジックを作成することもできます。
「アナリティクス」カテゴリ内でアクションを見つけることができます。
このアクションは、Google Optimizeロジックの残りのすべてを開始するものと考えることができます。このアクションがページ上にある場合、そのページを訪れたユーザーはランダムにバリアントに割り当てられます。
異なるバリアント作用を作成する
テストしたいさまざまな実験をデザインするために、「ユーザーが実験グループ1にいる場合は、この要素を表示してください」というようなことを効果的に言う条件文に頼ることになります。
バリアントによって異なる挙動を作成するには、データソース「外部APIからデータを取得」で「Google Optimize Experiment Groupを取得」を選択し、ワークフローや要素条件などで条件として使用します。
・”Get Google Optimize実験グループが0の場合 “は、コントロールを意味し、通常はあなたが持っていたオリジナルの経験のことです。
・”Get Google Optimize Experiment Groupが1の場合 “は、最初に持っているバリアントを意味します。
・例えば、エレメントの条件タブで、45度回転しているというコントロールがあるボタンがあるかもしれませんが、最初のバリアントでは、背景色を黄色にしたいときは…
通常、コントロールとバリアントの動作の両方を定義することになります。アプリをプレビューして、バリアントが必要なものであるかどうかを確認してください。
(ヒント: バリアントをより完全にプレビューするには、条件にさらに多くの句を追加して、文全体を一時的に真または偽にするように強制することができます。)
Google Optimizeで実験を開始し、変更をロールアウトすると、実験が実行されていることになります。
Google Optimize / GAインターフェイスはリアルタイムではありませんが、ユーザーが実験に参加している場合は、Google Optimizeインターフェイスにその兆候が見られるはずです。
まとめ
いかがだったでしょうか。複雑なアプリを作ろうとすればするほど、作業も大変になってきますね。
焦らず、丁寧に作業を進めていくことが大切だと思います。
