- スターター作品
- なし
- 今回の完成サンプル
- なし
さぁ、スクラッチでナニ作る!?
グライドとランダムワープを1ループで交互に組み合わせる設計が光っている。移動時間・x座標・y座標の3パラメータすべてに乱数を与えているため、毎回まったく異なる動きが連続する。滑らかに移動した直後に瞬間ワープするという緩急が、座標移動の2つのアプローチを対比させる教育的な仕掛けになっている。この組み合わせでどんなコードになっているか、作り方を見ていこう。
動画で見てみよう
[talk]チャンネル登録して応援よろしく!チャンネル登録する[/talk]チュートリアルの元になった作品
[prj-embed prj="scratch-cat-random-warp" mini="1" title="プレイしておこう" prj-title="sb3_20260421152254" prj-author="ok-scratch"]今回の[prj-link prj="scratch-cat-random-warp" title="sb3_20260421152254" author="ok-scratch"]スクラッチを作る参考作品[/prj-link]です。[/prj-embed]今回の目標
スターター作品をリミックスしよう
このチュートリアルにはスターター作品があります。使わなくても大丈夫だけど、最低限の素材などが用意されてるので便利です。
スターター作品をダウンロード
#1スタート位置の設定
[talk class="m-l-n"]まずはネコのスタート位置を決めるよ。旗を押したら、ステージの真ん中から始まるようにしよう。[/talk]準備
スプライト「ネコ」を開く
| スプライトについて |
|---|
| ランダムな位置に移動し続けるネコのスプライト。コスチュームを交互に切り替えてアニメーションする。 |
| どんな役割か |
| ネコをランダムな場所にぴょんぴょん動かすよ!コスチューム2枚を交互に切り替えてアニメーションさせながら、画面中を自由に飛び回るんだ。旗を押したらずっと動き続けるぞ! |
実装
[talk]Scratchのステージは数学の座標平面と同じ仕組みで、中心が(0, 0)、右に行くほどxが増えて上に行くほどyが増える。だから座標(0, 0)に移動するってことは、ど真ん中に戻すってこと。ゲーム開始時にキャラを決まった位置に戻す「初期化」は、どんな作品でも使う定番パターンだよ。[/talk]
#2ずっとループで移動
[talk class="m-l-n"]ここからがメインの仕組みだよ。ネコが画面中をランダムに動き回るんだけど、「すーっと滑る動き」と「パッと瞬間移動」の2種類を組み合わせてるのがこの作品のポイントなんだ。[/talk]ずっとループの中で、まず( ) 秒でx座標を ( ) に、y座標を ( ) に変えるを使ってランダムな座標へ滑らかに移動するよ。移動時間(0.5〜1.0秒)・x座標(-180〜180)・y座標(-120〜120)の3つすべてに乱数を使ってるから、毎回まったく同じ動きにはならないんだよね。
#3ランダム移動
[talk class="m-l-n"]到着した瞬間に「どこかの場所」へワープして、コスチュームも切り替わるよ。ちなみにグライド先の座標をステージの全範囲(-240〜240 × -180〜180)より内側に収めてあるのは、ネコが画面の端で見切れないようにするため。もし内側に収めなかったら、ネコの体が半分だけ画面の外にはみ出してしまうんだ。[/talk][talk]普通、キャラクターを移動させるときはグライドか瞬間移動のどちらか片方だけを使うことが多い。でもこの作品では、1回のループで両方を連続で使ってる。すーっと滑った後にパッとワープするから、次の動きが予測できない面白さが生まれるんだ。この「緩急」をつける発想は、ゲームのキャラクターを生き生きさせるテクニックとしても使えるよ。[/talk]
まとめ
グライドとワープを組み合わせるだけで、こんなに面白いネコのアニメが作れたね!乱数をいろんなところに使えば、毎回違う動きになるのが最大のポイントだよ。ステージのx・y座標の仕組みも実感できたかな?ゲームやアニメ作りの基本「初期化+ずっとループ」はこれからも使えるから覚えておいてね!