プログラミング初心者の子供に何を教えたらいいの？とお悩みの保護者のためのScratch（スクラッチ）の入門講座。
Scratchで猫の動かし方はわかったけど・・・次にどんなことをしたらいいの？という疑問にお答えするシリーズです。
今回は、お絵かきアプリを作ってみたいと思います。
1. お絵かきアプリの機能を整理しよう。
1-1. お絵かきアプリの要素を考える
iPhoneやiPadにお絵かきアプリを入れて子供と一緒に遊んだ経験、ありませんか？結構身近なアプリですが、Scratchのペン機能を使うと簡単に作れますよ。
さて作り始める前に大切なことがあります。以前、タイマーや自動販売機にタイマーにどんな「要素」があるか整理したと思います。
何かを作る時には、作りたいものにどんな要素があるか整理しておきましょう。これはとても大事なことです。この作業を行うことで分析力が育ちますよ。
「要素」という言葉は子ども達には難しいと思います。その場合には「お絵かきアプリにはどんな機能がある？」「お絵かきアプリってどういうふうに遊ぶ？」という風に年齢に応じて問いかけを簡単にしていってみてくださいね。
お絵かきアプリの要素はつぎのような感じになると思います。
（１）色が選べる
（２）マウスを押している間だけ線が引ける
（３）消しゴムで消せる
（４）全部消す機能がある
（５）太さが選べる
そして、その要素を全部作るのか？それとも一部だけにするのか？ということを決めていきましょう。
以下の記事も参考にしてみてください。
＜プログラミング初心者のためのScratch（スクラッチ）入門-何かを真似して作る時の考え方＞
1-2. それぞれをどのように作るか？考える
お絵かきアプリの要素を洗い出したらそれをScratchでどのようにつくるか？Scratchの機能に落とし込んでいきます。
（１）色が選べる
この機能をつくるには「スプライトがクリックされたとき」を使えば実現できそうです。
①色を画面に並べておく。
これはスプライトで準備しましょう。
②並べた色をクリックしたら色が変わる
このスプライトがクリックされたら、を使い、そのあとでメッセージを送信するようにすればできそうですね。
（２）マウスを押している間だけ線が引ける
この機能をつくるには「ずっと」「もし〜なら」を使えばできそうです。
また、線を引くためにはペン機能を使いましょう。
（３）消しゴムで消せる
ペンで引いた線の一部を消す機能はスクラッチにはありません。なので、これは背景色で上から塗りつぶすという方法にしましょう。そうかんがえれば、線を引くと同じことをやればOKです。
（４）全部消す機能がある
全部消すには、「消す」ブロックを使えばできますね。これは簡単そうです。
（５）太さが選べる
太さも変数をスライダーで選べるようにすれば実現できそうです。
2. お絵かきアプリを実際に作ってみよう
2-1. スプライトを準備しよう
まず最初にスプライトを準備しましょう。スプライトは以下の3つを用意しますよ。
・えんぴつ
・色のパレットのスプライト（これは色ごとにスプライトを分けます）
・消しゴムのスプライト（白丸のスプライトにしてみます）
鉛筆のスプライトは、Scratchの素材の中にあったものをつかいました。色のパレットのスプライトは、丸に色をつけたものを並べておきます。消しゴムのスプライトは、白丸にしました。消しゴムの絵を描いてもいいと思います。
2-2. マウスを押している間だけ線が引けるプログラムを作る
ここからプログラムを作っていきましょう。
まず最初は、お絵かきアプリのもっとも基本的な機能である、マウスを押している間だけペンで線を引くという機能を作ります。
この機能をつくるためには、２つのポイントがあります。
・スプライトがマウスに合わせて動く
・マウスが押されている時だけペンで線を引く
です。
まず「スプライトがマウスに合わせて動く」を作りましょう。それはこうするだけです。（大きも少し調整しました。）
つづいて、「マウスが押されている時だけペンで線を引く」です。これはこのようなプログラムになります。
この２つを合体させると・・・こうなります。
ためしてみましょう。
＜注意！＞
開発画面では、マウスを押しながら線を引くがうまく動きません。以下の赤丸で囲ったところのボタンを押して全画面表示にしてから動かしてください。
全画面表示にしたら、うまく線がひけました。
ですが、すこし気持ち悪いところがあります。えんぴつの真ん中のところで線が引かれています。えんぴつの先端の芯のところから線が引けるように、スプライトの中心を移動しましょう。
スプライトの中心＝マウスのポインターの場所になります。
スプライト（コスチューム）の中心を変更するには、コスチュームのペイント画面で右上の十字ボタンを押します。そうすると、画面に十字が表示されるので、中心にしたいところをクリックします。
今回は、鉛筆の先端をクリックして、コスチュームの中心がえんぴつの先端になるようにしました。
先ほどのプログラムを実行してみます。すると、今度はえんぴつの先で線を引いているようになりました。
2-3. 色を選べるようにしよう
つぎは色を選べるようにしたいと思います。まず、赤色のスプライトに次のようなプログラムを作ってみましょう。
続けて、えんぴつのスプライトに次のプログラムを作ります。
これでプログラムを実行してみましょう。ペンの色が変わりました！
これと同じプログラムを他の色と消しゴムに対して作ります。消しゴムがクリックされた時は白になるようにしましょう。
2-4. 全部消す機能を作ろう
次に、描いたものを全部消す機能を作りましょう。全部消すボタンを用意して、それをクリックしたら消えるようにしたいですね。
全部消すボタンのスプライトを用意しましょう。
Scratchに最初から用意してあるボタンに「消す」という字を描いてボタンを準備しました。
プログラムはたったこれだけです。消すボタンにこのプログラムを作っておきます。
2-5. ペンの太さを変えられるようにしよう。
これは変数のスライダーを用意して、スライダーで太さを変えられるようにしておきましょう。
「太さ」という変数を用意してスライダーの最小値と最大値を設定します。今回は最小値は1、最大値は20にしておきます。
つづいて、えんぴつのプログラムに次のプログラムを1行追加しましょう。
これで、変数のスライダーで設定した太さに変わるようになります。
実はこの方法だと欠点がありまして、変数の値を変更するときにも線が引かれてしまいます。ペンの太さもスプライトを用意してクリックしたら変わるようにしておいた方が良かったかもしれませんね。
ただ、正確な太さのスプライトを用意するのが大変なので、今回はこれで完成ということにしたいと思います。
▼プログラムはこちら
3. まとめ
今回は、Scratchでお絵かき作ってみました。
プログラムを作り始める前に、以下の手順で作り方を考えました。
手順1:お絵かきアプリの要素を整理し
手順2:各要素をどのように作るかを考える
手順3:各要素を順番に作っていく
うまくいかないなというところがあっても、大事なのは「とりあえずやってみた」ということ。
うまくいかない部分はどうしたらいいか？考えることが大事ですよ。
今回は比較的簡単に作れるアプリなので、小学校高学年のお子さんなら一人でも作れると思います。ぜひチャレンジしてみてくださいね！
