SlideShare a Scribd company logo
    +       で、
バーチャルサバゲを作ってみた
geechs株式会社 田宮 幸子(タミー)
初めまして、タミーです。
• ギークスでiOSエンジニア

やってます (セブ帰り)
• 趣味はパラグライダー

(飛び仲間募集中!)
• 野生児
• 3年以内に世界一周の旅出
ます
本題
サバゲ
ルール知って
ますか?
Milkcocoa + gmaps.jsで、バーチャルサバゲを作ってみた
チームに分かれてフラグを
取り合う
その間に銃で打ち合って
打たれたら死ぬ。
それを・・
VS
VSかの有名なバトルメンバーで
再現してみた
せっかくMilkcocoa girlsなのに、
ガールズっぽいネタじゃなくてすいません…
ゲーム概要
1.Dropbox 上のファイルに接続
https://
dl.dropboxusercontent.com/u/
48622414/real-onigokko/sp.html
※みなさんもぜひ!
2. チームとキャラを選択
3. みんなが選択し終えたら、
スタートボタンで開始!
勝利条件
・ドラゴンボールを相手チームより
 多く集める
・相手チームを全滅させる
早速ドラゴンボールを
発見!!
100メートル圏内に入ると
ボールを発見できます
GETするには30メートルの
射程内に
入らなければなりません
↑
仲間の姿は見えます
アイテムGETボタンで
ドラゴンボールをGETしました!
こんな調子で集めます
Milkcocoa + gmaps.jsで、バーチャルサバゲを作ってみた
敵がすぐ近くにいる・・
Milkcocoa + gmaps.jsで、バーチャルサバゲを作ってみた
攻      撃
Milkcocoa + gmaps.jsで、バーチャルサバゲを作ってみた
死亡しました・・
(これも30M圏内)
こんな調子です
基本構造はのびすけさんの記事から
http://liginc.co.jp/web/js/132533
DROPBOX
使ってますが
TEAM01
TEAM02 ITEMS
STREAMで
とってくる
それぞれの
DATASTORE
※ログはSENDで共有している
<script src="https://maps.google.com/maps/api/js?
sensor=true&libraries=geometry"></script>
var myLatLng = new google.maps.LatLng(position.coords.latitude,
position.coords.longitude);
var itemLatLng = new google.maps.LatLng(value.lat, value.lon);
var distance =
google.maps.geometry.spherical.computeDistanceBetween
(itemLatLng, myLatLng);
距離をはかるメソッド
・制作時間 約まる2日
 コードは500行くらい(書き方よくない)
・ちなみにJSは初心者。
 デバッグの仕方もわからないほど
・ゲームの設定を考えたり、
 ステータス分岐実装に時間がかかったかも
<MILKCOCOAのすごいと思ったところ>
・動くようになるまでが超早くてテンション上がる!
・とにかく手軽なので、今のところはプロトタイプ作っ
たりするのにすごく向いてそう。フロントの味方。
・ココイルみたいなアプリやチャットアプリはまじで簡
単に作れると思う。
・ドキュメントが日本語ですごくとてもわかりやすい。
 資料自体は多くないけど困ることはなかった。
 
<ちょっと残念だったところ>
・REMOVEがしにくい。
 これからに期待。
・DATASTOREからWHERE付きでFINDができる
ようになってほしいな
おまけ
弊社のドランゴンボールに
夢見る若者たちに、
Z戦士になってもらいました。
まずはチームわけと、レーダー確認
ここでいきなりザーボンが不意打ち!
攻撃!!
ぐあ・・貴様卑怯な。。
zabon:vegetaを倒しました!!
ちょっ、、
スタート直後は攻撃禁止!
今後、できないように実装予定だから(汗)
仕切り直し
うーん・・
どこだ∼
ドラゴンボール・・
うお、またベジータだ・・
レーダーに夢中で気づいてない。
攻撃!!!
な、なに・・!?
ザ・・ザーボンごときに・・・
バタッ
そうこうしている
うちにフリーザが
ドラゴンボールを
発見!!
フッフッフ・・・
フリーザチームの勝利!!
え、わたしが何もしてないって?
そりゃ・・開発者だもん、ね?
チートもできちゃうし、ね?
ともあれ、
MILKCOCOA、楽しい!!
ありがとうございました。
GitHubにコードあがってます
https://github.com/Tamiiy/virtual-sabage
Special Thanks!
弊社エンジニア Kosuke, Daiki, Shohei
主催 のびすけさん、ようへいさん

More Related Content

PPTX
KLabインターンシップ成果報告会
PDF
Vrgj2016 atmalone 2
PPTX
20161125 尾崎 bootstrap
PPTX
プログラマの本気
PPTX
実施ゲーム変遷
PPTX
Flappy birdもどきをつくろう
PDF
リズムゲームを面白くする音に関する演出 〜『ありすのステージ』製作時に得られた知見〜
PDF
人狼初心者講座
KLabインターンシップ成果報告会
Vrgj2016 atmalone 2
20161125 尾崎 bootstrap
プログラマの本気
実施ゲーム変遷
Flappy birdもどきをつくろう
リズムゲームを面白くする音に関する演出 〜『ありすのステージ』製作時に得られた知見〜
人狼初心者講座

Viewers also liked (20)

PDF
IoT超初心者がMilkcocoaからラズベリーパイに遠隔Lチカしてみた
PDF
はじめてのMilkcocoa
PDF
Milkcocoa を飲んだらちょっと勇気がでた話
PDF
Node.jsでDroneたちをめっちゃ簡単にHACKする話 JSオジサン#6
PDF
JSの基本的なことをちょっと掘り下げてみる話シリーズ Chapter03. 〜 prototype?編 〜
PDF
JSの基本的なことをちょっと掘り下げてみる話シリーズ Chapter02. 〜 デバッグ編 〜
PDF
環境パートナーシップ事例集
PDF
ProFuture 経営プロ企画書
PDF
しょぼいプレゼンをパワポのせいにするな! by @jessedee
PDF
見やすいプレゼン資料の作り方 - リニューアル増量版
PDF
Let's write understandable Japanese!
PDF
社内SEの技術的じゃない話
PDF
社内Twitter研究会、by 勉強会同好会 110426
PDF
Onesocialweb: a platform to build mobile social applications
PDF
Introduction to onesocialweb protocol and API
PDF
A short introduction to the cloud
PDF
SwiftでSNS投稿を行う
PDF
Playing with playgrounds
PPTX
Angularfire でのSNS構築
PDF
Drones, Flying robots and Javascript
IoT超初心者がMilkcocoaからラズベリーパイに遠隔Lチカしてみた
はじめてのMilkcocoa
Milkcocoa を飲んだらちょっと勇気がでた話
Node.jsでDroneたちをめっちゃ簡単にHACKする話 JSオジサン#6
JSの基本的なことをちょっと掘り下げてみる話シリーズ Chapter03. 〜 prototype?編 〜
JSの基本的なことをちょっと掘り下げてみる話シリーズ Chapter02. 〜 デバッグ編 〜
環境パートナーシップ事例集
ProFuture 経営プロ企画書
しょぼいプレゼンをパワポのせいにするな! by @jessedee
見やすいプレゼン資料の作り方 - リニューアル増量版
Let's write understandable Japanese!
社内SEの技術的じゃない話
社内Twitter研究会、by 勉強会同好会 110426
Onesocialweb: a platform to build mobile social applications
Introduction to onesocialweb protocol and API
A short introduction to the cloud
SwiftでSNS投稿を行う
Playing with playgrounds
Angularfire でのSNS構築
Drones, Flying robots and Javascript
Ad

Milkcocoa + gmaps.jsで、バーチャルサバゲを作ってみた