1 of 15

CakePHP

AbTestComponent

A/Bテストをどこでも、簡単に。

2 of 15

自己紹介

橋田 一秀

Webサービスが大好きなエンジニアです

blog:Webサービスカタログ

株式会社うるる

CakePHPで自社サービスを作ってます。

エンジニア絶賛募集中!気軽に聞いてください!

hassy0607

3 of 15

自己紹介

橋田 一秀

Webサービスが大好きなエンジニアです

blog:Webサービスカタログ

株式会社うるる

CakePHPで自社サービスを作ってます。

エンジニア絶賛募集中!気軽に聞いてください!

hassy0607

これ、

作ってます。

4 of 15

AbTestComponentとは?

面倒なWebサイトのA/Bテストを

サイトのどこでも、簡単に行うための

CakePHPのコンポーネントです。

5 of 15

A/Bテストとは?

ホームページ、製品ページ、FAQといったサイト上に存在する各ページに対して、複数のバージョンのページを用意しテストを行い、もっとも効果の高いページを決定することを目的とした手法のこと。

6 of 15

A/Bテストの導入例

・会員登録ページ

・リンクバナー

・グローバルナビゲーション

50%

50%

7 of 15

計測はGoogle Analyticsで

8 of 15

ビュー数・訪問数が一目瞭然!

9 of 15

コンバージョン率の差まで!

10 of 15

簡単にやりたい

・やってきたユーザにA/Bを割り振る

・セットされたパターンによって

 - 表示を切り替える

 - トラッキングコードのカスタム変数の値を

出し分ける

var _gaq = _gaq || [];

_gaq.push(['_setAccount', 'UA-XXXXXXX-X']);

_gaq.push(['_setCustomVar',1,'Header','new',2]); ←ココを出し分ける

_gaq.push(['_trackPageview']);

(function() {

var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;

ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';

var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);

})();

11 of 15

仕様

・Google Analyticsのカスタム変数のキーをセットしてトラッキングできる

・簡単に使える

($this->AbTest->startAbTest('hoge')するだけ)

・ControllerでもViewでも使える

12 of 15

仕様

・Google Analyticsのカスタム変数のキーをセットしてトラッキングできる

・簡単に使える

($this->AbTest->startAbTest('hoge')するだけ)

・ControllerでもViewでも使える

これが大事。通常のA/Bテストといえば、後述のOptimizely含めView部分を出し分けるだけのものが多いですが、処理そのものを出し分けたい時にも使えます。

先ほどの導入例では、会員登録ページのフローを変更してA/Bテストしました

旧)【1.メールアドレスとパスワードを入力】→【2.メール送信】→【3.メールのリンクをクリック】→【4.個人情報を入力】→【5.メール配信を受けたい検索キーワードを入力】→使える

新)【1.名前・会社名・住所などを入れ】→使える

13 of 15

@todo

・現在、絶賛Plugin化中。

・A/B/n testの実装。(3つ以上ある場合)

・表示割合の実装(A:B=1:2で出すとか)

・特定のパターンを出したい時の実装。

(プラグインには入れず開発ツールとして提供?)

14 of 15

Follow us on github!

・Uluruのgithubをフォロー

https://github.com/uluru

15 of 15

Appendix - Optimizelyがヤバい件

ブラウザ上でABテストのパターンを作れる。終わったらJSが出力されるので、それをサイトに貼りつけるだけで計測ができる。見た目的な変更だけなら一番手軽。有料。($17〜)

5分!