mywayなプログラミング生活ブログ

プログラミング関連の記事を書いています。作る様子がわかる様に動画も作っています。

Scratch2(スクラッチ2)の操作方法(エディタの使い方)3回目

myway@おじさんです。

前回の続きで、Scratch2(スクラッチ2)のエディタの使い方について書きたいと思います。

動作環境について(おさらい)

OS:MAC OS X(Windowsでも操作はほとんど変わりません)

エディタ:Scratch offline editor(ver.451)

画面構成(おさらい)

「Scratch offline editor」は以下の画面で構成されています。

f:id:mywayhaojisan:20161104141533p:plain

今回は、「ブロックパレット」と「スクリプトエリア」の操作方法を説明していきます。

 

ブロックパレット

f:id:mywayhaojisan:20161123135949p:plain

「ブロックパレット」は、3つのタブ(3種類の画面)があります。

 

スクリプト

f:id:mywayhaojisan:20161123140020p:plain

この画面には、処理ブロックというブログラムの部品があります。この処理ブロックを組み合わせる事で、プログラムを作成していきます。

 

・コスチューム

f:id:mywayhaojisan:20161123140104p:plain

ここは、スプライトや背景を、変えたり、書いたりする画面です。

スプライトリストのスプライトを選択している時は、「コスチューム」、 背景を選択している時は、「背景」に名前が変化します。

 

・音

f:id:mywayhaojisan:20161123140138p:plain

ここは、効果音やBGMを設定する画面です。

 

それぞれの操作方法について説明します。

スクリプト

スクリプトには、スプライトや背景で利用するための処理ブロックが用意されてあり、ここから処理ブロックを選んでプログラムを作成していきます。

f:id:mywayhaojisan:20161123140303p:plain

ここには、スプライトや背景で「なにをさせたいのか?」を、種類ごとにまとめた一覧が表示されています。

「動き」であれば、スプライトを動かしたり、回転させたりする処理ブロックがあったり、「見た目」であれば、スプライトを消したり、色を変えたりする処理ブロックがあったりします。

 

基本的な操作方法としては、処理ブロックを「スクリプトエリア」内にドラッグしてプログラムを作成していきます。

f:id:mywayhaojisan:20161123140356p:plain

ただし、処理ブロックを適当な位置にドラッグするだけでは、プログラムを作る事はできません。

f:id:mywayhaojisan:20161123140420p:plain

処理ブロックをドラッグする時に、他の処理ブロックとつなげる様にドラッグしていく事で、プログラムが作成できます。

ある程度の数(2〜3個でも構いません)の処理ブロックをつなげたら、その処理ブロックをクリックしてみて下さい。

f:id:mywayhaojisan:20161123140459p:plain

すると、その処理が実行され、ステージ上にその結果が表示されます。

(処理が動いている場合、周りに薄い色がつきます)

処理を停止させたい場合は、ステージの右上にある赤い丸をクリックすれば、停止します。

f:id:mywayhaojisan:20161123140533p:plain

 

それと、処理ブロックを実行する方法が、もう一つあります。

それは、ブロックパレット内の処理ブロックをクリックする事で、その処理ブロックだけですが、実行してくれます。

f:id:mywayhaojisan:20161123140613p:plain

例えば、「スプライトエリア」にあるスプライトをクリックして下さい。

次に、「動き」にある「10歩動かす」をクリックして見て下さい。

すると、ステージのスプライトが、移動します。

このように、クリックすることで、1つの処理ブロックの動作を知る事ができます。

もし、処理ブロックが、どんな動きをするのかが、わからなかったら、処理ブロックをクリックし、動きを見て下さい。

 

他の処理ブロックについては、たくさんあるので、ここでは省略します。 

 

スクリプトエリアの操作方法

次に、スクリプトエリアの操作について説明します。

f:id:mywayhaojisan:20161123140829p:plain

スクリプトエリアは、処理ブロックを置いて、プログラムを作成する場所です。

 

f:id:mywayhaojisan:20161123140906p:plain

ここは、スプライトの画像を表示しています。

ここを確認する事で、どのスプライトのプログラムを作っているか確認できます。

 

f:id:mywayhaojisan:20161123140929p:plain

ここは、スプライトを表示しているx座標とy座標の値が表示されています。

スプライトがどこに表示されているかを確認する事と、同じ画像のスプライトがあった場合、どのスプライトを使っているかの確認ができます。

 

f:id:mywayhaojisan:20161123140950p:plain

スプライトエリアの右下にある、この虫眼鏡のアイコンは、処理ブロックのサイズを変更します。

「-」は小さく、「+」は大きく、「=」は初期のサイズに変更します。

元のサイズは

f:id:mywayhaojisan:20161123141013p:plain

元のサイズから「-」を1回クリックした時

f:id:mywayhaojisan:20161123141024p:plain

元のサイズから「+」を1回クリックした時

f:id:mywayhaojisan:20161123141036p:plain

自分が見やすいサイズに変更する時に使って下さい。

ただし、サイズが変わるのは、全ての処理ブロックですので、1つだけ小さくしたりする事はできません。

 

次は右クリックした時の説明です。

・処理ブロックを右クリック

f:id:mywayhaojisan:20161123141108p:plain

処理ブロックを右クリックすると、このようなウィンドウが表示されます。

 

f:id:mywayhaojisan:20161123141140p:plain

処理ブロックを複製します。

ただし、この複製は、右クリックした処理ブロックから下の処理ブロックを全てコピーします。

例えば、以下の処理があったとします。

f:id:mywayhaojisan:20161123141202p:plain

「10歩動かす」を右クリックの「複製」をクリックした場合、「90度回す」も同時に複製します。

f:id:mywayhaojisan:20161123141246p:plain

ちなみに、画面上部にあるカーソルツールの「複製」でも同じ様に複製する事が可能です。

f:id:mywayhaojisan:20161123141306p:plain

使いやすい方を使って下さい。

 

f:id:mywayhaojisan:20161123141318p:plain

処理ブロックを削除します。

ただし、この削除は、右クリックした処理ブロックから下の処理ブロックを全て削除します。

例えば、以下の処理があったとします。

f:id:mywayhaojisan:20161123141202p:plain

「10歩動かす」を右クリックの「削除」をクリックした場合、「90度回す」も同時に削除します。

f:id:mywayhaojisan:20161123141350p:plain

ちなみに、画面上部にあるカーソルツールの「削除」でも同じ様に削除する事が可能です。

f:id:mywayhaojisan:20161123141406p:plain

使いやすい方を使って下さい。

それと、間違って削除してしまった時は、画面上部のメニューの「編集」-「削除の取り消し」をクリックする事で、削除したブロックを復活させる事ができます。

f:id:mywayhaojisan:20161123141432p:plain

復活させた時の注意点ですが、復活された処理ブロックは、削除した場所と同じ場所に復活されません。

復活される場所は、スクリプトエリアの一番上に復活します。

なので、下にスクロールさせていた場合は、見えないので、一番上にスクロールさせて下さい。

 

f:id:mywayhaojisan:20161123141502p:plain

処理ブロックにコメントを追加します。

f:id:mywayhaojisan:20161123141516p:plain

「add comment here...」の部分を消してから、書いて下さい。

簡単にですが、コメントの使い方について説明します。

・コメントサイズの変更

左上の三角をクリックする事で、コメントの表示サイズが変更できます。

f:id:mywayhaojisan:20161123141546p:plain

この様なコメントを書いて、左上の三角をクリックすると、

f:id:mywayhaojisan:20161123141558p:plain

と、なります。再度、三角をクリックすれば、元のサイズに変更できます。

コメントがじゃまな場合は、この機能を使って、サイズを変更して下さい。

・コメントの複製と削除

f:id:mywayhaojisan:20161123141627p:plain

コメントを右クリックする事で、「複製」と「削除」が表示されますので、複製したい場合は、「複製」、削除したい場合は「削除」をクリックして下さい。

・処理ブロックとの接続

次に、処理ブロックとの接続についてです。

コメントを追加した直後は、処理ブロックとのつながっている状態です。

なので、処理ブロックをドラッグして移動させた場合、コメントもいっしょに移動します。

また、コメントのみをドラッグで移動させた時は、コメントのみ移動します。

f:id:mywayhaojisan:20161123141706p:plain

つながっているかどうかを確認する方法は、処理ブロックとコメントの間に線が引かれているかを確認して下さい。

それと、コメントを間違って外してしまったり、別の処理ブロックにつなげたい場合があると思います。 その場合、コメント上部の色が濃い部分を、つなげたい処理ブロックの上にドラッグで移動させる事で、つなげる事ができます。

f:id:mywayhaojisan:20161123141735p:plain

※コメントについて

コメントはプログラムを実行する時には、何も影響はありません。 ただし、人間から見た場合、処理の内容を判断するための重要な内容となってきます。 例えば、1ヶ月後や1年後に見返した時、作った時と同じ様に覚えているかというと、そうでない場合が多く、覚えていたとしても、あいまいな内容しか覚えていない事が多いです。 なので、コメントを書いておけば、あとで役に立ちます。

 

スクリプトエリア内で処理ブロックがない場所を右クリック

f:id:mywayhaojisan:20161123141811p:plain

処理ブロックが無い場所を右クリックすると、このようなウィンドウが表示されます。

 

f:id:mywayhaojisan:20161123141832p:plain

この機能は、処理ブロックの配置を自動で整理してくれる機能です。

例えば、たくさんの処理を作っていくと、いろいろな場所に置くと思います。

そうすると、あちこちに処理があり、どこに何があるかわからなくなります。

そこで、この機能を使って整理する事ができます。

ただし、処理の関係性を無視して整理するので、利用する時は、注意が必要です。

 

f:id:mywayhaojisan:20161123141944p:plain

この機能は、処理ブロックの「コメントを追加」と同じ機能ですので、ここでは省略します。

 

コスチューム

f:id:mywayhaojisan:20161123142024p:plain

この画面は、コスチュームや背景を設定したり、編集する画面です。

左上のアイコンから説明していきます。

 

新しいコスチューム

f:id:mywayhaojisan:20161123142050p:plain

このアイコンは、Scratchが標準で持っているコスチュームを追加する機能になります。

クリックすると

f:id:mywayhaojisan:20161123142115p:plain

すると

f:id:mywayhaojisan:20161123142124p:plain

アイコンをクリックすれば、Scratchに登録されているコスチュームの一覧(ライブラリー)が表示されますので、追加したいコスチュームを選択し、右下にある「OK」ボタンをクリックします。そうすると、選択したコスチュームが追加されます。

 

f:id:mywayhaojisan:20161123142147p:plain

このアイコンは、Scratchのライブラリを使わずに、コスチュームを新しく作る機能です。

クリックすると、

f:id:mywayhaojisan:20161123142214p:plain

次に、

f:id:mywayhaojisan:20161123142225p:plain

アイコンをクリックすれば、何も表示されていないコスチュームが表示されます。

次に何かを描けば、描いた内容が、コスチュームとして追加されます。

他の操作方法(線の引き方や円の描き方など)は、操作がたくさんあるので、別の機会に説明します。

 

f:id:mywayhaojisan:20161123142256p:plain

このアイコンは、画像ファイルを読み込んで、コスチュームを新しく作る機能です。

このアイコンをクリックすれば、ファイルを選ぶ画面が開きますので、画像ファイル(ファイル名が.pngや.jpgで終わるファイル)を選ぶ事で、追加されます。

(この機能については、パソコンが変わると画面が変わるので、文字だけの説明にします)

 

f:id:mywayhaojisan:20161123143818p:plain

このアイコンは、パソコンのカメラで撮影した画像をコスチュームにする機能です。

f:id:mywayhaojisan:20161123142710p:plain

アイコンをクリックする事で、カメラが起動しますので、「保存」ボタンでコスチュームが追加されます。

 

f:id:mywayhaojisan:20161123142800p:plain

この機能は、スプライトや背景に音を設定する機能です。

左上のアイコンから説明していきます。

 

新しい音

f:id:mywayhaojisan:20161123142819p:plain

このアイコンは、Scratchが標準で持っている音を追加する機能になります。

f:id:mywayhaojisan:20161123142835p:plain

すると、

f:id:mywayhaojisan:20161123142844p:plain

アイコンをクリックすれば、Scratchに登録されている音の一覧(ライブラリー)が表示されますので、追加したい音を選択し、右下にある「OK」ボタンをクリックします。

そうすると、選択した音が追加されます。

 

f:id:mywayhaojisan:20161123142908p:plain

このアイコンは、マイクを使って音を追加する機能になります。

f:id:mywayhaojisan:20161123142932p:plain

次に、

f:id:mywayhaojisan:20161123142940p:plain

すると、

f:id:mywayhaojisan:20161123142949p:plain

アイコンをクリックすれば、音が追加され、録音の丸いボタンをクリックで録音を開始します。

再度、丸いボタンをクリックすれば、録音を終了し、波線で録音結果が表示されます。

録音した結果は、三角ボタンをクリックする事で、再生され、確認できます。

注意点として、マイクがないパソコンでは、利用できない機能ですので、気を付けて下さい。

 

f:id:mywayhaojisan:20161123143023p:plain

このアイコンは、音のファイルを読み込んで、追加する機能です。 このアイコンをクリックすれば、ファイルを選ぶ画面が開きますので、音のファイル(ファイル名が.mp3で終わるファイル)を選ぶ事で、追加されます。

(この機能については、パソコンが変わると画面が変わるので、文字だけの説明にします)

 

今回はこれで以上です。ここまでの説明で、ほとんどの基本操作ができると思います。

 

 

最後まで読んで頂いてありがとうございます。

皆さんに少しでもお役に立てれば幸いです。