1. スタート – 白馬プログラミング塾

プログラミングの開始

スクラッチはWebブラウザからスクラッチのページを開いて使用します。スクラッチのユーザー登録をまだ行っていない方は「0-1:スクラッチの始め方」を読んで登録を済ませてください。

スクラッチのプログラミングを始めるには、毎回同じ手順をたどります。

1. Webブラウザを開いて、Scratchサイトにアクセスします。
2. ページ右上に[サインイン]が表示されている場合は[サインイン]をクリックします。
3. すると[ユーザー名]と[パスワード]を入力するウィンドウが現れるので、ユーザー登録に使ったユーザー名とパスワードを入力して[サインイン]ボタンをクリックします。

ページ右上に[サインイン]が表示されていない場合はすでにサインインしているので、次に進みます。

1. トップページに表示されている[プロジェクトを作る]かまたはウィンドウ上部の[作る]をクリックします。

1. すると自分専用のプログラム作成ページが作成され、表示されます。メニューなどが英語で表示されている場合は、下図のように画面左上の[Settings]をクリックして[Language]から[日本語]を選びます。

この専用のプログラム作成ページはプロジェクトと呼ばれます。画面上部に[Untitled]と表示されているテキストボックスにはプロジェクト名を入力することができます。

プロジェクトの保存

スクラッチでは、サインインしていると、作業中のプロジェクトが自動的にスクラッチのサーバーに保存されます。また画面上部に[直ちに保存]ボタンが表示されているときには、クリックするとすぐに保存できます。

[ファイル]メニューには便利な項目が並んでいます。

新規：　新しいプロジェクトが作成できます。
直ちに保存：　すぐに保存します。
コピーを保存：作業中のプロジェクトのコピーを作成して保存します。プロジェクトを大きく変更したいとき、それに失敗した場合に戻れる状態として利用できます。
Load from your computer：手元のコンピュータに保存したプロジェクトを読み込みます。
コンピュータに保存する：スクラッチのサーバー上でなく、手元のコンピュータにダウンロードして保存します。

自動的に保存されたプロジェクトのファイルは、次回、スクラッチのサーバーにログインしたとき、画面右上端のユーザー名の左のフォルダアイコンのクリックで表示される[私の作品]パネルから読み込むことができます。

スクラッチに用意されている道具

スクラッチの画面を見ていきましょう

画面左側には、プログラミングで使えるコマンド(命令)のリストがブロックの形で並んでいます。この領域はコードメニュー(1)と呼ばれます。

これらのブロックはマウスでドラッグして、真ん中のスクリプトエディター(2)にドロップできます。

画面右上にあるのはステージ(3)です。ここではプログラムの動きが確認できます。スクリプトエディターにコードブロックをドラッグ＆ドロップすることで作成したプログラムは、ステージ上の実行ボタン(4)(旗のマーク)のクリックで実行できます。ステージにはその結果が表示されます。

スクラッチでは、新しいプロジェクトを作成するたびにステージにネコが一匹、配置されます。このネコはスプライト(5)と呼ばれます。

スプライト

スプライトは、プログラムの中で扱うキャラクターや小道具を言います。スプライトは動いたり、しゃべったり、絵を描いたりします。スクラッチには初めからたくさんのスプライトが用意されていますが、自分で描いて作ることもできます。

ステージ

ステージではプログラムのテストが行えます。テストが成功すれば、次の段階に進みます。たとえばネコの右への移動がうまくいったら、次の上への移動のコードを考えます。プログラムは画面上部の実行ボタンのクリックでスタートし、その右の赤い停止ボタンのクリックで停止します。

スクリプト

プログラミング言語で書かれた命令の集まりのことをスクリプトと言います。スクリプトを書くには、左のコードメニューからさまざまな色をしたコードブロックをクリックしてドラッグし、画面センターのスクリプトエディターにドロップします。ブロック同士をつなぎ合わせることで、プログラムの長い命令、つまりスクリプトができ上がります。

コードブロック

スクラッチのプログラミングでは、コードを文字で書くのではなく、視覚的に楽しいカラフルなブロックの組み合わせで作成します。コードブロックは種類ごとに色分けしてあります。

分類	意味	説明
	動き	スプライトをステージ上で動かすときに使います。
	見た目	見た目を大きくしたり小さくしたりできます。
	音	プログラムに音を追加します。
	イベント	いつ命令を実行するかのきっかけを決めます。
	制御	繰り返しのループや条件、間合いなどを作ります。
	調べる	何かを調べるときに使います。
	演算	数学の計算や大小の比較などに使います。
	変数	「変数」を作ります。
	ブロック定義	自分だけのブロック(関数)が作成できます。

バグ

プログラムの作成(コーディング)は試行錯誤の連続で、プログラムはまず、思った通りには動いてくれません。うまく動かないとき、プログラマーはコード全体を見返して、問題の原因となっているミス、間違い、つまりバグを見つけなければなりません。

多くの場合、バグはちょっとしたミスです。

たとえばネコがあいさつしてから歩き出すプログラムを作りたいのに、動作の順番を間違えると、ネコは歩き出してからあいさつします。うまくいかないときは、コードを注意して見返し、問題のありかを見つけます。この作業をデバッグと言います。

コンピュータは言われた通り動くだけなので、正しい動作はプログラマーが考える必要があります。プロのプログラマーでも、プログラムが一発でうまく動作することはなく、デバッグ作業を何度も繰り返して、完全動作品に近づけていきます。

初めてのプロジェクト

ではここまで見てきたことのまとめとして、初めてのプロジェクトを作成していきましょう。ボタンのクリックでスタートし、「こんにちは」としゃべるネコのプログラムを作成します。

1. 1. WebブラウザでScratchページを開きます。
  2. 画面に表示されている[プロジェクトを作る]をクリックするか、画面上部の[作る]をクリックします(ページ上部に紹介した手順ですでに行っています)。
  3. スクラッチのプロジェクト画面が表示されます。画面上部にあるテキストボックスに「初めてのプロジェクト」と入力します。
  4. 画面右のステージには、前もってネコのスプライトが１つ置かれています。
  5. 画面左上の[コード]タブの[イベント](黄色の丸)をクリックしてイベントに関するコードブロックを表示し、一番上にある[緑旗が押されたとき]ブロックを、画面センターのスクリプトエディターにドラッグします。ドラッグできるときには、カーソルが手の形に変わります。
  6. つづいて、画面左上の[コード]タブの[見た目](紫色の丸)をクリックして見た目に関するコードブロックを表示し、上から２つめの[(こんにちは！)と言う]ブロックを、スクリプトエディターにドラッグします。このとき、マウスボタンを放さずに前の[緑旗が押されたとき]ブロックの下に近づけると、グレーの領域が現れます。これは今、吸着できるタイミングであることを示しています。グレーが表示されているときに、ドロップします。すると、下のブロックが上のブロックに吸い付きます。

1. 1. ステージ左上にある旗のボタンをクリックします。するとプログラムが実行され、ネコが「こんにちは」と言います。このプログラムはこれで完成です。

一度ドラッグ＆ドロップしたブロックは、再度ドラッグしてコードメニューの上にドロップすると、削除できます。

Scratchは、MITメディア・ラボのライフロング・キンダーガーテン・グループの協力により、Scratch財団が進めているプロジェクトです。http://scratch.mit.eduから自由に入手できます。

白馬プログラミング塾