子供向けプログラミング言語Scratch－絵を動かす方法（移動のアニメーション）

このページでは、子供向けプログラミング言語 Scratch（スクラッチ）の［動き］グループの［○歩動かす］ブロックの基本とScratch プログラミングの基本を説明します。

まず、下の緑の旗をクリックしてみてください。
猫の絵が移動します。

これはScratchという子供向けプログラミング言語で作ったプログラム（Scratchの世界では、プロジェクトとも言います）です。

このプロジェクトでは、緑の旗をクリックすると猫が「100歩」動くようにプログラミングしてあります。

実行

プログラムを動かすことを実行とか起動と言います。
Scratchでは、複数回続けて実行するとき、前の実行が終了した状態が次の実行の始まりの状態になります。

上記を踏まえて、このプロジェクトを続けて実行して、猫の位置がどうなるか、確認してみてください。

緑の旗

Scratchでは、特別なきっかけを使ってプロジェクトを動かしたい場合を除いて、プロジェクトの実行を開始するためには緑の旗をクリックすることから始めるという暗黙の了解があります。
緑の旗は、エディターの中ではステージという結果が表示される四角の枠の右上にあります。
また、ホームページにプログラムを埋め込んだ場合などでは、上記に表示されたように、緑の旗はステージのど真ん中と右上の両方に表示されます。

今回のプログラミング

緑の旗がクリックされたら実行を開始するようにプログラミングするには、一番目に実行したいスクリプトの最初のブロックを［イベント］グループの［緑の旗がクリックされたら］ブロックにします。

［イベント］グループ［緑の旗がクリックされたら］ブロック

［動き］グループの［○歩動かす］ブロック－基本

絵（スプライト）を画面（ステージ）の中で動かすには、［動き］グループの［○歩動かす］ブロックを使います。
1歩の大きさは小さな点1つ分（具体的には、応用編で説明します）、動く方向はあらかじめ設定されている方向（具体的には、応用編で説明します）になります。

［動き］グループ［○歩動かす］ブロック

今回は、エディターを新規作成で起動したときに自動で用意されている猫のスプライトを使い、それをステージの中で動かしています。

プログラミングの操作例

1. ［イベント］グループ［緑の旗がクリックされたとき］ブロックをスクリプトエリアに置くため、［イベント］グループをクリックして表示します。
2. ［緑の旗がクリックされたとき］ブロックをスクリプトエリアにドラッグ＆ドロップします。
3. ［動き］グループ［○歩動かす］ブロックで100歩動かすことにするため、［動き］グループをクリックして表示します。
4. ［○歩動かす］ブロックをドラッグして、［緑の旗がクリックされたとき］ブロックにくっつけるようにドロップします。
5. ［○歩動かす］ブロックの［○］の部分をクリックして「100」と半角で入力してEnterキーを押します。

上記手順の動画はこちらです。

実際のプロジェクトの中身を見たい方は、こちらをクリックしてご覧いただくことができます。

なお、エディターの各部名称と役割を確認したい方はこちらのブログ記事を、オンラインエディターの表示方法を確認したい方はこちらのブログ記事をご参照ください。

（以下、2016年11月27日追加）

おまけ

以下の動画はYouTubeで公開した、スプライトが移動して見えるプロジェクトの実行例です。
このプロジェクトは、IT企画研究所の定期メール配信（2016年8月15日配信）でご紹介したものです。

自転車に乗る猫のスプライトが移動してみえるプロジェクトで、実際に動かしているのは、その後ろの木や建物のスプライトの方です。