隠されたブロックはscratchでブロックパレットに表示されないブロックです。ここでは主にTurbowarpの隠されたブロック集に入っているのを紹介します。

ブロック

選ばれている物に触れると動きます。

これらは全て動きません。

変数のような物です。

何も起きません。ブロックを付けることはできません。

音量が10以上だと動きます。

一斉に動きます。

（）の間繰り返します。

入力したリンクのwebサイトを表示します。(youtube,scratch,turbowarpなどは使えない。)

書いたHTMLのコードが実行されます。

ページを表示したり隠したり閉じたりできます。

現在機能しません。

値が大きいほどページが小さくなります

ページの高さ、横幅を変更します。デフォルトは360×480です

falceにするとページのクリックやスクロールができなくなります。

McUttils(マックユーティリティーズ)はTurboWarpの拡張機能です。ネタで作られた拡張機能なので実用性はないです。

使い方

黄色い場所がtureならマネージャーで、falseならマネージャーではありません。

空白の部分に入力した言葉を出力します。

「動いて」ならfalseを出力し、「壊れて」ならtureを出力します。

空白に入力した言葉を出力します。

まず拡張機能を選択します

つぎに、「ペンを下ろす」ブロックをいれます。

その後そのスプライトをプログラムで動かします。

これで、ペンは使えます。

ブロックの紹介

それぞれのブロックを紹介します。

全部消す

これは書いたペンをすべて消します。

スタンプ

これはクローンのようにそのスプライトと同じ姿をスプライトのばしょにうつし出します。

ペンを下ろす

発動させると、スプライトの動いたところにペンが書かれます。（「ペンを上げる」を使わないと、この状態は解除できない）

ペンを上げる

ペンを下ろす状態を解除させる。

ペンの色を○○にする

ペンの色を変える。

ペンの太さを○○にする

ペンの太さを変える。

応用

アニメーションテキストとは？

アニメーションテキスト（Animated Text）は、Scratchチームが開発したScratch LabやTurboWarpなどで使える拡張機能の一つです。

この拡張機能を使うと、プログラムの中で表示するテキスト（文字）に、動きや特殊効果を簡単に追加して、生き生きとさせることができます。つまり、ただの静的な文字ではなく、文字自体をスプライトのように扱ってアニメーションさせることができます。ただし、Scratchでは使うことができません。

使い方(Scratch Labの場合)

1.最初のページの右側にある「Animated Text」と書かれているボタンを押します。

2.「Try it out」と書かれているボタンを押します。

3.使うことができるようになりました。

使い方(TurboWarpなどの場合)

1.コード画面で拡張機能のボタン(図で矢印で指している場所)を押します。

2.スクロールするとこのような拡張機能があるので押します。

3.使うことができるようになりました。

ブロックの説明

スプライトをテキストに変えて表示します。

アニメーション付きで文字が表示されます。レインボーの他にも文字を打つように出てくる

タイピングやだんだん大きくなって表示されるズームがあります。

文字になっているスプライトを戻します。

フォントを変えます。

テキストの色を変えます。

テキストの幅を変えたり寄せることができます。

完成版を動画で見る

アンダーテールは、アメリカ人の作曲家兼ゲーム開発者であるトビー・フォックス氏によってほぼ一人で開発されました。100万本以上の売り上げを記録した人気の作品です。こんなゲームが作れるようになりたいですね。

作品の全体像を確認する

主なスプライトと役割

このゲームで重要なスプライトについて説明します。

① スプライト「フレーム」の役割

スプライト（ハートと敵の攻撃）が、フレームの外に出ないようにするために用意します。

② スプライト「ハート」の役割

ハートは、プレイヤーのことです。上下左右に移動して、敵の攻撃から逃げます。敵の攻撃に当たるとHP が減っていき、ゼロになると「ゲームオーバー」になります。

③ スプライト「敵の攻撃」の役割

敵の攻撃を3種類作成します。

プログラミングをしよう

まずは、元になる作品をリミックスします。コスチュームや音などの素材が入っているよ。

https://scratch.mit.edu/projects/947360061/

scratch.mit.edu

①「フレーム」をプログラミング

コスチューム

プログラムの流れ

フレームの範囲を設定するだけです。

プログラムの中身

(1). フレームの範囲を設定

「x座標の上限」、・・・、「y座標の下限」といった変数は、「すべてのスプライト用」で作成します。ハートや敵の攻撃といったスプライトでも、この変数を利用したいからです。

サトシ先生

設定する値は、フレームの位置やサイズによって異なります。みんなの作品に合わせてくださいね。

ポイントを解説

フレームは、箱のようなものです。ハートが箱の外に出ないように、範囲を指定します。そのために、x座標の上限と下限、y座標の上限と下限を利用します。上限や下限を超えて移動しようとしたときに、超えないようにプログラム（移動前の位置に戻す、など）します。

②「ハート」をプログラミング

コスチューム

プログラムの流れ

左に移動する、上に移動する、下に移動する、の処理は記載していません。右に移動する、とほとんど同じなので省略しています。

プログラムの中身

(1). 最初の状態を設定

(2). 上下左右の移動

(3). 敵の攻撃に当たったとき

ポイントを解説

サトシ先生

上下左右の移動について詳しく解説します。

右に移動するときのプログラムを考えます。まず、x座標とはスプライトが横方向のどの位置にいるかを表すものです（y座標は縦方向の位置を決めるものです）。

右に移動するときに大事なのは、フレームの右端から出ないようにすることです。フレームの右端は「x座標の上限」の値です。

ハートが 「x座標 = 185」の位置にいたとします（上図）。 この状態で右に移動すると、x座標が 10 変わるので「x座標 = 195」になります。これは「x座標の上限」を超えた値、つまりフレームからはみ出した状態です。フレームからはみ出さないように、「x座標 = x座標の上限（190）」に戻します。

上に移動するときは「y座標の上限」、下に移動するときは「y座標の下限」、左に移動するときは「x座標の下限」を使います。

③「敵の攻撃」をプログラミング

サトシ先生

敵の攻撃は3種類あります。ここでは「トリエルの攻撃2」について詳しく見ていきましょう。

コスチューム

コスチューム名：1

コスチューム名：2

コスチューム名：3

プログラムの流れ

プログラムの中身

最初の状態

攻撃する

ポイントを解説

「トリエルの攻撃2」のポイントは、クローンを作ったときに次の 3つのスクリプトが実行されることです。

• 見た目を変えるためのスクリプト
• 左右に揺れるためのスクリプト
• 画面の下に落ちていくスクリプト

これを一つのスクリプトにまとめようとすると大変です。処理の内容ごとにスクリプトを分けると、難しい動きも簡単にプログラミングすることができます。

④ その他のスプライト

トリエル

コスチューム

プログラムの中身

上矢印

コスチューム

プログラムの中身

下矢印

コスチューム

プログラムの中身

右矢印

コスチューム

プログラムの中身

左矢印

コスチューム

プログラムの中身

トリエルの攻撃1

コスチューム

コスチューム名：1

コスチューム名：2

コスチューム名：3

プログラムの中身

トリエルの攻撃3

コスチューム

コスチューム名：短い骨

コスチューム名：長い骨

プログラムの中身

結果

コスチューム

コスチューム名：ゲームクリア

コスチューム名：ゲームオーバー

プログラムの中身

よくある質問

Q1. フレームの枠からズレて移動しています

コスチュームが中心に配置されていないためだと思います。下図のように、①「コスチュームの x座標と y座標の値を 0」にして、②「画像を中心に移動」させてみてください。

まとめ

サトシ先生

完成した作品は後日公開します。

【はじめに】完成した作品を見る

フルーツの進化の順序は次の順番にしました。

　「イチゴ」⇒「リンゴ」⇒「バナナ」⇒「スイカ」

動画で確認する

コードの中身を確認する

主なスプライトと役割

① プレイヤー

「次に落とすフルーツを選ぶ」と「フルーツを落とす」の２つのブロック定義を作成します。

「緑の旗が押されたとき」、ブロック定義「次に落とすフルーツを選ぶ」を実行して見た目を変えます。プレイヤーが「地面に落ちるフルーツ」のいずれかと当たったらゲームオーバーとします。「プレイヤーが押されたとき」、表示されているフルーツを落とします。

② 地面に落ちるフルーツ

下図の赤枠の部分は、フルーツをどこに表示させるかというコードです。同じ種類のフルーツ同士が当たって進化する場合は、フルーツ同士が当たった場所に進化後のフルーツを出現させます。プレイヤーが上から落とすフルーツの場合は、「プレイヤー」のいる位置にフルーツを出現させます。

青枠の部分は、地面に触れるまで下に落ちていくコードです。落ちながら、他のフルーツに触れるかどうかチェックしています。もし触れた場合は、「このスクリプトを止める」を実行して、下に落ちるのを止めています。

下図は、フルーツの進化に関するコードです。進化する場合は、「進化前のx座標」と「進化前のy座標」に今のフルーツの座標を保存します。進化後のフルーツの最初の位置は、保存した座標にします。

下図のコードは「リンゴ」のスプライトのコードです。「リンゴ」同士に触れたかどうか確認し、進化する場合は、「バナナのクローンを作る（赤枠内の一番したのブロック）」ようにしています。「イチゴ」や「バナナ」、「スイカ」のスプライトもほとんど同じコードですが、何に触れたか、といった条件や進化するフルーツが変わります。

【詳しく】プログラムの解説

① プレイヤー

プレイヤーのコスチュームは、下図の赤枠内の３つ（イチゴ、リンゴ、バナナ）用意します。

② 地面に落ちるフルーツ

サトシ先生

ポイント①：同じ種類のフルーツに触れたかどうかのチェックは下記の記事が参考になります。

自分のスプライト（クローン）との当たり判定をチェック

今日のポイントスクラッチのバグ？を利用するサトシ先生自分のスプライトとの当たり判定をチェックしたいときってありますよね。実はスクラッチのバグを利用すると簡単にできるんですよ。問題点スクラッチには、自分自身に当たったかどうかを判定するブロック...

scratch.earth-shop.net

2023.12.06

サトシ先生

ポイント②：進化を重複して実行しないように、「進化する？」という変数を使います。「進化する？＝No」のときだけ進化の処理をします。進化の処理をする際、初めに「進化する？＝Yes」に変更することで、次の処理は進化の処理を実行しないようにしています。

【やってみよう】プログラミング

リミックスしよう

下記のプロジェクトをリミックスして、スイカゲームを完成させよう！コスチュームは全て用意しているよ。穴埋めになっているプログラムを、解説などを参考にして埋めていこう。難しい場合は、「コードの中身を確認する」に答えがのっているよ。

https://scratch.mit.edu/projects/938067660/

scratch.mit.edu

まとめ

サトシ先生

完成した作品はこちらです。

https://scratch.mit.edu/projects/935309542/fullscreen/

scratch.mit.edu

サトシ先生

自分のスプライトとの当たり判定をチェックしたいときってありますよね。実はスクラッチのバグを利用すると簡単にできるんですよ。

問題点

スクラッチには、自分自身に当たったかどうかを判定するブロックがありません。下図を使って説明します。

ネコ（Cat）のスプライトで、自分自身と当たったかどうかを判定したいとします。自分のスプライトと当たったかどうか判定するために、「●に触れた」ブロックを使います。

青枠内の中からスプライトを選ぶのですが、「ネコ」のスプライトが存在しません。このように、自分自身との当たり判定をチェックするブロックはないのです。

解決策

しかし、解決策があります。「ネコ」のコードの中に、「ネコに触れた」というブロックはないのですが、他のスプライトのコードの中には「ネコに触れた」というブロックがあります。なんと、そのブロックをネコのスプライトにコピーして使うのです。

まず、ネコ以外のスプライトを選択します。ここではスイカを選択しました。スイカの中には、「ネコ（Cat）に触れた」というブロックがあります。

このブロックを、ドラッグ＆ドロップやコピー＆ペーストするなどして、ネコのスプライトにコピーします。

こうすることで、ネコのスプライトの中になかった「ネコに触れた」ブロックが使えるようになります。

まとめ

クローンには、次の３つのポイントがあります。ひとつずつ丁寧に解説していきます。

同じスプライトを画面に複数表示させたいときに使う

クローンを実行すると、クローンしたスプライトと同じものが画面上に表示されます。

「クローン」というボタンを押すと、「ネコ」のスプライトがクローンされるように作りました。コードは次のようになります。

「クローン」ボタンのコード

上図のように別のスプライトのクローンを作ることもできますし、自分自身のクローンを作ることもできます。

「ネコ」のスプライトのコード

クローンは同じ場所に作られるので、下記のようにクローンされたら「どこかの場所へ行く」ようにしました。こうすることでクローンが作られたことが分かりやすくなります。

まとめ：同じスプライトを画面に複数表示させたいときに使う

クローンを利用すれば、敵キャラクターをたくさん増やしたり、アイテムをいくつも画面上に並べたりすることができます。

クローンは同じスクリプトを実行する

「ネコ」のスプライトのコード

「ネコ」のスプライトに、下記のようなコードを追加しました。「ネコ」のスプライトが押されたときに「x座標」を2秒言ったり、上や下の矢印キーを押すとその向きに移動するようなコードです。

実行結果

「ネコ」のクローンを複数作って、このコードを実行してみました。

動画の動きを確認しましたか？すべてのクローンが上に移動したり、下に移動したりしていますね。

まとめ：クローンは同じスクリプトを実行する

コードは、クローンごとに複数作成する必要はありません。みなさんが今までやってきたように、スプライトに対してコードを作成していけばいいのです。

クローンごとに変数を持つことができる

概要

「クローンごとに変数を持つことができる」とはどういうことでしょうか。

実は、先ほどの「② クローンは同じスクリプトを実行する」で使っています。答えは、ネコの「x座標」です。「x座標」は、ネコの位置を決める変数です。クローンごとに「x座標」を持つことができるので、色々な場所にクローンを置くことができるのです。

もし、「x座標」がクローン全体で共有する変数だったとします。そうすると、あるクローンの「x座標」を変えたときにその他の全てのクローンも同じ「x座標」に移動することになります。

このように、クローンごとに値を持つことができる変数のことを「インスタンス変数」と呼びます。一方で、スプライト全体で共有して値を持つ変数のことを「グローバル変数」と呼びます。

スクラッチでクローンを使ったゲームを作る際に、この二種類の変数を使い分ける場面がでてきます。一緒に確認してみましょう。

変数の作り方

作成したクローンの総数を数えたいとき、クローンごとにその変数を持つ必要はありません。スプライト全体で共有したほうがいいですね。下図の赤枠のように「すべてのスプライト用」にチェックを入れて変数を作成します。こうすることで、「クローンの数」という変数はグローバル変数として使えるようになります。

次に、クローンを作っていった順に、クローンに番号をつけたいこともあります。この場合は下図のように、「このスプライトのみ」にチェックを入れて変数を作成します。これで、「番号」はインスタンス変数として使えるようになり、クローンごとに異な番号をつけることができます。

「ネコ」のスプライトのコード

ネコがクローンされたとき、「クローンの数」を1ずつ増やします。そして、「番号」の中身を「クローンの数」にします。こうすることで、ネコがクローンされる度にクローンの数が増えていき、ネコのクローンに「番号」を1から順に割り当てることができます。

実行結果

「番号」は、クローンごとにもつことができるインスタンス変数として作成しています。クローンごとに「番号」が割り当てられており、クローン自身の「番号」を表示します。

一方で、「クローンの数」はグローバル変数です。グローバル変数は、スプライト全体で共有して使う変数です。そのため、「クローンの数」を表示させると、どのクローンにおいても同じ値を表示していることがわかります。

まとめ：クローンごとに変数を持つことができる

インスタンス変数とグローバル変数の違いはわかったでしょうか。どちらがいい、どちらが悪い、ということではなく、その変数の使われ方に応じて適切な変数の種類を使えるようになることが大事です。

どちらにするか迷った場合はなるべくインスタンス変数（「このスプライトのみ」にチェックを入れて変数を作成する）を使うようにしましょう。理由が知りたい方は、「オブジェクト指向　カプセル化」といったキーワードでネット検索してみてください。

完成した作品を見る

初めの３回のジャンプは簡単に作ることができるのですが、カクカクとぎこちなくジャンプします。４～６回目のジャンプは連続した動きをするなめらかなジャンプをしますが、作るのが少し難しいです。

どちらの方法でも作れるようにトライしてみよう！

簡単なジャンプの作り方

プログラミングの流れ

フローチャートを使ってプログラミングの流れを示します。

プログラミングする

STEP①：ブロック定義を作る

「ジャンプする」というブロック定義を作ります。

STEP②：「ジャンプする」のプログラミング

フローチャートを見ながらプログラムを作成してみましょう。下図のようになると思います。

STEP③：「スペース」キーが押されたときにジャンプする

ここまでできれば、「ジャンプ」のプログラミングの完成です。「スペース」キーを押して、ジャンプするか確かめてみよう。

なめらかジャンプの作り方

プログラミングの流れ

フローチャートを使ってプログラミングの流れを示します。

プログラミングする

STEP①：ブロック定義を作る

「なめらかジャンプ」というブロック定義を作ります。

STEP②：「なめらかジャンプ」のプログラミング

フローチャートを見ながらプログラムを作成してみましょう。下図のようになると思います。

STEP③：「上向き矢印」キーが押されたときにジャンプする

「緑の旗が押されたとき」、このプログラムの初期値（地面のy座標の値）をセットします。「上向き矢印」キーを押すとどうなりましたか？最初に作った「ジャンプする」と動きを比べてみましょう。

まとめ

なめらかにジャンプする仕組みは、カクカクとジャンプするものとどう違うのでしょうか。

下図のように、ジャンプしたときにいつも同じ距離だけ移動するように作ると、カクカクとジャンプするようになります。直線的な動きになります。

次に、なめらかにジャンプする様子を下図に示します。ジャンプのてっぺん付近では、移動する距離が少なくなっています。また、落ちていくにつれて移動する距離が伸びていっています。前の図と異なり、曲線的になっているのがわかると思います。

このように、移動する距離を変化させることでなめらかで自然なジャンプをプログラミングすることができます。

サトシ先生

今回作成した作品はこちらです。

https://scratch.mit.edu/projects/927718629/fullscreen/

scratch.mit.edu