フェイスブックアプリ tomochizu 作ってみたら広がりがすごいや

12日の金曜午後からフェイスブックアプリの作成を始めました。
最初頭に思い浮かべていたのはゲームだったんだけど途中でとても無理だと思って、まずは県別友達分布地図を作成しようと思いました。

まず、フェイスブックアプリのサンプルプログラムを試してみました。
ふむふむ、自分の情報は取り出せました。


次にローカルPCのWEBサーバー上でテーブルタグの化け物で日本地図を作成してみました。
一番右の列が破綻してるのはわかってるんですが、今回はスペース優先ということで・・・


そして合体だ!
あ、その前に友達のIDリストは取れてるけど、居住地情報が取れていないじゃん。
・・・これで半日かかっちゃいました。


ノウハウ1:req_permsの値を変えた場合には、アプリ画面のリロードではなく開発ページから移行してアプリを走らせよう!

 そうでないと許可ステータスが変化しないらしく、いつまでたっても友達の居住地情報が取れなくて無駄にソースをいじくりまわして悩んでいました。

$url = $facebook->getLoginUrl(array(
'canvas' => 1,
'fbconnect' => 0,
'req_perms' => 'publish_stream,user_hometown,friends_location'
));

※2010年11月22日:追記
許可条件を変更した場合には、このページで一度アプリを削除してから実行しよう

https://www.facebook.com/settings/?tab=applications


次に、また半日かかった問題。


ノウハウ2:idをカンマで区切れば一度に複数人の情報が1回で取れるぞ!
 僕の友達人数はこの時に290人くらいいたのですが、友達の情報を290回リクエストしていたら応答が帰ってこない。
 仕方が無いので、まずは20人分の20回のリクエスト情報だけを取ってきて開発をしていました。
 これじゃアプリにならないよ〜。DBと組み合わせてキャッシュとか作る必要あるのか?とか煮詰まってました。
 そしたら、uidsと複数形で書いてあるじゃないですか!
 試しにカンマ区切りで記述してみたら、1回のリクエストで290人の情報があっというまに取れるようになりました。

$apiGet = array(
'method' => 'users.getinfo',
'uids' => $me["id"] . $ids,
'fields' => 'uid, name, first_name, last_name, pic_square, sex, current_location'
);


さらに、また半日かかった問題。


ノウハウ3:bodyは<div id="fb-root">で囲っておこう
 ある方から「FB.Canvas.setAutoResizeを使ってリサイズするといいよ。」と教えてもらいました。
 そこで管理画面でauto-resize指定して、FB.Canvas.setAutoResizeも組み込んだのに、インラインフレームが自動リサイズしないのです!
 googleで検索して英文サイトを50くらい見ましたが解決しませんでした。
 最終的には、Facebook内の開発者グループで質問して詳しい人にソース見てもらってbodyの後に<div id="fb-root">が足りていないことを教えてもらいました。

<script type="text/javascript">

window.fbAsyncInit = function() {
FB.init({appId: '', status: true, cookie: true, xfbml: true});
FB.Canvas.setAutoResize();
};



tomochizu


<div id="fb-root">


上記の3つとも解決まで半日かかったっていう間には、実際には家事をやったり、子供の相手したり、晩御飯の買い物に行ったり、称号を考えていたり、アイコンを作っていたりしたんですけどね。


称号をつけるっていうのは、初めから考えていたわけじゃなかったんです。
上記の問題で行き詰っていたときに、何かひらめいたのです。
友達のいる県・地域・人数に応じて、かっこいい・強そう・へんてこな称号が表示されたら、おもしろそうだなって。
結果的には称号のおかげで、おもしろがって使ってくれる人が増えたみたいです。
へんてこな称号の方がツッコミをいれたくなるみたいで、友人間の会話につながったのかな〜って思っています。


土曜日の夜に、まだ人に紹介していないのにFacebookの友達の一人がおもしろいね〜って発言しました。
アプリ開発するのに非公開にするのを忘れてたら、ウォールに書かれたアプリを使用開始したってのを見て試してくれたみたいです。
(この時はまだ称号をウォールに書き込む機能はなかったので)
そのまま、土曜の晩から何人かの友達に試してもらい始めました。


色々と問題も見つかり、対処しながら14日の日曜日の晩くらいには、良い感じになってきました。
ウォールに書き込む機能もつけたため、友達の結果を見た人たちが tomochizu を使い始めました。
友達の友達あたりの人たちですね。


そして、15日月曜日の午前中に友達が3000人以上いる「あまの ひとし」さんが tomochizu を使ってくれました。
そしたら、知らない人がどんどん使ってくれて友達申請もいっぱい来るようになりました。
まだ問題があって完成していないのに広がってしまって、ちょっとあせりも出てきました。
夜には、知らない人が twitter でつぶやいてくれてるのを確認しました。


ソーシャルアプリの広がり方 すげぇな!!


もう眠いので今晩は、この辺で。


※2010.11.16追記
わかりにくい部分の文章を直し、称号に関する記述を追加しました
16日火曜日には友達の数が4000人をこえている人が2人このアプリを使用してくれました。
こうやって、どんどん使用者が増えていっているみたいです。