« 02.05 画像を送信するIntentを起動させる(Android) | ココ | 02.09 Facebook Graph API でいいね!取り »

2011年2月 6日

ハッカソンに初参加  このエントリーを含むはてなブックマーク 

HTML5 x Android アプリ開発ハッカソン (A3に応募しよう)に参加してみました。主催の神戸支部側の人間としては、まぁ出ないといけないのかなーというノリで行ってみたんですが。

ちなみに、ハッカソンとやらのに参加するのは初めてです。

今回のハッカソンでは、HTML5-WEST.jpの方との共同開催ということで開発するネタはAndroidに限定されずHTML5を使ってもOK。1チーム5人程度のグループで開発を行います。というわけで、普段はAndroid(Java)を触っているわけやけども今日はHTML5を見てみようかなーと思ってました。せっかく、全然知らない人と何かを作る機会ですから。

で、JQuery MobileとHTML5を使って何かしてみようというグループに参加してみた。Android神戸チームを尻目に。そしたら、みんなハッカソンが初めての人やった…(笑。あいさつを済ませた後、実際に開発をする前にアイデアソンで何を作るかを決める。実際の開発時間って、6時間ぐらいしかないのでそんなに大きなものは作れない…。

個人的にFacebookのAPIを触ってみたかったので、今日が絶好のチャンスだと思いとりあえず「いいね!」の数を取ってきて表示するアプリはどうかと提案してみたら、特に異論もなく受け入れられてしまった…。

ちなみに、まぁ敢えて書かなくても分かるかもしれないですが、Facebook上では「いいね!」というリンクをクリックすることである投稿に対して「○○さんが「いいね!」と言っています」といった感じにどの友達が興味を持っていてくれてるか分かる仕組みがあります。Facebookを使い始めて、まずぶち当たる戸惑いのうちの1つがこの「いいね!」の使い方なのですが、それはそれとして。

この「いいね!」に着目し、今回は自分の投稿に対して「誰が」「どれだけ」の「いいね!」をしてくれているかを可視化することにした。

こんなグラフ(ref. HTML5 gallery)が描けるっぽいのは前の日にちらっと調べてみて分かっていたので、ノード部分にアイコンを描くことと、「いいね!」の数に応じてアイコンの大きさを変えることをひとまず提案。

まぁ、「いいね!」の数を集計してくれたり、友達のつながりをグラフで描いてくれるアプリなんかはたくさんあるわけで、そんなに目新しいことじゃないけど、HTML5(Canvas)を使うってことなので、その点ではあまり見ないアプリになるかなと。そしてさらに、node.js、WebSocketを使ってリアルタイムの書き換えにも対応できるような仕組みにも…。

というわけで、開発開始。


最初の数時間は、せっかくnode.jsを使うわけだからJavascriptで完結できないかなーとnode.jsをちょっと触ってみたりしてたんやけど、結局、PHPでデータを取ってくることに。参考にしたところは↓。

AKB48で学ぶFacebookアプリとファンページの連携方法 (ref. web探検隊)

これで、localhostからFbAPIを叩いて自分の友達やら、自分の投稿、ウォールの内容、とかとかを取って来れることを確認。最初に認証する画面(↓)が出てきて、確立されたセッションのaccess_tokenをコピる。

そして、ごにょごにょして、自分の投稿+「いいね!」してくれた人の名前とIDを取得(↓)。取ってきたデータを、表示する側に受け渡すところまで、僕の担当分は終わり。

…えっ、JQueryは?? …残念ながら僕はサーバーサイドの担当だったので表示側は別の方が…とりあえず、ダミーのデータで表示ができるようにHTML組んでくださってました。そして、Canvasでの表示も紆余曲折があったもののダミーデータでは表示できてました。

しかし、時間が足りなかった。データを流し込むことができなかった…くやじい。

いやまぁ、でも初めて会って、みんな初めてのハッカソンで、意外と頑張れた方ではないかなぁと心の中では思っているのですが、結果が伴ってないのでちょっと残念。個人的にはAPI触れたので満足やけどね…。

ハッカソン後の発表も初めてやったから、どんなふうに発表すればいいのかわからなかったけど、今回見て理解した。最初にどれだけ話を膨らまし、そしてどれだけ駄目だったのかをアピールすればいいのだと。プールの飛び込み台の高いところまで行けばいくほど、飛び込んだ時のウケがいい。(笑 どれだけ笑いが取れるかが印象につながるんだなーと…いや、きっと普通にいいアプリができて、いい感じに動いていればそれはそれは素晴らしい成果になるんでしょうが、半日未満の時間しかないハッカソンでそれができたら超人集団でしょうと(作業時間の見積もりとか、マネジメント部分も含めてという意味ですよ)。

いい経験できました本当に。みなさんありがとうございました。

…と、帰ってきてから、もう一回アクセスしたらこんな画面に…(涙

な、なんで!?
(2つ上の画像も実は再現できなくて、IFrame方式でやって撮った)

By ただ at 23:00 カテゴリー ; お出かけ , プログラミングとか

« 02.05 画像を送信するIntentを起動させる(Android) | 02月の記事 | 02.09 Facebook Graph API でいいね!取り »




トラックバック

このエントリーのトラックバックURL:
http://pinmarch.sakura.ne.jp/mt/mt-tb.cgi/1714