マルチタッチデバイスにおける リアルタイム対戦ゲームの
最適化と実装
Seibe (Murai Lab. Arch B3)
親:sora
村井研究会 TERM最終発表 2015.02.03
1
目次
1. はじめに
2. 研究概要
3. スピードのルール解説
4. 調査
5. 実装
6. 評価方法
7. 結果
8. 考察
9. 終わりに
2
はじめに
アプリ
URL
http://seibe.jp/speed/
タブレット端末のブラウザーからアクセスすると、
実際に対戦をお楽しみいただけます。
※ Safari
や、マウス・タッチパネル以外の操作はできません3
研究概要
背景
タッチスクリーン搭載端末（以降、タッチデバイス）の普及が進み、
アプリ開発者は、タッチデバイスに相応しい
UI
を模索している マルチタッチUI
は、指を複数使えるため、より自然な操作に近いhttp://seibe.jp/speed/
4
研究概要
目的
ネットワーク型リアルタイム対戦ゲーム に絞って、
マルチタッチデバイス における 操作性の高い
UI
を検討・実装するアプローチ
UI
の改善は、数値で比較しづらく、難しい物理（アナログ）なゲームに習い、プレイを比較をして評価する トランプゲーム 「スピード」 を、マルチタッチ
UI
へ最適化するhttp://seibe.jp/speed/
5
スピードのルール
http://seibe.jp/speed/手札 場札
台札
6
スピードのルール
http://seibe.jp/speed/7
調査
課題
・ ターン制ではないため、遅延が大きいとゲームが成立しない
・ 両手でカードを同時操作できないと、遊び方の幅が狭まる
・ 相手カードの動きが見えないと、戦略性が損なわれる
・ 相手が何をしているのかが伝わらないと、盛り上がらない
http://seibe.jp/speed/
8
実装詳細
性能と実装難度のバランスから、
C/S
型（リフレクト型）を採用。Web
アプリケーションとして実装。共有情報をWebSocket
で同期 ゲーム進行管理は各クライアントで行うサーバーは通信の仲介だけで、通信内容のチェックは行わない
http://seibe.jp/speed/
Game Server
Node.js
Game Client
HTML5
Game Client
HTML5
WebSocket
マッチング、通信の仲介 入力、進行、描画 入力、進行、描画
WebSocket
9
実装詳細
工夫した点 / 苦労した点
・
HTML
における正確なマルチタッチ操作→ jQuery
ではなくzepto.js
を用いて高速化→
意図的なコマ落ちで、逆に高速な動作を演出・ 相手の手や顔が見えないので盛り上がりに欠ける
→
スタンプ機能で解決・ カードのドラッグ情報の伝送
→
プロトコルの工夫で送信回数/
データ量を低減http://seibe.jp/speed/
10
実装詳細
プロトコル定義
http://seibe.jp/speed/
Ping/Pong 0001xxxx xxxxxxxx xxxx… x = 時刻[2^32]
Ack 0010
Nak 0011
マッチング要求/応答 010000xx x = イベント種別
スピード開始要求 0101xxxx xxxxxxxx xxxx… x = 時刻ミリ秒[2^44]
終了告知 0110
エラー/エラー告知 0111xxxx x = エラーコード
カード位置変更 100000xx xxxx00yy yyyyzzzz
00yyyyyy zzzz… x =
数[2^6], y = 種別[2^6], z = 位置[2^4]
カードドラッグ情報 100100xx yyyyyyyy yyyy... x = イベント, y = 位置[2^4 -
2^68]
スタンプ情報 1010xxxx X = 種別
11
評価方法
実施内容
アナログと 実装したアプリとで ゲームプレイを比較する
（アナログは、ビデオ録画して編集ソフトでコマ送りで測る）
http://seibe.jp/speed/
12
評価方法
比較する測定項目 (1 プレイあたり )
・ 山札
->
手札&
手札=>
場 にドラッグできた時間平均・ 操作していなかった時間割合
・ マルチタッチしていた時間割合
http://seibe.jp/speed/
13
結果
計測結果
体験者の感想
・ 「タッチデバイスへの慣れがプレイ結果に影響した気がする」
・ 演出に関する評価と苦情
→
手を放すとカードが勝手に戻る→
スタンプで盛り上がったhttp://seibe.jp/speed/
測定数 1プレイ 1操作 進行停止 マルチタッチ
物理
1 62.88s 832ms 44.8% 4.1%
アプリ
11 85.62s
(74 - 111)
346ms
(292 - 447)
67.6%
(63 - 80)
0.5%
(0 ~ 1.2)
14
考察
評価 / まとめ
・
1
回あたりの操作時間が短い・ マルチタッチで行われる操作が少ない
→
トランプを「掴む」動作がない→
端末が小さく、トランプが実物大でなかった・ 誰も操作していない時間が長い
→
腕にカードが隠れて見づらい→
液晶ディスプレイの反射と視野角で見づらいアナログに近づいたが、まだ遠い
道半ばで、サンプル数が少なく評価が甘い
http://seibe.jp/speed/
15
http://seibe.jp/
16
考察
評価 / まとめ
・
1
回あたりの操作時間が短い・ マルチタッチで行われる操作が少ない
→
トランプを「掴む」動作がない→
端末が小さく、トランプが実物大でなかった・ 誰も操作していない時間が長い
→
腕にカードが隠れて見づらい→
液晶ディスプレイの反射と視野角で見づらいアナログに近づいたが、まだ遠い
道半ばで、サンプル数が少なく評価が甘い
http://seibe.jp/speed/
17
終わりに
今後の展望 / 卒論に向けて
目標は、アナログ以上の直観的なゲーム体験を実現すること スピードという題材は変えずに
遠隔でもインタラクティブを阻害しないさらなる工夫を
・ 動き予測補正
・
WebRTC
を用いて、さらなる通信の最適化、表現のリッチ化・ インターフェース拡張
(ex. LeapMotion)
さらに、今回道半ばに終わった詳細なデータ分析を
・ 体験者のインターフェース経験の事前聴取
・ プレイヤーごとに異なる技量を踏まえた評価
http://seibe.jp/speed/
18
