■ 操作説明
- iPhone / iPod touch / Androidにて、短縮URL( http://goo.gl/fLviS )を打ち込むかQRコード読み取りソフトでQRコードを読み取って、このページを表示すると、プレイヤーが追加されます。
- iPone / Androidに表示されるボタンの色と同じ色のプレイヤーが、自分のプレイヤーです。
- プレイヤーの追加後に、iPhone / Androidに表示されたボタンにタッチすると、その方向に移動します。別のPCでこのURLのWindowを開くと、そちらも同期して動きます。
- ブロックを押して、他のプレイヤーをブロックに挟むことで、他のプレイヤーを倒せます。
- 倒されたプレイヤーはiPhone / Androidでの再接続で復活します。
- 技術デモ用に作ったゲームなので、ゲームとしてのおもしろさは、余りありません・・・。

■ 技術的な内容説明

● 主に利用してる広義のHTML5の技術「WebSocket」
WebSocketを利用すれば、大量のデータを、少ない遅延でブラウザに届けることができます。
その利点を使って、どこにでもあるiPhone / Androidを簡単なマルチプレイヤーゲームのコントローラーとして利用してみました。

● 仕組み
iPhone/Android <--[WebSocket/Comet]--> サーバーアプリ --[WebSocket]--> Chromeブラウザ

- 1. iPhone / Androidにて画面タッチをtouchイベントのリスナーで捕捉します
-- ボタンはCSS transportを使って、boxを斜めに表示・ヒットテストを実現しています。
- 2. iPhone / Androidから、サーバーアプリに対して、操作を送信します。
-- socket.ioという通信ライブラリを使って送信を行います。iPhone / iPod touchはWebSocketに対応しているのでWebSocketが利用され、Androidではxhr-multipartやflash-tcpなどのCometの手法が利用されます。
- 3. サーバーアプリは、node.jsで作られており、プレイヤーを動かして、結果をChromeブラウザに送信します。
-- ここもsocket.ioが使われており、Chromeが対応しているWebSocketで通信が行われます。
- 4. ブラウザは、自分のプレイヤー・他のプレイヤー・ブロック等の位置情報や状態を受け取り、表示をします。

また、キャラクターは、接続毎にランダムで決定した色を使って、canvasのピクセル操作を使って描画したものを利用しています。

■ コピーライト
- このソフトは、REFMAPが配布しているフリー画像素材を加工して使用してます。このソフト内で使用されている画像を、このゲームを遊ぶ以外の用途には使用しないで下さい。
- QRコードは(株)デンソーウェーブの登録商標です。