ENGINEERING&RUN

26.2マイルを走る僕の旅

Mixpanelのautotrackでコーディングいらずでイベントをトラッキング

Mixpanelといえば、ユーザーの行動を記録し分析することができるツールです。 mixpanel.com

Google Analyticsがどんどん進化していますが、個人的にはここらへんがMixpanelの強みかなと考えています。

・Peopleと呼ばれる人にフォーカスした分析ができる

・特定のボタンを押したユーザーにプッシュ通知やメール送信など、ユーザーに対するマーケティングアクションを行うことができる

・サーバー側処理のイベントを記録することができる

そんなMixpanelですが、設定にはコードを埋め込むことが必要で柔軟な運用が難しいという欠点がありました。

例えばマーケティング担当者がちょっとしたボタンのクリックイベントを計測する為、わざわざチケットを切ってデザイナーに割り込みタスクを渡す必要がある等です。

そんなMixpanelですが、Googleタグマネージャーのようにコードいらずでイベントを設定できるautotrack機能が実装されました。

使い方は簡単。
まずApplicationからautotrackを選択します。
※他の便利なJQLやPredictはまた今度紹介します。 f:id:eishis:20161025000033p:plain

そして埋め込むプラットフォームを選択します。 f:id:eishis:20161025000031p:plain

Webの場合はURLを登録します。 f:id:eishis:20161025000028p:plain

そうするとそのURLのページが開き、トラックメニューが表示されます。 f:id:eishis:20161025000022p:plain

あとは埋め込みたいボタン等を選択し、イベント名を設定すれば完了です。
コーディングいらずでイベントが設定できました。

ちなみに、実はautotrackはイベントをずっと記録してくれており、設定前でもどれくらいクリックされたか計ることができます。

今まで作ったbotを10個

よっぽどのことがなかったので数ヶ月間放置してた。 最近はbotをよく趣味で開発しているので、自分の整理の為にもまとめてみる。 必要があればソースも公開する。基本はRubyでつくっている。

一時期ビジネス化も考えてたけど、やっぱりbotはエンジニアの趣味の域だよね〜という結論に達した。 チャットボットの批判記事とかあったけど、あの通りだと思う。

開発したbotはこんな感じ

1. 為替相場返してくれるbot

これはFacebookとLINEとSlackのbotで作った。 ドルとかユーロとか、あと南アフリカランドとかの円相場を返してくれる。 日本の為替相場APIが有料なものがほとんどな為、海外のものを使用している。 もちろん円→ユーロなんてAPIでもっていないので、円→ドル→ユーロという計算をさせている。

2. 株価返してくれるbot

これもFacebookとLINEとSlack。 これまた海外のAPIを使用。 企業名入れるとその日の株価を返してくれる。 APIリクエスト数をかなり消費したけど、謎に5年分のレコードを全て保存してある。

3. 天気返してくれるbot

これも海外のAPI使用。 まず入力された地名から座標のAPIを使って変換。 そしてその座標軸から天気のAPIにアクセスし取得という流れ。

4. メディアの最新記事を返してくれるbot

Slackだとデフォルトである機能。/feed コマンド。 これをFBとLINEにも加えた。 これはRSSを登録しておき、一定タイミングでクローリングし通知していないものがあれば通知という流れ。

5. Twitterの監視bot

Twitterのstreaming APIを使用。 Slackの通知に常に任意のキーワードで拾ったtweetが流れてくる。

6. タスクを登録できるbot

個人用に開発。@でメンション飛ばして、何をしたいかを伝えるとタスクを登録してくれる。 また完了時には、タスクが何分かかったかも計算してくれる。 毎朝、昨日にどのタスクを何分作業したかも通知してくれる。

7. trelloのステータス通知bot

これも個人用。 毎朝、期限がすぎているtrelloのタスク、すぎそうなtrelloのタスクを通知してくれる。

8. trelloの完了おめでとう的なbot

ゲーム要素を入れた。 trelloのタスクを完了させる（カードを移動）するとオリジナルのモンスターがゲットできるｗ 謎の自己満bot。

9. 検索順位を教えてくれるbot

任意のキーワードで任意のURLが検索で何位か教えてくれるbot。 地味に役立つ。

10. Mixpanelで特定のイベントが発生したら通知してくれるbot

一気に業務感。 特定のイベント完了したらwebhookが発動。 botで教えてくれる。

こんな感じです！

WordPressで特定のカテゴリのアイキャッチを全て削除するバッチ処理

WordPressの案件で、今あるアイキャッチ画像を全て削除し、他の画像データ群に置き換える必要が出てきた。
アイキャッチが割り当てられている投稿が10万件近くある為、バッチ処理で行うことに。

備忘録的に残す。というかWordPressのバッチ処理の日本語記事、少なすぎじゃないかなと思うのでこれから残していく。　　

batch.php

<?php
require_once('wp-load.php');
require_once('wp-config.php');

// 特定のカテゴリを選択
$category_id = get_cat_ID('牛脂');

$results = $wpdb->get_results("
    SELECT *
    FROM wp_postmeta
    WHERE post_id in 
      (SELECT object_id FROM wp_term_relationships WHERE term_taxonomy_id = 
        (SELECT term_taxonomy_id FROM wp_term_taxonomy WHERE term_id = $category_id)
      )
    AND meta_key = '_thumbnail_id'
");

foreach ($results as $value) {
  delete_post_meta($value->post_id, '_thumbnail_id');
}
?>

実行方法

これをphp batch.phpといった具合で実行してあげればOK。
副々問い合わせなのでちょっと冗長かな。

feedlyをやめてslackに通知するようにした。やっぱりslackすごいという話。

今までの情報収集

自分の興味あるニュース、技術情報、運用しているサービスのGoogle Alertなどをfeedlyに取り込んでいた。
ただ、どうしても毎日feedlyを立ち上げることができず見落とすこともしばしば。。
そうしているうちに未読が溜まっていき、ますます見ないようになっていた。

feedly.com

一番身近なツールに集約しよう

この問題をどうしようかと考えたときに、「一番身近なツールに情報収集を集約しよう」と考えた。 それが仕事でも使うslackだった。 slackのfeed登録は簡単。このコマンドをfeed登録したいチャンネルで打つだけ。
/feed 登録したいRSSのURL f:id:eishis:20160306195641p:plain

RSSのURLがわからない人はこんなサイトを使うと良いだろう。

RSSフィード取得・検出ツール - RSSリスティング

ちなみにGoogle Alertで特定のキーワードで抽出したい方はこんな感じ。
/feed/ https://www.google.co.jp/alerts/feeds/xxxx
まずGoogle Alertにアクセス。
Google アラート - ウェブ上の面白い新着コンテンツをチェック

f:id:eishis:20160306204345p:plain
最後のどこに飛ばすかという設定をRSSにして保存すればOK。
RSSのアイコンが出るので、クリックしたそのURLを保存してslackに登録するだけ。

そしてはてブの記事登録はこんな感じ。
/feed http://b.hatena.ne.jp/search/text?q=牛脂&mode=rss

他にもはてブ数〜個以上のものだけ集めるなど色々できる。

はてなブックマークドキュメント一覧 - Hatena Developer Center

確認するには

/feed listで登録しているfeedを表示してくれる。

予定も登録しよう

あとカレンダーも登録しておくと便利。
リマインダをチャンネルに投稿してくれる。

slack.com

やり方はとてもシンプル。ここからGoogleアカウントと連携し投稿するチャンネル、どれくらい前に投稿するかを選ぶだけ。

slackの何がすごいか

ここからは個人的な感覚。
メール、トークアプリ、SNS、タスク管理ツールなど様々なアプリケーションが乱立している。
これら全てにユーザーが一次のタッチポイントとして接触していくと大変。
そもそも不要な情報も多いのだから。 f:id:eishis:20160306211445p:plain
※雑なイメージ図。

slackは裏で動く全てのアプリケーションのタッチポイントアプリケーションにすることができる。
一旦slackに集約し、必要だと思った情報にだけアクセスするようにすれば良い。 f:id:eishis:20160306211642j:plain 更にこの後ろにIFTTTやZapierのようなAPIアグリケーションサービスを置くことで、より世界が広がる。

ifttt.com

The best apps. Better together. - Zapier

つまり、情報収集まで社内ツールまで、増えすぎる情報に対し一次のタッチポイントとしてライトに情報を集めるツールとして非常にslackは優秀なのだと思う。

slackで苦手なこと

よく言われることだけど、ストック型の情報とフロー型の情報がある。
slackはスレッドが流れやすいのでフロー型、つまり通知や一時的なコミュニケーションは得意。
ただ固めた仕様のようなストック型情報もslackで管理すると「あれ、どこいったっけ」が頻発する。
ここらへんのストック情報だけはスプレッドシートやGithubのissueやwikiなどに保存すると良いだろう。

まとめ

  • feedやカレンダーは簡単にslackと連携できる。
  • slackは一次タッチポイントツールとして優秀。どんどんアプリケーションと連携し、チャンネルは分けながらもフロー型情報を流し込むと良い。
  • フロー情報はslackは使わないほうが良い。埋もれて「あれどこいったっけ」が発生する。

slack本当にすごい！でも何だかんだインタフェースも使い勝手も開発寄りなので、開発以外のビジネスの現場ではそこまで広がらないだろうなーと思う。

WordPressで急に記事が表示されなくなった

WordPress

事象

急に特定のカテゴリー（event）配下の記事が表示されなくなった。 何かのプラグインが.htaccessのmod_rewrite関連をいじったのかなーと思って確認したが異常なし。 うーん、困ったとあれこれ悩んでしまった。

原因

イベントカレンダーを作る為に、All-in-One Event Calendaというプラグインを入れたがこれが原因だった。

wordpress.org

実はこのプラグイン、イベントを作成するとhttp://~/events、http://~/eventというページを作成してしまう。
これとeventカテゴリーの記事のパーマリンクが被ってしまい、正しく表示されなかったというオチ。

対策

このプラグインを有効化した後にsettingというメニューが出てくる為、ここでURLをevents、eventから変えてやれば良い。

何も心当たりが無くて非常に困っていた。
とにかく焦った。 サーバー側ではなく、WordPress側で404エラーが出た場合、URLの重複が発生していないか当たってみるのが良いと思う。

get_resultsとget_varを間違えないように！

WordPress

WordPressのデータ移行時にくだらないことでハマっていたので備忘録にする。

例えばget_resultsでshopsテーブルを取得する。

$results = $wpdb->get_results("
    SELECT *
    FROM shops
    WHERE station_id IN('562','563')
");

この結果は当然配列として返ってくる為、下記のように展開する。

foreach ($results as $value) {
  echo $value->id;
}

しかし、誤ってget_varを使ってしまっていた。（しかも他の箇所では正しくget_resultsを使っていたにも関わらず！）
get_varは最初の1件のレコードのみを取得する。
その為、配列の展開も必要ないのだ。

くだらないことで時間を取られてしまった。。

WordPressでテンプレートからショートコードの引数を変数で実行する

WordPress

なんだかわかりづらいタイトルになってしまったが、ハマっていたことがあったので備忘録として残す。

やりたかったこと

  • カスタムフィールドで設定した緯度経度の情報から、各記事にGoogleMapを追加したい
  • 特定のカテゴリーの全ての記事にGoogleMapを入れたい為、テンプレートファイルに地図表示処理を書きたい

対策

functions.phpにGoogleMap出力の関数を書き、テンプレートファイルからカスタムフィールドの緯度経度を引数として呼び出すことを検討。
ただ、Google Mapの埋め込みコードって意外と面倒だったりする。エンジニア失格なのかもだけど。
そこで今回はSimple Mapsを使うことに。

wordpress.org

これを使うことで、ショートコードのみでGoogle Mapを呼び出すことができる。
こんな感じ。
[map lat="37.77493" lng="-122.41942"]

これでカスタムフィールドの値をlat,lngに入れればOK。

ハマったこと

下記コードでGoogle Mapが出力されない！

<?php
// カスタムフィールドの緯度経度を変数に格納
$lat = post_custom("lat");        
$long = post_custom("long");
// 変数を引数にしてSimpleMapsのショートコードを実行
echo do_shortcode('[map lat="$lat" lng="$long"]'); 
?>

うーむ、なぜだろうと小一時間。むしろ細切れの時間でやっていた案件なので悩むこと数日。 超簡単なミスをしていた。

正解はこれ。

<?php
$lat = post_custom("lat");
$long = post_custom("long");
echo do_shortcode("[map lat=\"$lat\" lng=\"$long\"]"); 
?>

そう、''でショートコードを囲んでいたので変数展開がされなかった。
エスケープしとかないとね。

ちなみに今回、「Rails側のCGMで作成されたデータをWordPressにDB連携し、記事化する」という要件を設計した。 マスターであるRails側のDBを日次バッチ処理でWP側に連携し、そこから各項目をカスタムフィールドに格納し、テンプレートで記事として展開するということをしている。
少し冗長な気はするが、昔COBOLで生保システムをつくっていたときのオンラインホストの連携処理からヒントを得た。
経験が役にたってよかった。