スクラッチに挑戦している皆さん、どうも!スクラッチコーチです。
- ① まず2Dマップを動き回れるようにしよう!
- ② さっそく3D化しちゃおうぜ!
- ③ 壁にスキマがあって敵から丸見え!?やっば
- ④ 陰影をつけて立体感マシマシにしよう
- ⑤ トゲトゲやユガミを補正してハイクオリティ3Dの一歩を踏み出そう(爆速オンライン3Dゲームの作り方 #05)
- ⑥ 壁の衝突判定の基本を作ろう(いまここ)
- ⑦ 壁に触れてると進めない!?移動を改善しよう
- ⑧ ついに敵が現れた!距離感の計算ってどうやる?
- ⑨ 奥行きを実装して壁の後ろに隠れられるようにする
- ⑩ エンティティに陰影をつける
- ⑪ 敵がプレイヤーに向かって迫ってくるように実装する
- ⑫ スターを実装しよう!
- ⑬ 爆速3D爆誕
- ⑭ 壁に画像(テクスチャ)を貼り付けてリッチな3D空間を演出する
- ⑮ テクスチャの壁を洗練させて本格3D完成!
- ⑯ シメだ!モバイル & オンライン化をするぞ
- ⑰ 【おまけ】敵がプレイヤーを見つけたら追いかけるロジック
ゴンザレスからの挑戦状
![](https://ok-scratch.io/wp-content/uploads/2024/03/3e4c0ee0efaaa0380907d8a9c8bf0449.png)
そういえば壁はすりぬけちゃう状態だったね!これじゃあまともに歩き回れないぞ!
今回の目標「壁の衝突判定を作る」
![ok-scratch](https://scratch.coach/wp-content/uploads/2022/12/soylatte-e1717210866337.png)
今回の手順は、グリフパッチさんのオリジナルの動画だと最初に作り込むところなんだ。僕は先に3D化を急ぎたかったから後回しにした。その都合上、スクショがちょっと古い。具体的には背景が真っ黒で、3Dの壁は映ってない。ただまぁ実装に違いはないから、スクショの背景が真っ黒なのは気にしないで進めてほしい。
マップを見えるようにしておく
このあとの処理でいったん見えるようにしといたほうが便利なので修正しておくね。
![](https://ok-scratch.io/wp-content/uploads/2024/03/cbd3843c4dda95ed699c96d87c8a63f5.png)
幽霊をゼロにセットしよう。
![](https://ok-scratch.io/wp-content/uploads/2024/03/bc3fec2ea000decd4c705a74bb630efe.png)
壁の衝突判定を作る
スプライト「プレイヤー」を開く。
![](https://ok-scratch.io/wp-content/uploads/2024/03/9b3de696a5cf1159341b1160465be949.png)
![ok-scratch](https://scratch.coach/wp-content/uploads/2022/12/soylatte-e1717210866337.png)
レベルと同じようにプレイヤーも見えるようにしておこう!プレイヤーの幽霊も0にしておいてね。
定義「移動する」 を作る
引数に距離をもたせよう。スクショだと忘れてるけど「_移動する」って感じで最初にアンダースコア付けておくの推奨。
![](https://ok-scratch.io/wp-content/uploads/2024/03/f8f48b331ecdd00bcc500c789030f9d4-1024x808.png)
◯歩動かすブロックに引数を割り当てる。
![](https://ok-scratch.io/wp-content/uploads/2024/03/f858f505853607b5d815e19716d66e45.png)
上向き矢印と下向き矢印の処理を、この定義に置き換えよう。
![](https://ok-scratch.io/wp-content/uploads/2024/03/31e0e2a2f8f3e7cbe6a97865632fc35f.png)
定義側に条件ブロックを追加する。
![](https://ok-scratch.io/wp-content/uploads/2024/03/bd37069d600877cdbe986363aabd2efe.png)
レベルに触れたら、っていう条件にして壁にあたったときの処理を作るよ。
![](https://ok-scratch.io/wp-content/uploads/2024/03/b6434f8cbf80033ef60306848dccb224.png)
シンプルに壁にあたったら進んだ分だけ下がるようにする。
![](https://ok-scratch.io/wp-content/uploads/2024/03/93837236a9ef69400c11a962e20fc1cf.png)
CHECK! 壁を通り抜けなくなったかテストしよう!
楽勝だね。
壁の衝突判定の基本ができて、壁をすり抜けなくなった。
埋もれを回避する
壁衝突判定はうまくいった。でもちょっとした問題の種が同時にうまれてしまった。↓これをみてほしい。
![](https://ok-scratch.io/wp-content/uploads/2024/03/8e9c22057663a3984f6f2db5d5b9d27e.png)
いまって場合によっては↑こんな感じで埋もれが発生してしまうんだ。これは2Dならそこまで問題ではないけど、3Dだと顔だけ壁の中に入るような状況が生まれることもある。これは事前に回避しておきたい。
そこであらかじめ作っておいたヒットボックスというコスチュームの出番だ。
ヒットボックスを利用する
定義「_移動する」の最初で、コスチュームをヒットボックスに着替えよう。
![](https://ok-scratch.io/wp-content/uploads/2024/03/7dc90a72f73de82253aa7c1263e69109.png)
回転方法を「回転しない」に変える。
![](https://ok-scratch.io/wp-content/uploads/2024/03/ac919537a0f99e6761c202628c868302.png)
処理の最後で、それぞれもとに戻すよ。
![](https://ok-scratch.io/wp-content/uploads/2024/03/646dabc9f7b57b8b9568dfbe32f10223-827x1024.png)
![ok-scratch](https://scratch.coach/wp-content/uploads/2022/12/soylatte-e1717210866337.png)
ヒットボックスのサイズは4 x 4で、プレイヤーのサイズは8 x 8だから、ヒットボックスに変えてから壁に衝突したか判定するほうが、より細かく壁との距離を測ることができる。結果的に埋もれなくなっているよ。もっともっと細かく衝突判定をする方法もあるけど、今はこれで十分だ。
CHECK! 壁に埋もれなくなったかテストする
おっけぃ!
まとめ
よし、これで移動の基本ができた。壁の衝突判定もできたし、埋もれも回避できた。
今回は以下のことができるようになったぞ。
- 壁に触れたら後退することで、すりぬけなくできた
- コスチュームを調整するだけでカンタンに埋もれ回避できた
よーしこれで動き回れるね!って、あれあれ、まだスクラッチキャットが進めずにいるぞ!次回もチェックしてみよう。
グリフパッチさんの動画を参考にしています
今回のチュートリアルは世界No.1スクラッチャーとして名高いグリフパッチさんの動画を参考にしているよ。ただし手順を一部変えているところもあるんだ。
- ① まず2Dマップを動き回れるようにしよう!
- ② さっそく3D化しちゃおうぜ!
- ③ 壁にスキマがあって敵から丸見え!?やっば
- ④ 陰影をつけて立体感マシマシにしよう
- ⑤ トゲトゲやユガミを補正してハイクオリティ3Dの一歩を踏み出そう(爆速オンライン3Dゲームの作り方 #05)
- ⑥ 壁の衝突判定の基本を作ろう(いまここ)
- ⑦ 壁に触れてると進めない!?移動を改善しよう
- ⑧ ついに敵が現れた!距離感の計算ってどうやる?
- ⑨ 奥行きを実装して壁の後ろに隠れられるようにする
- ⑩ エンティティに陰影をつける
- ⑪ 敵がプレイヤーに向かって迫ってくるように実装する
- ⑫ スターを実装しよう!
- ⑬ 爆速3D爆誕
- ⑭ 壁に画像(テクスチャ)を貼り付けてリッチな3D空間を演出する
- ⑮ テクスチャの壁を洗練させて本格3D完成!
- ⑯ シメだ!モバイル & オンライン化をするぞ
- ⑰ 【おまけ】敵がプレイヤーを見つけたら追いかけるロジック