- ① 2Dマップを動き回れるようにしよう!
- ② さっそく3D化しちゃうぞ!
- ③ 壁にスキマがあって丸見えじゃん!敵にバレちゃう!
- ④ 部屋が不自然に明るすぎる!陰影を付けよう!
- ⑤ ズームすると空間がゆがんでグニャグニャになっちゃう!
- ⑥ 壁の衝突判定の基本を作ろう
- ⑦ 壁に触れてると進めない!?移動を改善しよう
- ⑧ ついに敵が現れた!距離感の計算ってどうやる!?
- ⑨ 奥行きを実装して真の三次元空間を創る
- ⑩ エンティティに陰影をつける
- ⑪ 敵がプレイヤーに襲いかかる(いまここ)
ゴンザレスからゲームクリエイターへの挑戦状
![](https://scratch.coach/wp-content/uploads/2024/03/ea6d9e0739703b796c2e65ea5a6e4e97.png)
敵は動かないから大丈夫、ヌルゲーだよ。楽勝楽勝……と思ってたけど、ゴンザレスが勝手に敵を動くようにコーディングしてしまったぞ!
こっちでも敵が動くように実装しないと、ゴンザレスの迷宮から強制的にアクセスが遮断されてしまう。仕方がない……敵を動くようにしよう!くッ、すまんスクラッチキャットぉ!(茶番w)
今回の目標「敵が動くようにする」
敵がプレイヤーに向かって動くようにする方法は、じつはとってもカンタンなんだ。
ということでここでは敵を動かす以外にも、新しい敵の追加方法を紹介したり、マップの操作についても改善していこうと思う。
- マップの表示・非表示を切り替える
- マップ上の敵の表示をカスタマイズする
- 敵を追加する
- 敵が動くようにする
- ヒットポイントを実装する
敵の種類を増やす
コスチュームを選ぶよ。
![](https://ok-scratch.io/wp-content/uploads/2024/03/2f2a21aa9a43061fc5d677a1330a83c7.png)
Frank-dを選ぼう。
![](https://ok-scratch.io/wp-content/uploads/2024/03/9025d54982c305bdca0715c69fcd36bd-1024x374.png)
さきにナノのコスチュームを開いて、大枠として使っていた透明の四角(と、あれば十字)を選択しよう。
![](https://ok-scratch.io/wp-content/uploads/2024/03/79f9e0afd2bf41304897f7620cf58156-1024x883.png)
コピーツールをクリックしておく。
![](https://ok-scratch.io/wp-content/uploads/2024/03/adf5efba9c35f3ea27d9c2468c29a158.png)
つぎにフランクを開いて、全選択しよう。
![](https://ok-scratch.io/wp-content/uploads/2024/03/6cba024ed450e73c77792db1b212b8dd.png)
選択した状態でグループ化をしておく。
![](https://ok-scratch.io/wp-content/uploads/2024/03/e066af809981d661a1e437afa93de43f.png)
グループ化できたら、さっきコピーしておいた大枠をペーストする。
![](https://ok-scratch.io/wp-content/uploads/2024/03/2c1528fd6c5f703ebb60a186011b3250.png)
いったん枠に線をつけよう。太さを3くらいにしておいて。
![](https://ok-scratch.io/wp-content/uploads/2024/03/83e00e20942d76be3fcb443217734f42.png)
↓こんなかんじに、フランクが枠内に収まるように調整しよう。
![](https://ok-scratch.io/wp-content/uploads/2024/03/395d72dffec5a48a1734cdc6eff9ac69.png)
![敵がプレイヤーに襲いかかる!ギャ〜!(爆速オンライン3Dゲームの作り方 #11)を語るok-scratch](https://ok-scratch.io/wp-content/uploads/2024/02/avatar_user_1_1708915454-96x96.jpg)
足元に影も作っておいて。影は枠からはみでていいよ。
最後に大枠の太さをゼロに戻して透明にしておく。
![](https://ok-scratch.io/wp-content/uploads/2024/03/a2f264c9622a0cebbdef37e3a512b3a9.png)
![敵がプレイヤーに襲いかかる!ギャ〜!(爆速オンライン3Dゲームの作り方 #11)を語るok-scratch](https://ok-scratch.io/wp-content/uploads/2024/02/avatar_user_1_1708915454-96x96.jpg)
この枠に収めておくと、足元が床にピッタリくっついてるように見えるんだ。
スプライト「エンティティ」を開く
![](https://ok-scratch.io/wp-content/uploads/2024/03/ce37d247aec46c61205ba50645ca1f08.png)
緑の旗が押されたときに、定義「_スポーンさせる」をセットしよう。
![](https://ok-scratch.io/wp-content/uploads/2024/03/6e43cac3584b3b85c02650eaa4af1a3a.png)
![敵がプレイヤーに襲いかかる!ギャ〜!(爆速オンライン3Dゲームの作り方 #11)を語るok-scratch](https://ok-scratch.io/wp-content/uploads/2024/02/avatar_user_1_1708915454-96x96.jpg)
フランクのコスチューム番号が2だから、タイプを2にしてるよ。何らかの理由でフランクのコスチューム番号が3とか4なら、ここは3とか4になるよ。
スプライト「ペン」を開く
![](https://ok-scratch.io/wp-content/uploads/2024/03/c4e9aea69325476f9f5100feb4fcdb65.png)
定義「_エンティティをスタンプする」でコスチュームにタイプを割り当てる。
![](https://ok-scratch.io/wp-content/uploads/2024/03/3a1178d914a9b524a75de4719a3a3fc2.png)
スタンプしない場合
タイプが空白のときもあるから、このときはスタンプをしないようにしよう。これやらないとナゾに1体敵が増えたりして困る。
![](https://scratch.coach/wp-content/uploads/2024/03/f64c025d5a5de8a9bfc7e6ba0a0612c4-1024x975.png)
描画の必要ない敵はスタンプしない
プレイヤーの視界に映らない敵もスタンプされないようにしよう。
ここに条件ブロックを追加だ。
![](https://ok-scratch.io/wp-content/uploads/2024/03/69074500e0fb6d0eddc2ce9f190290c6-562x1024.png)
以下の演算を作ろう。
![](https://ok-scratch.io/wp-content/uploads/2024/03/57c65b4e3c66593bed5aff773a367b31.png)
↓これ
![](https://ok-scratch.io/wp-content/uploads/2024/03/da913ace3157eb723f6f8e8fe830f78f.png)
条件式の左側にはめておけば、左右どちらかに見切れている敵はスタンプされないようになるぞ。
![](https://ok-scratch.io/wp-content/uploads/2024/03/577bf76630680c78836cf35e54e65b2d-1024x916.png)
スプライト「エンティティ」を開く
![](https://ok-scratch.io/wp-content/uploads/2024/03/056fc1767651954c72f046aab3e8e926.png)
定義「_画面を回転させる」で実行でも変数「タイプ」を描画時に使用する。
![](https://ok-scratch.io/wp-content/uploads/2024/03/5be98eaafa2b8250fae76426de495ab8.png)
ナノ以外にも敵を表示することができた
マップの表示・非表示を切り替えられるようにする
いままではデバッグとして変数をいじってマップを見えるようにしたり消したりしてたけど、ときどきマップを見えるようにすることは便利なのでショートカットを作っておきたい。
![敵がプレイヤーに襲いかかる!ギャ〜!(爆速オンライン3Dゲームの作り方 #11)を語るok-scratch](https://ok-scratch.io/wp-content/uploads/2024/02/avatar_user_1_1708915454-96x96.jpg)
ゲームによってはマップが見えちゃうとダメだったりするから、このショートカットは本番は無効化する必要があるかも。
ステージ「背景」を開く
![](https://ok-scratch.io/wp-content/uploads/2024/03/a2425dcf8c4ad40eba7df79bdf9c1230.png)
「緑の旗が押されたとき」を置こう。
![](https://ok-scratch.io/wp-content/uploads/2024/03/23d628e5ecd814713132fcb41b77ce80.png)
変数「マップ透明度」を作る
![](https://ok-scratch.io/wp-content/uploads/2024/03/6fecd4c7afcd12adf40633c002ba5e88.png)
マップ透明度を100にしておこう。
![](https://ok-scratch.io/wp-content/uploads/2024/03/f4981708d4f0a5fa49bcc22401bc9d8b-1024x357.png)
mキーが押されたとき、というブロックを置くよ。
![](https://ok-scratch.io/wp-content/uploads/2024/03/b4f96a953e9f57dae25b40cc5fef8af2.png)
ここでは「100 - ★マップ透明度」っていう演算を入れておく。
![](https://ok-scratch.io/wp-content/uploads/2024/03/9c279b4b35d5b813805a267b06f73db1-1024x273.png)
![敵がプレイヤーに襲いかかる!ギャ〜!(爆速オンライン3Dゲームの作り方 #11)を語るok-scratch](https://ok-scratch.io/wp-content/uploads/2024/02/avatar_user_1_1708915454-96x96.jpg)
これでmを押すたびに★マップ透明度の値が0になったり100になったり、いわゆるトグル(オンとオフが交互に切り替わる)状態になるよ。
メッセージ「マップ表示を切り替える」を作る
そして他のスプライトにもマップの透明度が変わったことを伝えるべくメッセージを作ろう。
![](https://ok-scratch.io/wp-content/uploads/2024/03/410588707880d54b2b7156ee6ef8465b.png)
mキーが押されたところで送ろう。
![](https://ok-scratch.io/wp-content/uploads/2024/03/ded3fb70d2a61bd4534d34263888fc48.png)
スプライト「プレイヤー」を開く
![](https://ok-scratch.io/wp-content/uploads/2024/03/9b3de696a5cf1159341b1160465be949.png)
メッセージ「マップ表示を切り替える」を受け取ったときに、幽霊効果に★マップ透明度を割り当てよう。これでプレイヤーが消えたり現れたりするようになる。
![](https://ok-scratch.io/wp-content/uploads/2024/03/e0f664ee5fdcf467be1bc0c7d0da7013-1024x381.png)
スプライト「レベル」にコピーする
で、このブロックをドラッグアンドドロップをするよ。
まずはスプライト「レベル」にドラッグアンドドロップしよう。
![](https://ok-scratch.io/wp-content/uploads/2024/03/1cc71c03789e31b3072cfef6a5979cab-1024x307.png)
スプライト「エンティティ」にコピーする
![](https://ok-scratch.io/wp-content/uploads/2024/03/ad450fe0fff7bd6fcd4f8bb52869a956-1024x305.png)
CHECK! マップの表示・非表示が切り替わるかテストする
便利!ナイス!これならちょっとはスクラッチキャットも敵から逃げやすいはず……w
マップの表示・非表示を切り替えられるようになった。
マップ上の敵のサイズを変える
ナノは小さい、フランクは大きい、っていう特徴があるので、マップ上でもナノとフランクのサイズと色を変える方法を紹介する。
スプライト「エンティティ」を開く
![](https://ok-scratch.io/wp-content/uploads/2024/03/94074911e58f4b5c44d064ca5e989c6b.png)
デバッグしやすいように改めて「ドラッグできるようにする」ブロックを置こう。これでマップ上で敵をつかめば強引に移動できるようになるよ。
![](https://ok-scratch.io/wp-content/uploads/2024/03/12a69fc341acdf21e18f30b1c10b6d39.png)
大きさを変えるブロックを、定義「_スポーンさせる」の直前に持ってきてみて。
![](https://ok-scratch.io/wp-content/uploads/2024/03/ebdd5ff98b8fa31800c18bf870a5d4d7.png)
↓こんなかんじ。
![](https://ok-scratch.io/wp-content/uploads/2024/03/d92ea2d4f10d7bcfe64c886ecc2c85df.png)
フランクをスポーンさせる直前でも大きさを変えよう。
![](https://ok-scratch.io/wp-content/uploads/2024/03/f57c4d0ba7f7c9c726eebfe86aa8f248.png)
CHECK! マップ上のサイズが変わったかテストする
↓これでマップ上のサイズが変わるぞ。Mキーを押して確認してみて。
![](https://ok-scratch.io/wp-content/uploads/2024/03/0d2f4c38bc9f527ac4410bb963a635ec.png)
マップ上の敵の色を変える
引き続きエンティティに変更をしていこう。
![](https://scratch.coach/wp-content/uploads/2024/03/1673712b4dbdd5d3176659a4e1e8eb05.png)
定義「_スポーンさせる」のところで色を変えてみよう。
![](https://scratch.coach/wp-content/uploads/2024/03/1b2b53993d31dcd687a4ac9451dc3730-738x1024.png)
これだけでマップ上のフランクの色が変わった。
![](https://scratch.coach/wp-content/uploads/2024/03/3c7ddc39e7d714efdd6ef2c47d322b3e.png)
![敵がプレイヤーに襲いかかる!ギャ〜!(爆速オンライン3Dゲームの作り方 #11)を語るok-scratch](https://ok-scratch.io/wp-content/uploads/2024/02/avatar_user_1_1708915454-96x96.jpg)
敵の強さで色を変えたりすればゲームがもっと面白くなる可能性があるよね!もちろんゲームの仕様にもよるけど。
マップ上の敵の色を変えることができた
敵を動かす
いよいよ敵を動かすよ……ゴクリ。
スプライト「エンティティ」を開く
![](https://ok-scratch.io/wp-content/uploads/2024/03/7b35be14ed2b8ccdf7148accd80dc4d5.png)
クローンされたときに、ずっとループが動くようにするよ。
![](https://ok-scratch.io/wp-content/uploads/2024/03/b2860044f214ce921fb6ed7bddf21166.png)
ここでプレイヤーへ向けるようにしよう。これで常に正面を向いてくれる。
![](https://ok-scratch.io/wp-content/uploads/2024/03/141016fcc2c86e1f4b9daf2629eecc9c.png)
そして0.5歩動くようにして、どんどんプレイヤーに迫ってくるようにしよう。
![](https://ok-scratch.io/wp-content/uploads/2024/03/bf87c27beb5bd2c6c217a0d88dcd67f1.png)
CHECK! 敵が迫ってくるかテストする
わー!これはやばいw
大ピンチすぎるw
でも敵が迫ってくる感じがめっちゃ楽しいことになりそうで……ワクワクっ!
でもまぁ、まだまだ改善の余地は残っているよね。
敵がプレイヤーに向かって動くようになった
敵が壁をすり抜けないようにする
いまはただ無作為に歩いてくるだけだけど、実は問題が隠れている。
たとえば上のショート動画を注意深く見ると分かるけど、敵の何体かは壁をすり抜けてプレイヤーに迫ってきているんだ。これはよくないね。
敵もしっかり壁で立ち止まるようにしたい。まずはこれを改善していこう。
スプライト「プレイヤー」を開く
![](https://scratch.coach/wp-content/uploads/2024/03/9121fcbe0ae74f1bbb3c447361d56faf.png)
定義「_移動値を計算する」を見つけて、スプライト「エンティティ」にドラッグアンドドロップしよう。
![](https://scratch.coach/wp-content/uploads/2024/03/f15fce8554c88ed774dc36344a76f55c-1024x519.png)
さらに定義「_移動する」をスプライト「エンティティ」にドラッグアンドドロップしよう。
![](https://scratch.coach/wp-content/uploads/2024/03/3e7157a82f6dbe49a25757b5e0196892-1024x724.png)
スプライト「エンティティ」を開く
![](https://scratch.coach/wp-content/uploads/2024/03/497dda70b93e4030be8fd984023d918e.png)
さっきコピーした定義「_移動する」をクローンされたときの「◯歩動かす」の代わりに設置しよう。
![](https://scratch.coach/wp-content/uploads/2024/03/27b3dfd69243cfa1fc824dc0757f3ad7.png)
CHECK! 壁をすり抜けなくなったかテストする
じつはこれだけで壁をすりぬけない移動が実現するんだ。テストしてみよう。
おっけい!カンタンだったね!
![敵がプレイヤーに襲いかかる!ギャ〜!(爆速オンライン3Dゲームの作り方 #11)を語るok-scratch](https://ok-scratch.io/wp-content/uploads/2024/02/avatar_user_1_1708915454-96x96.jpg)
前に作ったロジックをそのまま使って問題を解決しちゃうことをシステム開発では再利用するって呼んでて、現場では超重要視されている考え方なんだ。今回はそんな再利用を体験することができたと思う。これは大いなる経験だよ!
敵同士を重ならなくする
いまって敵同士が重なってしまって、ちょっとリアリティがない。壁をすり抜けないように、敵が別の敵をすり抜けたり重なったりしないように改善したい。
定義「_スポーンさせる」を見つけよう。
![](https://scratch.coach/wp-content/uploads/2024/03/293a628d33218e56c2711516bcb899bb-1024x243.png)
ここの「レベルに触れたまたはエンティティに触れた」の「または」の部分を右クリックして複製しよう。
![](https://scratch.coach/wp-content/uploads/2024/03/337469431f107ecdbd048de7e0343735-1024x517.png)
これを定義「_移動値を計算する」の条件ブロックの式と差し替えよう。
![](https://scratch.coach/wp-content/uploads/2024/03/4d8dbb5c00d64d408149e52e3f2d30f0-1024x475.png)
↓こんなかんじ。
![](https://scratch.coach/wp-content/uploads/2024/03/99798f759b68c3dbe2c5266d7f228d23-1024x632.png)
CHECK! 敵同士が重ならなくなったかテストする
よし、マップ上で重なってないことが確認できるね。
しかーし、じつはまだ問題が発生している。というか新しいバグが発生したんだ。
下のショート動画をチェックしてみて。敵同士が重ならないことで、触れ合っただけで詰まってしまう現象が起きるんだ。
敵同士が詰まって動けなくなる(スタック)状態……プレイヤーにとっては都合がいいけど、これだとゲームがカンタンになりすぎて面白くないよね。
敵がスタックしなくする
修正は言うほど難しくはないから安心してほしい。
定義「_移動する」から以下のブロックを取り外そう。
![](https://scratch.coach/wp-content/uploads/2024/03/1e5310e8a58e7af2a3150ca2ffdcd8bb.png)
↓こんな状態にして。
![](https://scratch.coach/wp-content/uploads/2024/03/8a66d9ad052c48820688faee6a66d91c-1024x424.png)
じつはこれだけでOK!
CHECK! 敵がスタックしなくなったかテストする
うっひゃー!敵がスムーズに迫ってくるぅ!これはやばいねw
ヒットポイントを実装する
敵が現れたからにはヒットポイントを実装しよう。ヒットポイントがゼロになったらゲームオーバーのメッセージを送るようにしておくよ。ここではゲームオーバーの動きは作らないから、ゲームによって自由に作り込めるようにメッセージだけ作っておく感じ。
スプライト「プレイヤー」を開く
![](https://scratch.coach/wp-content/uploads/2024/03/b8d5652c2083f82af47fcd92b30cbb4a.png)
定義「_プレイヤーティック」を見つけて。
![](https://scratch.coach/wp-content/uploads/2024/03/299a12b584edccccb5cfc5337950f9ee.png)
ここに条件ブロックを追加しよう。条件式には「エンティティに触れた」か調べるブロックをはめよう。
![](https://scratch.coach/wp-content/uploads/2024/03/f2c8e9daeea41fcf2ab0c35612baecda.png)
変数「★ヒットポイント」を作る
![](https://scratch.coach/wp-content/uploads/2024/03/a0d8f46c93b2850f2aa783ee1a8363d7.png)
エンティティに触れたらヒットポイントが減るようにするよ。
![](https://scratch.coach/wp-content/uploads/2024/03/ff56be16fe3d5e67c549eceac296f2b2.png)
さらに条件ブロックを追加しよう。
![](https://scratch.coach/wp-content/uploads/2024/03/3fd6e8d804e8fd096226243c0afeebc8.png)
ヒットポイントが1未満になったら、という条件式をはめる。
![](https://scratch.coach/wp-content/uploads/2024/03/087bebad05617457144dd98c17a7efb8.png)
メッセージ「ゲームオーバーです」を作る
![](https://scratch.coach/wp-content/uploads/2024/03/b893fc1cc32120196b843bfdb5d199d1.png)
条件ブロック内でメッセージを送ろう。
![](https://scratch.coach/wp-content/uploads/2024/03/090d2eb7fc95608340428842dd9a6d6c.png)
ヒットポイントはとりあえず100で初期化しておくよ。
![](https://scratch.coach/wp-content/uploads/2024/03/d334f4e66bb33056f12fcecff6fb9415.png)
CHECK! 的に触れるとヒットポイントが減るかテストする
……あ、ショート動画撮り忘れたw
でも敵にぶつかるとヒットポイントが減るはずだ、試してみてね!
まとめ
敵の種類を追加して、さらに敵がプレイヤーに向かって歩いてくるようになった。3D空間で敵を動かす方法は色んな人が疑問に思ってたはずだし、これを知りたかったという人も多いのでは?
今回は以下のことが実装できた。
- 敵の種類を増やすことができた
- マップの表示・非表示をショートカットでカンタンにトグルできるようになった
- マップ上のエンティティの表示(サイズと色)を変えることができた
- 敵をスムーズに移動させることができた
これだけでもゲーム性としては高くなってきたね。これに体力とか作って敵に触れたら減るようにして、体力がゼロになったらゲームオーバーみたいな感じにするだけで1つのゲームになるね。
敵は動くようになったけど、マップを見やすくしたし、スクラッチキャットならなんとかしてくれるよね!ピコの家宝にしてたスターを見つけて脱出してほしいところ。いよいよスターを実装させるタイミングがやってきた。次回もチェックしてくれ!
グリフパッチさんの動画
このチュートリアルは世界No.1スクラッチャーとして名高いグリフパッチさんの動画を参考にしているよ。ただし手順を一部変えているところもあるんだ。