初音ミクのオンラインかるたゲーム「ミクミクかるた」をリリースしました。
http://mikumikuplay.com/karuta/
紹介動画URL
「ミクミクかるた」はブラウザで簡単に遊べるオンラインかるたゲームです。ゲームのルールは簡単で、ボカロ曲が流れたら、歌詞の先頭文字の札をクリックするだけです。「みっくみ～くにし～てあげる♪」と流れたら「み」の札を取ります。かるたの札の読み上げの代わりにボカロ曲が流れるというシステムです。オンライン対戦することも出来ます。
利用技術
クライアント HTML5, JQuery, jquery.vgrid.js, Bootstrap
サーバー Node.js(socket.io, express) リバースプロキシ nginx
詳細は、http://mikumikuplay.com/karuta/page_thanks に書いてます。
これらの技術を使ってみての感想は
・Bootstrap便利
簡単に適用できるし、それらしいデザインになるのがいい。dot installで要点を効率よく解説してくれるので助かりました。
・jquery.vgrid.js超便利
画像とかをタイル状に並べてくれるJQueryプラグイン。簡単に使えて見栄えが良い！
・HTML5は通信のタイミングに注意が必要
なぜか音が鳴らない場合があって、音のファイルがロードされるのを待ってから処理を開始するというロジックを入れて解決しました。
・Node.jsはWebSocketサーバ書くのは分かりやすくていいけど、普通のWebアプリならPHPとかのが簡単
もちろん普通のWebアプリでもNode.jsの特徴であるシングルスレッドノンブロッキングIOでスケールさせたいとかって理由があればNode.jsを選択しておｋだと思います。expressはシンプルでわかりやすくて良いと思いました。が、やっぱ、非同期IOのロジックは書くのがめんどいのでECMAScriptにyield構文追加で改善されることを期待してます。
以前、「ミクミクすごろく」というオンラインすごろくゲーム( http://mikumikuplay.com/sugoroku/ )を作り、ユーザーがイラストと文章を作ることによってゲームコンテンツを拡張していくことが出来るCGG(Consumer Generated Game)の仕組みを作りました。CGGはブログなどでおなじみのCGM(Consumer Generated Media)のゲーム版に当たります。
今回開発した「ミクミクかるた」では、開発作業をニコニコ生放送で配信していました。すると視聴者の方がゲームの機能やデザインについてのアイデアをコメントしてくれました。コメントしてくれたアイデアのほとんどを採用しています。言わば、生放送駆動開発(Live Driven Development)と言えるのではないでしょうか？まぁ、これは悪乗りですが・・・。
最近流行している開発手法としてテスト駆動開発(Test Driven Developement→略してTDD)というものがあります。TDDをするとテストしやすいインターフェースやモジュール設計が出来るようになりますが、この生放送駆動開発すると、ユーザーが望んでいる設計が出来るのではないかと思います。新たな開発手法を発見することが出来ました。
ってなわけで、ユーザー登録なしで簡単に遊べるのでぜひPlayしていただいてエンジニア目線で見て感想とかダメ出しとかしてくれると嬉しいです！よろしくです！
http://mikumikuplay.com/karuta/