【特別編#16】軽量版 & オンラインマルチプレイヤー対応 & モバイル対応する方法

スクラッチに挑戦している皆さん、どうも！スクラッチコーチです。

今回の目標「モバイル＆オンライン対応」

前回までで３Dチュートリアルは完成したと言っても過言ではない。今回はプラスアルファの仕組みを整えてチュートリアルの締めにしたい。

といってもちょっとした追加じゃない。モバイル対応とオンライン対応というゴリゴリにゲーム品質に関わる改修作業になるぞ！

作業としては次の通り！

• テクスチャを使うモードと、使わない軽量化モードを切り替えられるようにする
• バックパックを経由してモバイル対応を行う
• バックパックを経由してオンライン対応を行う

さぁ、行こう！

軽量モードを作る

せっかくテクスチャを利用して画像を壁に貼り付けることができたけど、元々の色で塗りつぶす壁のほうが軽量であることは確かだ。ユーザーのパソコンのスペックによっては、テクスチャだと重たいという人もいるかもしれない。そこで、軽量モードを用意してユーザーが選べるようにしておこうと思う。

ステージを開こう。

いくつか変数を作るよ。

変数「★軽量モード」「■はい」「■いいえ」を作る

初期化しよう。■は定数として扱うので、ゲーム開始後は値を変えないよ。

そしてlエルキーが押されたとき、★軽量モードを「■はい - ★軽量モード」にしよう。

これはトグル処理というんだ。

• 軽量モードがはい（=1）なら「1 - 1 = 0」になる
• 軽量モードがいいえ（=0）なら「1 = 0 = 1」になる

電気のスイッチみたいにオンとオフを切り替えるような動きになる計算方法だよ。

スプライト「レイキャスター」を開こう

定義「_シングル・レイ」を見つけて。

↓コレみたいに、変数「★軽量モード」が「■はい」のときは、（以前実装してあった）色で壁を塗り塗りする処理を作って最後に「このスクリプトを止める」を置いておこう。

スプライト「ペン」を開こう

定義「_行を描画する」を見つけて。

さっきみたいに、軽量モードならペンの明るさや色を変更する処理を書いて最後に「このスクリプトを止める」ブロックを置こう。

軽くなったかテストしよう

さっそく緑の旗を押してlエルキーでモードをトグルしてみようか。

軽量モードにしたらFPSが30とかになってる様子が分かるね！これでカクカクし始めちゃっても一瞬で軽量モードを選択できるから低スペックのデバイスで遊んでる人でも安心だね。

モバイルに対応する

モバイル対応していく！ここは別チュートリアルで作ったジョイスティックを利用する。

バックパックを経由してスティックを借りよう！

まだ作ったことがない人も完成プロジェクトから借りてくることができるから安心してほしい。

借りる！

1. このプロジェクトを開こう！
2. 中を見るを開くよ。
3. 画面下部の「バックパック」をクリックして開いておこう
4. スプライト「スティック」をバックパックにドラッグアンドドロップしよう。

使う！

よし、じゃあ今作ってる3Dのプロジェクトに戻ってみよう。

バックパックを閉じたり開いたりすると更新されて、今追加した「スティック」が表示されるぞ。それおスプライトのところにドラッグアンドドロップしよう！

おーけい！

スプライト「プレイヤー」を開こう

さてスティックを動くように少し調整しようか。

定義「_プレイヤーティック」の「もし」ブロックを置換するよ。

左がAFTERで、右がBEFOREになってるので、参考にして置換作業を進めてほしい。

スティックで動けるようになったかテストしよう

おおぉ！カンタンにモバイル対応できたね。これでパソコンでもモバイルでも楽しめるスクラッチゲームが完成した。

モバイル対応しておけばベッドでゴロゴロしながらでも電車に乗りながらでもデバッグできる♪

お次はシメだ。

オンライン化する

オンライン化してマルチプレイでゲームを楽しめる地盤を作ろう。

バックパックから借りてくる

これもバックパックを利用して作っていくぞ。

借りる！

このプロジェクトを開いて、スプライト「クラウドプレイヤー」をバックパック化しよう。

さっきと同じように3Dのプロジェクトのスプライト一覧に追加しておいてね。

クラウドプレイヤーに対応する

プレイヤーを開こう！

緑の旗が押されたとき

緑の旗が押されたときに、「クラウド - セットアップを送って待つ」を置こう。

定義「_プレイヤーティック」

定義「_プレイヤーティック」にも３つブロックを追加しよう。

クラウドプレイヤーを開く

クラウドプレイヤーにいくつか処理を追加していくぞ。

マップ表示を切り替えるを受け取ったとき

新たにメッセージを受け取ったときブロックを追加するよ。これは単にマップ表示の処理だけだね。

エンティティの計算をするを受け取ったとき

さらにクラウドプレイヤーの位置を調整するための処理を追加しよう。

定義「_画面を回転させる」

クラウドプレイヤーの位置を調整する処理の続きだね。

定義「_描画する」

さらに続き。クラウドプレイヤーの描画処理だ。

クローンされたとき

緑の旗が押されたとき

タイプには４を指定しておく。これはクラウドプレイヤーのコスチューム番号を意味しているぞ。だから人によっては４じゃないかも。

スプライト「ペン」を開こう

コスチュームを追加する

コスチュームにはとりあえずスクラッチキャットを採用するぞ。コス名はなんでもOK。ここではCloudPlayerクラウドプレイヤーにしておいた。

ナノとか他のエンティティと同じように枠に合わせてずらしておこう。影も付けておくといいよ。

マルチプレイができるかテストしよう

画面をいくつか並べて同期が取れているか確認してみよう。

いーーーやっほーーー！（マリオっぽく叫ぼう）

まとめ

どうだった？ここまで来れたかな？！

軽量化、モバイル化、オンライン化、さまざまな山を乗り越えて3Dゲームのエンジンができあがった。コレを使って自分なりの3Dゲームを作れることを願っている！

ちなみに僕もこれを利用して3D逃走中を作ったから見てみてほしい♪

スクラッチでプレイする ターボワープでプレイする

3D逃走中

by ok-scratch

[my-voice title="ok-scratchさんの作品"]

ハンターのロジックは実は改造してあって、単純にプレイヤーに向かってくるだけじゃないんだ。プレイヤーがハンターの視野に入ったら襲ってくるようになっているし、間に壁があれば気づかれないような実装にもなっている。「プレイヤーがハンターの視界に入ったら」というロジックを考えるのが楽しかった。けっこう応力の効く実装だと思うので興味があったら中を見てみてね。

[/my-voice]

グリフパッチさんの動画

このチュートリアルは世界No.1スクラッチャーとして名高いグリフパッチさんの動画を参考にしているよ。ただし手順を一部変えているところもあるんだ。