スクラッチコーチキャンプ スクラッチで使える無料素材集
  • 素材
  • 修行
  • はじめての方へ
  • スクラッチゲームの作り方

    #003 右へ左へ!ネコのスケート

    #003 右へ左へ!ネコのスケート
    この記事は スクラッチコーチで掲載されているオリジナル記事 のバックアップです。
    スターター作品
    なし
    今回の完成サンプル
    なし
    [soy-series name="はじめてのスクラッチ"]

    さぁ、スクラッチでナニ作る!?

    「ずっと」と「もし端に着いたら跳ね返る」の2ブロックが組み合わさることで、追加の条件分岐を一切書かずにネコが自力で往復し続ける仕組みが完成している。この組み合わせに回転方法の制御を1行加えるだけで逆さになるという問題も解決できる。「端まで進む→向きを反転→また進む」という連鎖がループの中に閉じ込められた構造を、作り方から確認していこう。

    動画で見てみよう

    [talk]チャンネル登録して応援よろしく!チャンネル登録する[/talk]

    チュートリアルの元になった作品

    [prj-embed prj="neko-skating-loop" mini="1" title="プレイしておこう" prj-title="complete" prj-author="ok-scratch"]今回の[prj-link prj="neko-skating-loop" title="complete" author="ok-scratch"]スクラッチを作る参考作品[/prj-link]です。[/prj-embed]

    今回の目標

    旗をクリックするとネコが動き出し、ステージの左右を自動で往復し続けるスケートアニメーションを作ります。端に着いたら跳ね返る動きと、回転方法の設定でネコが逆さにならないようにする実装も行います。

    スターター作品をリミックスしよう

    このチュートリアルにはスターター作品があります。使わなくても大丈夫だけど、最低限の素材などが用意されてるので便利です。
    スターター作品をダウンロード

    #1スタート位置の設定

    [talk class="m-l-n"]前回は座標を使ってネコを正方形に動かしたよね。今回は、ネコがステージの上を左右にスケートし続ける動きを作っていくよ。[/talk]

    イベントgreenflag が押されたときはもうおなじみだね。続けて動きx座標を ( ) 、y座標を ( ) にするでx座標0、y座標-100の位置に移動させよう。ステージの真ん中より少し下あたりが、スケートのスタート地点になるんだ。

    [talk]Scratchのステージは横が-240〜240、縦が-180〜180の座標で管理されてるよ。x座標0・y座標0がステージのど真ん中。y座標をマイナスにするほど下に移動するから、-100はちょうど地面っぽい位置になるんだ。スケートリンクの上を滑ってる雰囲気を出すには、この座標選びが地味に大事だったりするよ。[/talk]

    #2ずっと動き続ける

    スタート位置が決まったから、次はネコの動きだよ。制御ずっとを使うと、中に入れたブロックが止めるまでずーっと繰り返される。前回は1回実行しておしまいだったけど、「繰り返し」を使えばネコは自分でスケートし続けるんだ。

    ループに入る前に動き回転方法を ( ) にするで回転方法を「左右のみ」にセット。ループの中では10歩ずつ前に進んで、動きもし端に着いたら、跳ね返るで端に着いたら自動的に方向転換するよ。回転方法を設定しないと、跳ね返ったときにネコが逆さまになっちゃうから、忘れないでね。

    [talk]「ずっと」ブロックは、プログラミングの世界で「無限ループ」って呼ばれる仕組みの一種。ゲームやアニメーションも、裏側ではこの無限ループで画面を何度も更新し続けているよ。赤い停止ボタン🛑を押すとすべてがストップするから、終了のタイミングは自分で決められるんだ。[/talk]

    次回はコスチュームを使って、スプライトの見た目を変えていくよ!

    確認プレビューしておこうという口コミを寄せてくれた方 確認プレビューしておこう
    旗を押すとキャラクターが左右にスケートし続けて、端に着いたら跳ね返るようになったね。

    まとめ

    「ずっと」ブロックを使うだけで、ネコが自動でスケートし続けるアニメーションが完成したね!繰り返しのブロックは一度マスターすると、ゲームやアニメーションのいろんな場面で活躍するよ。次回はコスチュームを使って、スプライトの見た目を変えていくよ!

    ブクマよろしくお願いします!という口コミを寄せてくれた方 ブクマよろしくお願いします!
    どんどん追記・更新していくので、ブックマークやシェアよろしくお願いします!