これが！初心者のためのプログラミング。
Scratch（スクラッチ）でプログラミングを学ぶ！
初心者がプログラミングを学ぶ！
私は2019年に職業能力開発促進センター（通称、ポリテク）に通っていました。
そのとき初学者向けのプログラミングの講義がありました。
そこで使われたのがプログラミング環境Scratch（スクラッチ）です。
- アメリカのMIT（マサチューセッツ工科大学）メディアラボで開発された。
- 無料で利用できる。
- インストール不要、Webブラウザから利用できる。
- プログラミング言語を覚える必要はなく、ブロックを積み上げて視覚的にプログラミングができる。
注）『Scratchは、MITメディア・ラボのライフロング・キンダーガーテン・グループの協力により、Scratch財団が進めているプロジェクトです。https://scratch.mit.edu から自由に入手できます。』
Scratchは子供が楽しくプログラミングをして、アニメーションやゲームなどを作って共有するために作られています。
なので、パソコンにあまり触れたことがない人がこれからプログラミングを一から学ぶ場合、
最適なプログラミング環境かと思います。
今回はスクラッチを使って学んだプログラミングの講義について説明していきます。
Scratchを使って学習する目的
ポリテクではScratchをつかって簡単なプログラミングをしました。
主な目的はプログラミングに慣れることやプログラミングの処理の流れを理解することでした。
簡単なプログラムを作成し、キーボード操作などで画面上の「スプライト」という名前のScratch上のキャラクターや画像を動かせるようにしました。
初学者にとってプログラミングを勉強すると聞き慣れない用語が出てきます。
例えば「順次処理」や「分岐処理」や「繰り返し処理」、「比較演算」や「論理演算」、「入れ子（ネスト）」があります。
文字でなんとなく意味はイメージできそうですが、この用語がどのような意味を持つのか、Scratchを使いながら学習していきました。
Scratchの利用方法
Scratchの利用方法について書いていきます。
そんなこと知ってるよ。という方は飛ばしても大丈夫です。
まずWebブラウザソフトで下記のサイトを開きます
ページ左上の「作る」をクリックします。
アカウントを作成してサインインすると自分の作ったプロジェクト（作品）が保存できたり自分が過去に作ったプロジェクトで遊ぶことなどができますが、サインインしなくてもScratchは使うことができます。
今回はアカウント作成、サインインの箇所は割愛します。
ページ左上の地球儀のマークから言語を選択できます。「日本語」を選択しましょう。
画面の見方
次にScratchのコードの画面について簡単に説明です。
①「ブロック」
プログラムに使う部品置き場
②「スクリプトエリア」
プログラムを組み立てる場所
③「ステージ」
スプライト（キャラクターや画面）が動く場所
④「スプライトリスト」
スプライト（キャラクターや画像）の座標、向き、大きさ等の情報
⑤「背景」
背景の選択等の管理をする場所
プロジェクトを作る
プロジェクトを作る
新しいプロジェクト（作品）を作ります。
画面左上の「ファイル」を選択し、「新規」をクリックすると新規プロジェクトが作成できます。
プロジェクトを保存する
作成したプロジェクトはコンピュータに保存できます。
画面左上の「ファイル」を選択し、「コンピュータに保存」をクリックすると作成したプロジェクトに名前をつけてコンピュータに保存できます。
プログラムの作り方
基本的な操作
ここでは基本的な操作を説明します。
Scratchは基本的に「ブロック」から「スクリプトエリア」にブロックをドラッグ＆ドロップで移動させること。そしてそのブロックを積み上げてプログラムを作っていきます。
基本操作の説明のために、ちょっこっとスプライト（黄色い猫）を動かしてみます。
はじめに、プログラムが実行される操作（エントリーポイント）となるイベントブロックをおきます。
イベントは様々な操作から選ぶことができます。
イベントのブロックをドラッグ＆ドロップしてスプライトエリアに置きます。
上図で選んだブロックは画面の「旗」をクリックされたときがプログラム実行のきっかけとなります。
次に動きブロックをイベントブロックの下にドラッグ＆ドロップで置きます。
動きブロックの数値はキーボードで入力することができます。
上図では「x座標を-120」「y座標を200」に入力しています。
緑の旗のアイコンを押すと「実行」されます。
なんか端っこの方にスプライトが移動しましたけど、、、
自分の組み立てたプログラム通りにスプライトが動いてくれました！！
スプライトの座標
上図ではスプライトが隠れるようなところに移動しましたが、
ここではスプライトの座標についてです。
初期の状態ではスプライトは画面の中央（０，０）に位置しています。
横の位置はー２４０〜２４０の範囲のｘ座標
縦の位置はー１８０〜１８０の範囲のｙ座標で表されています。
ですので、上図で入力した座標「x座標を-120、y座標を200」にするとy座標が180を超えているので実行結果のようにスプライトが上の方にはみ出すということです。
スプライトの向き
ここではスプライトの向きについての説明です。
通常でスプライトは右側を向いています。つまり９０度の向きです。
１２時の方角から時計回りに１８０度は分かりやすいのですが、
反時計回りはー１度〜ー１７９度となっています。
真下にくると１８０度になります。なんか変な感じですけど、、、
スプライトを左側を向かせたい場合は、ー９０度にすると左側を向きます。
これをー９０度にすると、、、えい！
向き変更！！、、、、っておい！！！！！
、、、なんか頭でイメージしたものと違う。確かに左側向いているけど、、、
私はこの瞬間プログラミング挫折しかけました。
でも大丈夫です！向き変更の目盛りの下に「自由に回転」、「左右のみ」、「回転しない」のいづれかを選択するアイコンがあります。
画像では「自由に回転」のアイコンが青くなって有効を表しています。
今回は「左右のみ」に変更！
はい、「左右のみ」のアイコンが青くなり、回転せずに左に向き変えることができました。
プログラムの初期化
プログラムの初期化の設定をしましょう。
プログラムを開始するときは、スプライトの初期位置や向きの設定を最初に記述する必要があります。
初期化をしないと、以前に実行した状態でプログラムが開始してしまい、正しいプログラムが動作しません。
上図のプログラムは「旗」のアイコンを押すとスプライトが画面を時計回りに画面の隅を移動します。
赤枠で囲んでいる「x座標を-180、y座標を120にする」が初期化です。
初期化以降のプログラムでスプライトが画面を時計回りに画面の隅を移動します。
もし、初期化がないとプログラムは動くかもしれません。
しかし、プログラム開始時のスプライトの位置によりプログラムの動きは毎回異なることになります。
プログラムを何回実行しても同じ動きになるには初期化の設定が必要です。
キーボードによる操作
キーボード操作でもスプライトを動かせます。
上図のプログラムでパソコンの上下左右キーを押したときの動きをプログラムしてみました。
それぞれのキーを押すと座標が変わります。左右キーについては向きも変わります。
「旗」のアイコンを押して初期化後、上下左右キーを押すとスプライトがそれぞれ上下左右に動きます。
動きはぎこちないですが、矢印キーで動くのを確認できると嬉しいですね。
小学校の頃ドラクエやってたこと思い出しました。
構造化プログラム
構造化プログラミングとは「順次」、「分岐」、「繰り返し（反復）」の３つの制御構造によって処理のプログラムを記述する考え方です。
「順次」、「分岐」、「繰り返し（反復）」
「順次」、「分岐」、「繰り返し（反復）」について簡単に説明します。
順次
プログラムを上から下へ順番に実行する。
分岐
条件分岐によって異なる処理を実行する。
Scratchでいうと分岐のブロックは制御のカテゴリーにある。
「もし〇〇なら〇〇する」
「もし〇〇なら〇〇する、でなければ□□する」
繰り返し（反復）
条件によって同じ処理を繰返し実行する。
Scratchでいうと繰り返しのブロックは制御のカテゴリーにある。
「〇〇回繰り返す」
「〇〇まで繰り返す」
「ずっと繰り返す」
比較演算と論理演算
構造化プログラミングには「順次」、「分岐」、「繰り返し（反復）」があるということが分かりました。
「分岐」、「繰り返し（反復）」の処理に関しては、条件の判定をすることがあります。
そのためには演算をしなければなりません。
その演算には比較演算と論理演算があります。
比較演算
「＞（以上）」、「＜（以下）」、「＝（同値）」を使って
指定した数が基準値より大きいのか、小さいのか、同値かを判定します。
論理演算
比較演算などとの組み合わせによって、より複雑な条件式をつくることができます。
「○かつ□」、「○または□」、「○ではない」があります。
ITの勉強するとよく出てくる「AND」、「OR」、「NOT」というものです。
分岐、繰返し（反復）は演算と組み合わせて使おう
上記で記載した「分岐」、「繰り返し（反復）」と「比較演算」、「論理演算」は組み合わせてプログラミングをしたりします。
「分岐」と「比較演算」の組み合わせの一例をScratchのブロックで表すと以下のようなものになります。
上記のプログラミングでは緑の旗が押されたとき、向きの判定が行われます。
向きの数値が０を未満の場合、スプライトは向きを９０度に変えて、「こんにちは！」と言う。
（trueの処理）
向きの数値が０を以上の場合、スプライトは「こんにちは！」と言う。
（falseの処理）
演算結果が「正」であれば「tureの処理」が、
演算結果が「誤」であれば「falseの処理」が
実行されます。
「tureの処理」と「falseの処理」は同時に実行されません。
分岐と演算を使ってプログラミングした例
上記の分岐処理と演算を使ってスプライトが画面の上下左右の端にきたときに反対側から現れるようにします。
- 上の端に行ったら下から現れる。
- 下の端に行ったら上から現れる。
- 右の端に行ったら左から現れる。
- 左の端に行ったら右から現れる。
もし興味あればScratchでプログラムを追加してみてください。
これで上に行ってｙ座標が１８０を超えたら下から現れる。下にいた場合はその逆。
右に行ってｘ座標が２４０を超えたら左から現れる。左の場合はその逆。
ができました。
上図のように画面の端までくると反対側から出現。
分岐処理と演算ってこういうときに使うんですね、、、
入れ子（ネスト）構造
入れ子とはある構造のなかに同じ構造が含まれているものをいいます。
Scratchで表すと下図のようなものです。
条件分岐「もし〇〇なら」の中に同じ構造が2つはいっています。
入れ子（ネスト）構造は複雑な条件の分岐を作るために使われます。
しかし、入れ子が何重にもなっていると、プログラムをみる他の人にとって分かりづらいものになってしまうという点もありますので注意しましょう。
入れ子（ネスト）を使ってプログラミング例
入れ子（ネスト）を使ってプログラミングをしてみます。
矢印キーの同時押しをすると、後に押したキーが有効になります。
例えば、右矢印キーを押した後に上矢印キーを押すと、斜め上には行かず上に移動します。
- 上矢印キーと右矢印キーを同時に押した場合、右斜め上に移動する。
- 上矢印キーと左矢印キーを同時に押した場合、左斜め上に移動する。
- 下矢印キーと右矢印キーを同時に押した場合、右斜め下に移動する。
- 下矢印キーと左矢印キーを同時に押した場合、左斜め下に移動する。
繰り返し処理「ずっと」の中に分岐処理「もし」を入れ、矢印キーが押されたときの動きを追加します。
スプライトの追加
スプライトの追加
スプライトは追加できます。
デフォルトで黄色い猫が表示されていますが、画面の右下の「スプライトを選ぶ」から追加できます。
今回はボールを追加してみます。
スプライトのコスチューム
スプライトのコスチュームはデフォルトでいくつか用意されています。
左下のコスチュームの追加を押すと、自分でコスチュームを作成して追加することが出来ます。
コスチュームを変更する
キーボード操作などと合わせてコスチュームの変更をするとスプライトの動きに変化を与えることができます。
下のプログラムでは左右のキーを押すたびにコスチュームが変更されます。
キーを押すたびにコスチューム１とコスチューム２が交互に変わるので、走っている様な動きになります。
メッセージ
あるスプライトから別のスプライトにメッセージを送ることができます。
メッセージを使うことによって別のスプライトの動作を開始させたりすることができます。
- センダー・・・メッセージを送る側
- レシーバー・・・メッセージを受け取る側
送ったメッセージは自分自身でも受け取ることができます。
このように不特定多数のスプライトにメッセージを送ることをブロードキャストといいます。
今回は例として猫がボールに触れたときに、ボールから猫にメッセージを送って猫を動作させます。
ボールが猫（スプライト１）に触れたとき、ボールからｘ座標を変えながら「メッセージ１」を送るようにします。
猫は「メッセージ１」を受け取ると「えい！」と言うようにプログラミングします。
すると、猫（スプライト１）がボールにふれるたびに
ボールは右側に移動し、
猫（スプライト１）はボールにふれるたびに「えい！」と言う。
メッセージを使うと複数のスプライトの動作を連動させることができます。
乱数
乱数とは
Scratchでは乱数を使うことができます。
乱数とはランダムな数字のことです。
Scratchでは範囲を決めて乱数を生成することが出来ます。
乱数の範囲は任意で決められます。上の図のブロックだと「１〜１０」までの数字がランダムに生成されます。
乱数を使ったプログラミング例
以下の条件で、乱数を使ってプログラミングしてみます。
- ボールが上から１個ずつ落ちてくる。
- ボールが落ちてくる高さは一定。
- ボールが落ちてくる左右の場所はランダムなところから落ちてくる。
- ボールが下の端に触れたらボールは消える。
- ボールが猫に当たると右端にボールが飛んでいく
というわけでこんな感じで乱数使ってみました。
こんな感じにしてみました。
ボールは左右ランダムなところから一個ずつ落ちてきて、下に落ちると消えます。
また、猫に当たって右の方に飛んでいって端に触れても消えます。
ｘ座標がプラスの落ちるボール
ｘ座標がマイナスの落ちるボール
猫に当たって右に向かうボール
はい。簡単ではあるんですが、乱数の使用例でした。
変数
変数とは
最後に変数を使ってプログラミングをしてみます。
Scratchでは変数を使用できます。
変数とは簡単に言うと「値を入れておける箱」でその箱に名前をつけたものです。
箱に値を入れたり、その箱の値を取り出したりできます。
ちなみに変数はプログラムのどこからでも使える「グローバル変数」と
特定の範囲内でのみ使える「ローカル変数」があります。
正直、私は高校時代に数学を捨てたので、変数の意味がはじめ全く分かりませんでした。
「ｘとかｙみたいなものだよ」と一言で説明され、
引きつった苦笑いで誤魔化していました。
実際に、使用例を考えてみると少しずつ理解できたことを覚えています。
変数をつかったプログラミング例
それでは簡単に以下の条件で、変数を使ってプログラミングしてみます。
- 変数ははじめ０である。
- 上から落ちてくるボールに猫が触れたら変数が１ずつ増える。
- 変数は得点として画面の左上に表示される。
「変数を作る」を選択。
任意の変数名を入力。
今回は「猫の得点」で、
範囲は猫のスプライトのみを選択。
緑の旗が押されたとき、変数「猫の得点」の初期化と表示をします、
ボールに触れてメッセージを受けると変数が１ずつ増えるようにしました。
自分で好きなものを作る
上記の基本的な使い方を学んだら、最後はScratchで好きなものを作るのが良いと思います。
実際、ポリテクでも自分で考えたゲームや動画を作っていました。
一見、簡単そうなのですが、やってみると意外と自分の思い通りに動かないものです。
その様な時間はなかなか苦しいのですが、原因を理解し、問題解決したときはやはり嬉しいです。
子供用に作られたプログラミング教育のツールですが、一からプログラミングを学ぶ人が触れるものとしてもとても良い教材だと思います。
実際にポリテクの他の訓練生はＷｅｂの無料素材をダウンロードして、シューティングゲームを作ったり、ピアノの音当てゲームを作っている人もいました。
インプットも大事ですが、悩みながらアウトプットするのも大事なんだなと思った講義でした。
興味ある方は是非Scratchに触れてみてください。
コメント