今回描く背景
難易度
今回はスクラッチで３D背景の作り方を解説していきます。スクラッチのいろいろなプロジェクトを見ていると、ペンを使って３Dのゲームを作っている人をよく見かけますね。ペンを使った３Dはさすがに難しすぎるとあきらめている人も多いと思いますが、ひとつひとつ原理を理解できると、ちょっとした３Dゲームなら作れるようになります。思ったより簡単なコードで描けてしまうので、是非チャレンジしてみてください。
今回描く３Dの背景は以下のとおりです。壁の内側にネコとクマがいて空を鳥が飛んでいます。
なぜ壁にみえるのか？
ではこの画像がなぜ壁に見えるのでしょうか？
マリオ３Dワールド風ゲームの作り方でも解説した通り、モノは手前にあるほど大きく、奥に行くほど小さく見えます。また、手前にある方が色が濃く見えて、奥に行くほどぼやけて見えます。
今回作る壁をよく見ると茶色い線がずらっと並んでいて、左に行くほど大きく色が濃く、右に行くほど小さく色が薄くなっているのがわかります。そして、この線は９６本で構成されています。
３Dの壁を描くコード
では、実際に３Dの壁を描くコードを解説していきます。
今回、１本１本の線をペンで描いていくので、まず拡張機能でペンを追加しましょう。
ペンが準備できたらネコのコードに、以下のコードを書きます。（ネコに書く必要はありません）
距離リストについて
まず距離リストを作るというブロックについて解説します。距離リストは９６本、１本１本の配置される位置を決めるものです。正面からの距離になるので数値が小さければ小さいほど近く大きくなれば遠くなります。１本目の線が一番手前にあり、一番最後（９６本目）の線が一番奥にあるので、距離がだんだん離れていくようにリストを埋めていきます。
できたリストは以下のようになっています。
ペンで壁を描く
次にペンで壁を描くのブロックを解説します。ペンはペンをさげた位置からペンをあげた位置まで線が引かれます。ですので、先ほど作った距離リストに従い、近い方が色を濃く（明るさが小さい）、近い方が長くなるようにコードを書いていきます。リストに従い９６回ペンを上げ下げすれば今回の壁ができるということです。
さらに３D感を出す
ここまでだと、以下のような絵になっているはずです。
なんだか、３Dといわれれば３Dですが像の鼻を上から見たようにも見えます。これを３Dの壁と認識させるためには脳をだますための補足情報が必要です。
背景を描く
まずは背景を描きます。以下のように地面と空をグラデーションで作ります。地面も近いほど濃く、遠いほど薄いのでグラーデーションにしています。
そして、この背景の上に、壁を描いてみましょう。
ぐっと壁感が出てきたと思います。
キャラクターを配置する
さらに脳だますために、キャラクターを配置します。
適当なキャラクターを近くにいるほど大きく、遠くにいるほど小さく配置してみましょう。
そらに何かを飛ばすとより効果的です。これでほぼほぼ壁という認識ができるとおもいます。
キャラクターに影をつける
最後にだめ押しでキャラクターに影をつけます。影をつけると、人の脳は地面に設置しているとだまされます。以下のようにコスチュームに地面より少し濃い影をつけましょう。
同じようにクマにも影をつけます。鳥には影は不要です。そうすると以下のようになり完璧な３Dの絵になりました。
いろいろな壁を描いてみよう
ここまでできたら最後にいろいろな壁の描き方を紹介します。
つまりは、９６のリストに数字を入れていくとどんな壁でも描けるということです。次回の記事では、この壁を描くプログラムを使って巨大迷路を作っていきます。
