Scratchの始め方

今回は、プログラミング言語「Scratch(スクラッチ)」を使ってプログラミングを始める方法について説明します。細かいことはさて置き、とりあえずやってみましょう!

Scratchって何?という方は、こちらの記事をどうぞ。

プログラミング言語「Scratch(スクラッチ)」の紹介 - CoderDojo 和歌山

Scratchを始める

まずScratchのウェブサイトにアクセスして、ユーザー登録を行う必要があります(2.0の場合)。

scratch.mit.edu

プレビューは英語ですが、アクセスすれば日本語で表示されます。安心してください(^_^)

Scratchには大きくわけてふたつのバージョンが存在します。インターネットに接続しなくてもプログラミングできるScratch 1.4と、ウェブブラウザ上でプログラミングできるScratch 2.0です。今回は、より簡単にプログラミングを始められるScratch 2.0を使ってプログラムを作っていきます。できれば一緒に手を動かしてみてくださいね。

Scratchへのユーザー登録

f:id:coderdojo-wakayama:20161125223453p:plain

 

右上にある「Scratchに参加しよう」のボタンをクリックしてください。ユーザー登録の画面に移動します。

 

f:id:coderdojo-wakayama:20161125223536p:plain

 

最初に、ユーザーアカウントを設定します。「Scratchで使うユーザー名を入力」の欄に、ローマ字と数字で使いたいユーザー名を入力します。使いたいユーザー名が既に使われている場合には、別の名前を考えてください。

「パスワードを入力」では、ログインする時に必要となるログインパスワードを設定します。パスワードは忘れないようにメモしておくか、ブラウザに覚えてもらいます。パスワードは誰にも見られないように大切に保管してください。「新しいパスワード(確認用)」には、設定したパスワードをもう一度入力します。

 

f:id:coderdojo-wakayama:20161125223652p:plain

 

アカウントが作成できたら、ユーザー名とパスワードを使ってScratchにログインするので、忘れないようにしてください!

ずっと使う名前なので、よく確認してくださいね。では、「次へ」のボタンを押して進みます。

 

f:id:coderdojo-wakayama:20161125223706p:plain

 

次の画面では、簡単なプロフィールを登録します。ここで入力した情報は、どんな人がScratchを使っているかを把握するために用いられ、公開はされませんので安心してください。「国」は、日本に住んでいれば「Japan」を選択します。

 

f:id:coderdojo-wakayama:20161125223725p:plain

 

最後に、メールアドレスを入力します。子どもさんのアカウントを作成する場合、「電子メールアドレス」は保護者のメールアドレスを登録した方が良いと思います。もし、パスワードを忘れた場合、ここで登録したメールアドレスにパスワードリセット用のメールが届きます。

「次へ」を押すとユーザー登録が完了します。電子メールアドレスに誤りがないことを良く確認してから、「次へ」を押しましょう。

 

f:id:coderdojo-wakayama:20161125223826p:plain

 

これでアカウントの作成は完了しました。「さあ、はじめよう!」のボタンを押して、いよいよプログラムの作成に取り掛かります。

Scratchで初めてのプログラミング

これで、Scratchを使ってプログラムを作る準備が整いました。早速簡単なプログラムを作ってみたいと思います。

f:id:coderdojo-wakayama:20161126083235p:plain

Scratchのウェブサイトのトップページ左上にある「作る」ボタンをクリックします。クリックすると以下のような画面に移動して、プログラミングができるようになります。

f:id:coderdojo-wakayama:20161120191537p:plain

それでは実際にプログラムを作ってみることにします。

f:id:coderdojo-wakayama:20161126101547p:plain

「10歩動かす」のブロックをクリックします。ステージのネコが10歩(ドット)動きます。どんどんクリックしてみます。

f:id:coderdojo-wakayama:20161126102707p:plain

画面の端まで移動できました。戻すときは猫をドラッグ&ドロップで戻すことができます。これでも猫を動かしたことになりますが、指が疲れるのでプログラムでやってみます。

f:id:coderdojo-wakayama:20161126110358p:plain

制御カテゴリーをクリックし、「ずっと」のブロックをスクリプトエリアにドラッグ&ドロップします。次に動きカテゴリーに戻り、「10歩動かす」のブロックを「ずっと」ブロックではさみます。(近づけるとC字型の口の部分が白く光ります。)「ずっと」をクリックすると、ネコが自動的に動いて画面からいなくなります。尻尾をドラッグして戻しても、またすぐに動き出します。

f:id:coderdojo-wakayama:20161126111809p:plain

このままでは猫が暴走したままですので、一回止めます。プログラムをストップする時は、上の赤信号のようなボタンを押します。これでプログラムのすべての動作が止まります。赤いボタンが止まれなら、隣の緑の旗ボタンは進めのような気がしますね。でも、クリックしても何も起こりませんね。

f:id:coderdojo-wakayama:20161126112509p:plain

「旗がクリックされたとき」ブロックを「ずっと」の上につなげます。これで旗をクリックするとネコが自動で動き、赤信号をクリックすると止まるようになりました。ぐっとプログラムらしくなりましたね。

 今、端に行った猫はマウスで動かさない限り端で止まっています。今度はこれを自動で跳ね返ってくるようにしたいと思います。

f:id:coderdojo-wakayama:20161126113702p:plain

どうですか?跳ね返るようにはなりましたが、今度は逆さに戻ってきちゃいましたね。次はこれを直します。

f:id:coderdojo-wakayama:20161126114702p:plain

スプライト領域の猫の左上に、iのマークがついてます。これをクリックします。

f:id:coderdojo-wakayama:20161126114933p:plain

「回転の種類」を左右のみに変更します。これでバッチリ!と言いたいところですが、少し物足りないですね。猫がスケートのように滑ってますし、左右にしか動かないのも面白みがないです。

f:id:coderdojo-wakayama:20161126115734p:plain

猫のグラフィックを変更する時は、コスチュームタブをクリックします。自分で一から作ることもできますが、今回はあらかじめ入っている画像を使います。ちょうど足を閉じたり開いたりしてますね。うまく使えば歩いているように見えそうです。

f:id:coderdojo-wakayama:20161126120631p:plain

スクリプトタブに戻り、見た目カテゴリーから「次のコスチュームにする」をドラッグ&ドロップし、「ずっと」ブロックの中にはさみます。ついでに、左のスプライト領域の向きを90°(-90°)以外に変えてみます。○に刺さった棒の部分をドラッグして変更します。

緑の旗をクリックしてプログラムを実行します。どうでしょうか?ステージを所狭しと走り回る元気な猫ができましたか?

今回は一番最初ということでステップを一つずつ説明しましたが、簡単にプログラミングができることが体感してもらえたでしょうか?皆さんもぜひ一度挑戦してみてくださいね。

 今回作成したサンプルプログラムです。