【Scratch基礎】スクラッチで座標を学ぼう

はじめに

目次

https://risubibo.com/wp-content/uploads/2021/07/リスメガネ-300x300.png

こんにちは。リスメガネです。

今回から、小学生のお子さん向けに、Scratchでプログラミングを学ぶ上で必要な知識や概念をお伝えしていきます。

1回目の内容は、「座標を学ぼう」 です。座標は小学校高学年にならないと習わない範囲ですが、ゲーム作りには必須の知識です。Scratchの簡単な作例を交えてご紹介していきます。この例題では、完璧な理解の前に、座標に触れてみることを目的としています。教えかたや、教材作りの参考にしてください。

小学校低学年の子や未就学の子でも、Scratchで座標を理解できるようになる可能性は十分にあります。もちろん1発での理解は難しいですが、回数を重ねると感覚が身に付いてくるようです。

小学校低学年のお子様には、言葉の意味の説明や操作のサポートをしていただくとよいでしょう。
4年生以上のお子さんは、自分でこの記事の文章と写真をみて、例をまねして作ってみる、ということができると思います。

この章以降の本文では、お子さんも読めるよう、漢字には()でふりがなを記載していますのでご活用ください。(ブロック名には、そのままの名称で探せるように読み仮名を記載しておりません)

座標(ざひょう)って?

座標(ざひょう)とは、ものの位置(いち)をコンピューターに知(し)ってもらうための、考(かんが)えかたのことです。

たとえば、「女の子の手からボールがとんでいく」というアニメーション(うごきのある絵のこと)の
・座標(ざひょう)を使(つか)わないバージョン
・座標(ざひょう)を使(つか)うバージョン
この2つを作って、座標(ざひょう)を使うとどのように便利(べんり)なのか、確認(かくにん)していきましょう。

座標(ざひょう)をつかわず作ってみよう

背景(はいけい)とスプライトの準備(じゅんび)

プログラムをはじめる前(まえ)に、次のような準備(じゅんび)をしておきます。

  1. 背景(はいけい)は「Wall 1」を使(つか)います。

    右下の「背景を選ぶ」をおす

    右下の「背景(はいけい)を選(えら)ぶ」をおす

    Wall 1をえらぶ

    Wall 1をえらぶ

  2. スプライトは、ネコを消(け)して、「スポーツ」の中にいる、緑(みどり)の服(ふく)の女の子を選(えら)びます。

    右下の「スプライトを選ぶ」をおす

    右下の「スプライトを選ぶ」をおす(ネコは×をおしてけしておく)

    みどりのふくの女の子をえらぶ

    緑(みどり)の服(ふく)の女の子をえらぶ

  3. 同じ「スポーツ」の中にある、野球(やきゅう)のボールも使(つか)います。

    右下の「スプライトを選ぶ」をおす

    右下の「スプライトを選ぶ」をおす

    ボールをえらぶ

    ボールをえらぶ

  4. これらが出せたら、マウスで女の子をクリックしながら、女の子の足が地面(じめん)の左の線(せん)にぶつかるあたりに移動(いどう)させましょう。

    女の子をいどうさせる

  5. ボールの大きさは、画面(がめん)の「大きさ」の数字(すうじ)を50にして、少し小さくしておきます。

    ボールの大きさを50にする

  6. 女の子の手にボールをおきます。マウスをつかって、ボールを左のほうに移動(いどう)させましょう。

    女の子の手にいどうさせる

プログラムをはじめる合図(あいず)

さっそくプログラムを作ります。
まず、左のコードブロックを選(えら)ぶところから、黄色(きいろ)の「イベント」の中にある、「緑の旗が押されたとき」をコードエリアにもってきます。

「みどりのはたが押されたとき」をだす

ボールを動かす

次(つぎ)は、ボールが右に動(うご)くように、青の「動き」の中にある「10歩動かす」のブロックをもってきましょう。

「10歩動かす」をだすステージの上のみどりのはたをおす

たくさん動かす

緑(みどり)の旗(はた)を押(お)しても、少ししか動(うご)かないので、これをオレンジの「制御」にある、「10回繰り返す」で囲(かこ)みます。

「10回繰り返す」でかこむ

緑(みどり)の旗(はた)を押すと、さっきよりも長くボールが動(うご)いていきます。これで、右にヒューッとボールが動(うご)いていく様子(ようす)を作ることができました。

もう一度「旗が押されたとき」を押すと…?

もう一度(いちど)緑(みどり)の旗(はた)を押(お)したら、されにボールが右に移動(いどう)します。また女の子の手の位置(いち)からスタートするためには、マウスでボールを手の位置(いち)に移動(いどう)させなければいけません。これでは、旗(はた)を押(お)すごとに毎回(まいかい)マウスでボールを移動(いどう)させなければならないので、少し大変(たいへん)です。自動的(じどうてき)に最初(さいしょ)の位置(いち)に戻(もど)ってくれればいいのですが…。

みどりのはたをおすとボールがすすむ

座標を使って作ってみよう

座標を使って解決できる

さっきはわざわざマウスでボールを元の位置(いち)に戻(もど)さないと、手からスタートさせることはできませんでした。「座標(ざひょう)を使(つか)ったバージョン」も作って、自動的(じどうてき)に女の子の手からスタートさせるようにしてみましょう。
前(まえ)に出していたプログラムで、「旗が押されたとき」を残(のこ)して、あとの2つは消(け)しておきます。

「みどりのはたが押されたとき」をのこす

ボールが手にあるときの座標を調べる

先ほどと同じように、ボールをマウスで動(うご)かして、女の子の手の位置(いち)に置(お)きましょう。

女の子の手にいどうさせる

実(じつ)は、プログラミングの世界(せかい)では、画面(がめん)の全(ずべ)ての場所(ばしょ)に数字(すうじ)が割(わ)り振(ふ)られています。

ボールの今の位置(いち)の数字(すうじ)を調(しら)べてコンピューターに教(おし)えることで、自動的(じどうてき)に同(おな)じ場所(ばしょ)からスタートするようにできるのです。

その数字(すうじ)のことを、「座標(ざひょう)」といいます。

座標(ざひょう)には、横方向(よこほうこう)のことをいうための「X」(エックス)と、高さのことをいうための「Y」(ワイ)の2種類(しゅるい)があります。

ボールが女の子の手にあるときの座標(ざひょう)を調(しら)べるには、ステージの下にある、X(エックス)とY(ワイ)の横(よこ)にある数字(すうじ)を見ます。

X(エックス)は「-100」、Y(ワイ)は「20」くらいの数字(すうじ)になっているのではないでしょうか。

「-100」の数字(すうじ)の最初(さいしょ)についている棒(ぼう)は、「マイナス」と読(よ)みます。0よりも小さい数のことです。学校でまだ習(なら)っていない子もいると思いますが、天気予報(てんきよほう)で「-1度」「-5度」などという言葉(ことば)を聞(き)いたことはありませんか?「-」(マイナス)の後ろの数字が大きい方が、気温は低いのです。「-1」と「-5」では、「-5」のほうが小さい数字(すうじ)ということになります。ものの数を数えるときの0は「何もない」という意味(いみ)になりますが、気温(きおん)や座標(ざひょう)での0は違(ちが)います。気温(きおん)や座標(ざひょう)では、基準(きじゅん)を0と決めて、そこからどれくらい離(はな)れているかを数字(すうじ)で表しています。スクラッチの座標(ざひょう)では、真ん中が0になっていて、そこより下にあるもののY座標(ワイざひょう)には「-」(マイナス)がつき、真ん中(まんなか)より左にあるものはX座標(エックスざひょう)に「-」(マイナス)がつきます。

スクラッチでは、Xは一番(いちばん)左は-240、一番(いちばん)右が240です。Yは一番(いちばん)下が-180、一番(いちばん)上が180です。

スクラッチでは、Xは一番(いちばん)左は-240、一番(いちばん)右が240です。

X座標について

Xは一番(いちばん)左は-240、一番(いちばん)右が240

Y座標について

Yは一番(いちばん)下が-180、一番(いちばん)上が180

試しに、ステージの下のXとYの両方(りょうほう)に「0」を入力すると、ボールは画面(がめん)のちょうど真ん中(まんなか)に移動(いどう)しますね。

XとYを0にする

Xが200で、Yが-200だと、ボールは右下にいきました。

Xは200Yを-180にする

最初(さいしょ)の位置(いち)の座標(ざひょう)を決(き)める

X座標(ざひょう)とY座標(ざひょう)を実際(じっさい)にプログラムで使(つか)うには、専用(せんよう)のプログラムブロックを用意(ようい)します。

左の青い「動き」の中から、「X座標を○、Y座標を○にする」を持(も)ってきます。「どこかの場所へ行く」の下にあるブロックです。Xは「-100」、Yは「20」を入力します。もしわざとマウスでボールの位置(いち)をずらしても、緑(みどり)の旗(はた)を押(お)すと、必(かなら)ず手に戻(もど)るのが確認(かくにん)できますね。

「X座標を◯、Y座標を◯にする」をだして、すうじを入力する

ボールの座標(ざひょう)を少しずつ変える

右に動かすためには、ボールの座標(ざひょう)の数字(すうじ)を少しずつ変(か)えていくようにプログラムします。
ボールが右にとんでいくとき、高さはそのままで、右に移動(いどう)するので、横方向(よこほうこう)のことをコンピューターに教(おし)えることになります。

横方向(よこほうこう)については、Xを使(つか)うので、左から「X座標を○ずつ変える」をもってきます。数字(すうじ)のところに10と入っていれば、そのまま使いましょう。

「X座標を10ずつ変える」をだす

スクラッチでは、Xは一番(いちばん)左は-240、一番(いちばん)右が240とお伝えしました。

右にいくほど数字(すうじ)が大きいので、ボールの位置(いち)のX座標(ざひょう)の数字(すうじ)を増(ふ)やしていけば、右に移動(いどう)していくことになりますね。

「10ずつ変(か)える」というのは、今のX座標(ざひょう)を10ずつ大きくしていくことです。

緑(みどり)の旗(はた)を押(お)すと、少し右に移動(いどう)しました。また旗(はた)を押(お)すと、さらに少し右にいきます。みどりのはたをおすとボールが右にずれる

これをオレンジの「制御」にある、「10回繰り返す」で囲(かこ)み、旗(はた)を押(お)すと、右にヒューっと移動(いどう)しますね。

「10回繰り返す」で「「X座標を10ずつ変える」をかこむ」

手からスタートするかな?

緑(みどり)の旗(はた)をもう一度(いちど)押(お)したら、毎回(まいかい)女の子の手からボールが移動(いどう)するようになりました。

ボールが手のいちからスタートする

座標(ざひょう)を使(つか)ってコンピューターにボールの位置(いち)をきちんと教(おし)えることで、ボールの位置(いち)を一箇所(いっかしょ)に決めることができました。

最初(さいしょ)に座標(ざひょう)を使(つか)わずに作ったプログラムでは、コンピュータに最初(さいしょ)のボールの位置(いち)を教(おし)えていないので、ボールが右に移動(いどう)し続(つづ)け、女の子の手に戻(もど)ることはありませんでしたね。

ボールをマウスで戻(もど)すのも、手間(てま)がかかることではないと思(おも)うかもしれませんが、ゆくゆく車(くるま)のレースゲームを作るときはどうでしょう。

スタートの位置(いち)をプレイする人が勝手(かってに)に決めることができたら、すぐにゴールしてしまい、簡単(かんたん)でゲームとしてはあまりおもしろくなさそうです。

座標(ざひょう)を使わないとゴールの場所(ばしょ)を決めることもできません。

ゲーム作りには、座標(ざひょう)はほぼ必(かなら)ず使(つか)います。

ゲームを作る上で、キャラクターやものの位置(いち)を決めたりするほかに、位置(いち)によって決まったアイテムを表示(ひょうじ)させたり、何(なに)か特別(とくべつ)なことを起(お)こす条件(じょうけん)に使(つか)うこともできます。

おわりに

座標のことをなんとなくでもわかってもらえれば大丈夫です。まだプログラミングをしたことのないお子さんにとっては、座標に触れることは大きな一歩です。
ゲームを作りながら理解を深めて、いつのまにか深く考えなくても使えるようになっていけると思います。

関連記事

コメント

この記事へのコメントはありません。

リスメガネ
管理人:リスメガネ

北海道在住の新しいもの好きの会社員です。

学生時代、子供向けのプログラミング教室でデザイナーとレッスン講師をしていた経験があります。

このブログでは、プログラミングやデザインの作業過程や、作業の中で発生した困りごとの解決方法を紹介していきます。

最近の記事

  1. 【Googleマップ】マイマップで引いた線を編集する方法

  2. 【Chat GPT】Figmaのプラグイン×ChatGPTに関して

  3. 【Adobe Fresco】ピクセルレイヤーとベクターレイヤーの特徴

TOP