エンティティに陰影をつける（爆速オンライン3Dゲームの作り方 #10）

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

ゴンザレスからゲームクリエイターへの挑戦(ちょうせん)状(じょう)

遠(とお)くの敵(てき)が明(あか)るく見(み)えるのが不安(ふあん)みたいだね！なるほど、言(い)われてみればそうかもね。よし、陰影(いんえい)の処理(しょり)を改善(かいぜん)してみよう！

今回(こんかい)の目標(もくひょう)「エンティティに陰影(いんえい)をつける」

遠(とお)くのエンティティは暗(くら)く、近(ちか)づけば明(あか)るくみえるようなロジックを作(つく)っていくよ。前(まえ)に壁(かべ)でも同(おな)じようなことしたよね。さらにエンティティの足元(あしもと)にも影(かげ)をつくっていく。影(かげ)を作(つく)るとすこーし空間(くうかん)を圧迫(あっぱく)するような印象(いんしょう)があるので、天井(てんじょう)を高(たか)くして空間(くうかん)にゆとりも作(つく)っていくよ。コーディング目標(もくひょう)は主(おも)に３点(てん)。

• エンティティの遠近(えんきん)による陰影(いんえい)
• エンティティの足元(あしもと)の影(かげ)
• 天井(てんじょう)の高(たか)さ

ウォーミングアップ

まずはカンタンな作業(さぎょう)だよ。

デバッグしていた幽霊(ゆうれい)効果(こうか)を元(もと)に戻(もど)す

まずはプレイヤー。

幽霊(ゆうれい)の効果(こうか)を100に戻(もど)そう。

スプライト「レベル」を開(ひら)こう。

こちらも戻(もど)す。

続(つづ)いてスプライト「エンティティ」だ。

ここを100に戻(もど)す。

CHECK! 余計(よけい)なものが表示(ひょうじ)されてないかテストする

うん、すっきりしたね。

エンティティに陰影(いんえい)をつける

壁(かべ)のときに実装(じっそう)したように、遠(とお)くのエンティティは暗(くら)く、近(ちか)くなら明(あか)るくなるようにしてみよう。こうするとますます雰囲気(ふんいき)が出(で)る。こういう細(こま)かい演出(えんしゅつ)が高(こう)品質(ひんしつ)への道(みち)だ。

スプライト「ペン」を開(ひら)く

定義(ていぎ)「_エンティティをスタンプする」を見(み)つけて明(あか)るさ効果(こうか)を設定(せってい)しよう。

このゼロのところに距離(きょり)を考慮(こうりょ)した演(ひろし)算(さん)を入(い)れる。矢印(やじるし)を参考(さんこう)に作(つく)ってみて↓

↓これが完成形(かんせいけい)だよ。

CHECK! 遠(とお)くのエンティティが暗(くら)くなったかテストする

きっと↓こんな感(かん)じになってるはずだ。雰囲気(ふんいき)あるよね～。ホラーゲームっぽさがどんどん増(ま)してくｗ

定義(ていぎ)「_スポーンさせる」を作(つく)る

エンティティを表示(ひょうじ)させるための定義(ていぎ)を作(つく)っておくと便利(べんり)。

スプライト「エンティティ」を開(ひら)く

引数(ひきすう)「タイプ」でどのエンティティを表示(ひょうじ)するかを指定(してい)して、引数(ひきすう)「数(かず)」で何体(なんたい)表示(ひょうじ)させるかを指定(してい)するようにしておく。

とりあえず緑(みどり)の旗(はた)がおされたときに実行(じっこう)するようにしよう。数(かず)は25体(たい)くらいかな！ナノだらけになっちゃうけどねｗ

実装(じっそう)する

まず表示(ひょうじ)しようか。

変数(へんすう)「タイプ」を作(つく)る

この変数(へんすう)にそのまま引数(ひきすう)「タイプ」をセットする。

ループを置(お)いて、引数(ひきすう)「数(かず)」を回数(かいすう)に指定(してい)する。

この中(なか)で今回(こんかい)は適当(てきとう)に「どこかの場所(ばしょ)へ行(い)く」ブロックを置(お)いておこう。

壁(かべ)に埋(うず)もれないようにする

このままだと壁(かべ)の中(なか)にもエンティティがスポーンしたほうがいいので、それを回避(かいひ)するよ。「◯まで繰(く)り返(かえ)す」を置(お)こう。

少(すこ)し複雑(ふくざつ)な条件(じょうけん)式(しき)を作(つく)るから、先(さき)に↓こういう条件(じょうけん)ブロックを置(お)いてみて。

1つ目(め)の条件(じょうけん)には「レベルに触(ふ)れた」をはめよう。

２つ目(め)の条件(じょうけん)には「エンティティに触(ふ)れた」っていう条件(じょうけん)を入(い)れたいんだけど、スプライト「エンティティ」からはこの条件(じょうけん)が作(つく)れないんだ。これはスクラッチの仕様(しよう)だよ。そこでちょっと裏技(うらわざ)を使(つか)うね。

スプライト「ペン」を開(ひら)く

ここで「エンティティに触(ふ)れた」っていう調(しら)べるブロックを外(そと)に出(だ)して、スプライト「エンティティ」にドラッグアンドドロップしよう。

スプライト「エンティティ」に戻(もど)る

エンティティに戻(もど)って、いまドラッグアンドドロップされたブロックを２つ目(め)の条件(じょうけん)式(しき)に設置(せっち)しよう。

この中(なか)で「どこかの場所(ばしょ)へ行(い)く」ブロックを置(お)こう。こうすれば壁(かべ)の外(そと)にスポーンされるまで繰(く)り返(かえ)されるよ。

最終的(さいしゅうてき)にクローンを作(つく)ろう。

事後(じご)処理(しょり)として変数(へんすう)「タイプ」に空白(くうはく)をセットしよう。

最後(さいご)に「隠(かく)す」で終(お)わりだよ。

CHECK! ナノがたくさんスポーンされるかテストしよう

をををををぅ！敵(てき)が大量(たいりょう)に現(あらわ)れてしまったぁ！スクラッチキャットごめーんｗ

エンティティの足元(あしもと)に影(かげ)を作(つく)る

エンティティが浮(う)いてるように見(み)えるケースがあったので、足元(あしもと)に影(かげ)を作(つく)ろうと思(おも)う。

スプライト「ペン」を開(ひら)く

コスチュームを調整(ちょうせい)して影(かげ)をつけるよ。円(えん)を描(えが)こう。色(いろ)は黒(くろ)！

足元(あしもと)に楕(だ)円(えん)を描(えが)こう。

この影(かげ)を最(さい)背面(はいめん)にするよ。

そうすると足元(あしもと)に影(かげ)っぽいのができる。

CHECK! 影(かげ)が見(み)えるかテストする

っと、スクショが暗(くら)いｗ見(み)える？↓見(み)えないかもしれないけど、壁際(かべぎわ)にいるナノが浮(う)いて見(み)えるような現象(げんしょう)が起(お)きるケースがあったんだ。

壁(かべ)の描画(びょうが)ロジックを調整(ちょうせい)する

定義(ていぎ)「_行(ぎょう)を描画(びょうが)する」のところにいこう。

演算(えんざん)を作(つく)るよ。「高(たか)さ - (★解像(かいぞう)度(ど) / 2)」という演算(えんざん)だよ。

これをY座標(ざひょう)にセットしよう。

さらにその下(した)のY座標(ざひょう)のところも演算(えんざん)を割(わ)り当(あ)てる。ここは逆(ぎゃく)に「(★解像(かいぞう)度(ど) / 2) - 高(たか)さ」だよ。

CHECK! 壁際(かべぎわ)のナノが浮(う)いてないかテストする

うん、また暗(くら)いｗ

でもいい感(かん)じに壁際(かべぎわ)の描画(びょうが)が正(ただ)しくいってるよ！ひゅー！

天井(てんじょう)を高(たか)くする

Y座標(ざひょう)をいじったついでに、ちょっと天井(てんじょう)を高(たか)くしようと思(おも)う。今(いま)作(つく)った演算(えんざん)の高(たか)さを２倍(ばい)にしてみよう。

CHECK! 天井(てんじょう)が高(たか)くなったかテストする

おお！

かなりゆとりのある空間(くうかん)になったね。ちょっと高(たか)すぎるから２倍(ばい)じゃなくて1.5倍(ばい)にしとく。

まとめ

これで遠(とお)くにいるエンティティは暗(くら)くなった。きっとナノからも遠(とお)くのスクラッチキャットは明(あか)るく見(み)えなくなったはずだ。（知(し)らんけど）まぁ大丈夫(だいじょうぶ)！だって敵(てき)がいても動(うご)かないからね！動(うご)かない敵(てき)ならスクラッチキャットも安心(あんしん)してくれるでしょう。さぁ、自由(じゆう)にスターを探(さが)し回(まわ)ってくれ～……って、ん？おいおい、なんか敵(てき)が動(うご)き出(だ)してないか！？なんてこった！次回(じかい)もチェックしてみてくれ！

グリフパッチさんの動画(どうが)

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