コード忍者の⾥/ CoderDojo市川真間

はじまりの書- 60分でScratch入門 –Scratch 3.0 対応

これから、プログラミングを始める人のための巻物です。
Scratch(スクラッチ)を使って初めてのプログラミングを60分程度作成していきます。
内容:
1. スクラッチを使う前に2. スクラッチを使ってみよう:初めての修業
3. 次の修業:もう少しプログラミングしてみよう。
3A. ゲーム・アクション編
3B. ダンス・ミュージック編
3C. デジタル・アート編
4. コード忍者への修業の道筋

名前バージョン:2019年度版 (Ver 2.00 Scratch 3.0対応)
印刷はA5サイズを想定しています。
1ページ

スクラッチはWeb(ウェブ)で使う方法とPC(パソコン)にオフライン版をインストールして使う方法があります。インターネットが使えない場所でもインストールしてあれば使えます。使う準備はメンターや家の人に手伝ってもらいましょう。
道場でWebで使う場合:

オフライン版で使う場合:
https://scratch.mit.edu/download
Scratch Offline Editorからダウンロードします。
(道場ではUSBで用意しています)

ワンポイント:・忍者(にんじゃ)
みなさんのことです。プログラムの修業をする子供たちです。CoderDojo (コーダー道場)は世界や日本たくさんあり、たくさんの忍者が修業にはげんでいます。
・メンター
忍者の修業をお手伝いする人たちです

2ページ

まず、ブラウザでスクラッチのサイトを開くように指定するよ。

Scratch検索

Scratch.mit.eduと⼊⼒するとスクラッチのサイトに⾏くよ。

ここをクリックするとプログラムを作る画面

ワンポイント:・ブラウザのブックマークに登録しておくと、すぐにScratchが使えるよ。

次のページで説明

3ページ

アカウントを作ると、自動的にネット上にプログラムを記録/保存してくれます。さらに、世界中の友達にあなたのプログラムを⾒てもらうこともできます。

アカウント作成のステップ1の画面

アカウント

パスワード

ワンポイント:アカウントとパスワードを使えば、どんなパソコンでも自分のプログラムが作れるよ4ページアカウント作成のステップ2の画面「⽣まれた年と⽉」、「性別」、「国」を指定します。国はJapanだよね
アカウント作成のステップ3の画面
メールアドレスを指定するよ。すぐ受信できるもので、家の人の大人の人のアドレス指定するよ。キーボードに慣れていない人は、メンターや家に人に手伝ってもらおう。
アカウント作成のステップ4の画面下の画面が出来たらOKだよ。さあ、始めよう。
ワンポイント: 保護者の方へ

さっき指定したメールを後で確認してみよう。スクラッチからメールが届いているよ。

メールのボタンをクリックして認証すると、友達とネット上でプログラムを⾒せることができるよ5ページ

スクラッチのサイトにはいろいろな情報があったり、プログラムの作り方を説明しています。これから「作る」でメンターの人といっしょにプログラムを作っていきましょう。
(この資料は作り方を忘れた時に⾒て)世界中の人が作ったプログ
ラムを⾒ることができるよ

一人でスクラッチの使い方を修業できるよ
初めてプログラムを作る人に参考になるプログラムがあるよ

6ページ

スクラッチのプログラムでは、いろいろなキャラクターにいろいろ命令して、ゲーム、電子絵本、アプリなど作ることができるよ。
スクラッチのプログラム、は劇やドラマみたいに考えるといいかも。

ステージ

コード(スクリプト):

劇の台本にあたります。
個々のスプライトがどのように演じるのか指示します。

コード(スプライト):劇の役者にあたります。スクラッ
チではプログラムでこのスプライトを動かすことができます。
この画面ではネコとネズミのスプライトがあります。

ステージ: 劇のススプライト

テージにあたります。
スプライト達はこの中で劇をします。

7ページ

ステージ
スプライト

マウスの左ボタンを押しながらネコを動かす

スクラッチでプログラムを作成するための作成画面(エディター)が表示されます。まず、ネコのスプライトがあるので、マウスでドラッグしてステージ(プログラムの動作が表示される画面)の中を動かしてみよう。
チェック□ ネコをドラッグで動かせた。
□ ネコを動かすとステージの右下のXとYの数字が変わることを⾒た。
ワンポイント: 言語

スプライトリスト

左上のSCRATHの横の地球をクリック
すると「にほんご」でひらがな表示が選べます。

ワンポイント: ブロックの大きさ左上のSCRATHの横の地球をShiftを押しながらクリックすると、ブロックの大きさを変えることができます。

8ページ

今度は[(10)歩動かす]のブロックを使ってスプライトを動かしてみよう。
ブロックをドラッグしてコードエリアに盛ってきて、その後ブロックをクリックしてみよう。どんどんクリックするとネコはどうなるかな?
ブロックカテゴリー

クリック
コード(スクリプト)エリア

ブロックパレットチェック□ ネコをブロックで動かせた。
□ ネコをブロックでどんどん動かせた。

9ページ

ブロックカテゴリー[制御(せいぎょ)]から[ずっと]を使って、[(10)歩動かす]の「ずっと」を中に⼊れてみよう。その後[ずっと]ブロックをクリックしてみよう。
ネコはどうなるかな?
手でネコをステージの真ん中に持っていくとどうなるかな?
チェック□ ネコをブロックで自動的に動かせた。

ワンポイント: プログラム

プログラムはコンピュータに対する命令(スクラッチではブロック)の集まりです。あなたの考えやアイディアをプログラムにすれば、コンピュータが自動的にやってくれます。

赤ボタンを押すと動いているスクラッチのプログラムを止めることができます。
10ページ

あるスイッチを押したときにプログラムが動くようにしてみよう。ここでは、ブロックカテゴリー[イベント]の[旗がクリックされたとき]を使ってみよう。

クリック

チェック
□ 旗をクリックしてプログラムを動かした。
□ 赤丸でプログラムを止めた。

ワンポイント: プログラムとコード(スクリプト)

スクラッチではブロックが集まった命令をコード(スクリプト:台本)と呼んでいます。

11ページ

今のプログラムだと、ネコがステージの端まで⾏くと先に進まないよね。端までいったら跳ね返って、ずっと動き回るようにしてみよう。
ブロックカテゴリー[動き]の[もし端に着いたら、跳ね返る]を[ずっと]の中に⼊れてみよう。
ブロックパレットを上下に動かして探してみよう。
チェック□ ネコが端についたら跳ね返って動くようにした。
ワンポイント: 間違ったブロックを置いた時の直し方
外したいブロックをドラッグすると、そのブロックをはずすことができます。

12ページ

ネコがいろいろ歩きだすと、さかさまにひっくり返ることがあるね。プログラムでひっくり返らないようにしてみよう。
[回転方法を(左右のみ)にする]ブロックを追加してみよう。

チェック□ ネコがひっくりかえらないようになった。
13ページ

ゲームのようにネコが歩くようにしてみよう。[⾒た目]の[次のコスチュームにする]ブロックを使ってみよう。

スプライトのコスチュームにすると、どんなコスチュームを使っているかわかるよ。
ワンポイント: スプライトとコスチューム

スプライトの実際の⾒た目はコスチュームで決まります。コスチュームは劇に例えると役者の⾐装になります。1のスプライトは複数のコスチュームを持つことができます。どのコスチュームを使うかで⾒た目がかわってきます。

14ページ

今までのプログラムだと、ネコは横を⾏ったり来たりしているだけですが、もっといろんな場所を歩くようにしてみよう。

[動き]の[()度に向ける]ブロックを初めの方で使ってみよう。(90)を(30)にキーボードから打ち込んで書き換えます。

チェック□ ネコをステージのいろいろなところを歩くようになった。

15ページ

はじめてのプログラムの最後にネコの形や色を変えてみよう。

コスチュームのタグの中で、塗りつぶし色を変えて、「塗りつぶし」ツールを使えとネコの色を変えることができるよ。

ネコのコスチュームは、ベクターという線や曲線を組み合わせて作ってあるので、「形を変える」ツールで簡単に形を変えることができるよ。

これで、はじめの修業は終わりです。
うまく動いたかな?

16ページ

次の修業でプログラムを少し追加してみよう。種類用意しているので、自分の好きなものを試してみよう。一人で修業してもいいし、メンターといっしょにやってもいいよ。
3A. ゲーム・アクション編

3B.デジタル・アート編

3C.ダンス・ミュージック編

ネコに捕まらないようにスプライトを動かしてみよう。

ネコがきれいな模様をかくよ

⼥の子にダンスを踊らせよう

新しいスプライトが方向キーで動きます。
ネコがニャーと鳴きます。

ワンポイント: 新しいプログラム
3Bと3Cのプログラムは新しいプログラムとして作ってみましょう。
やりかたは次のページ

最後にすごいプログラムができたら、みんなに⾒せてみよう。
17ページ

ファイルの「新規」を使うと新しいプログラムをつくることができます。(右の説明のように、今まで作っていたプログラムは保存されてます)
新規: 新しくプログラムを作る。
直ちに保存: 今のプログラムを確実に保存する。
コピーを保存: 今のプログラムを保存し、今のプログラムをコピーして新しいファイルにする。
コンピュータから読み込む: 今のプログラムをPCのディスクに保存します。
コンピュータに保存する:PCのディスクからプログラムを読み込みます。

自分のIDの横のフォルダーをクリックすると、作ったプログラムの一覧を⾒ることができるよ。
プログラム名を指定しておくと、その名前で保存されるよ。

18ページ

ネコから逃げるための新しいスプライトを追加してみよう。
どんなスプライトを選んでもいいよ。

ここをクリック後「スプライトを選び」を選択

スクラッチで用意されているスプライトから好きなスプライトを、クリックして選択してみよう。

ワンポイント: 選んだスプライトを削除することもできます。

新しいスクリプトが追加されたよ19ページ

新しいスプライトにプログラムを追加してみよう。上向き矢印キーを押した時、上に動くようにするよ。

新しいスプライトにプログラムを追加
ワンポイント:ブロックカテゴリーとブロックブロックはブロックカテゴリーに分類されています。例えば、⽔色のブロックは、⽔色のブロックカテゴリーの中にあります。

20ページ

こんどは上矢印、下矢印、右矢印、左矢印で、新しいスプライトが上下左右に動くようにするよ。

下に動かすプログラムを追加

左右にも動くようにプログラムを追加してみよう。

チェック□ 新しいスプライトを上下左右にキーで動かせた。

21ページ

こんどは新しいスプライトにネコが触ったら鳴くようにするよ。

ネコのスプライトをクリックしてプログラムを追加してみよう。
新しいスプライに触れたら鳴くようにプログラムを追加
ネコを避けて、新しいスプライトをうまく動かすことができるかな。
他の例(3B.デジタル・アート編/3C.ダンス・ミュージック編)を⾒てプログラムを改造してみよう。
22ページ

ペンを使うと、スプライトが動いたところに線を引けるよ。

ワンポイント:ペンの基本
線を書く
す

線を書かないステージのすべての線を消23ページ

はじめにペンのブロックを追加しておこう。

ワンポイント:拡張機能

拡張機能の追加をクリック

拡張機能は他のハードウェアを使うものもあるけど、次のものはパソコンだけで動くので使ってみよう
・音楽・ペン
・ビデオモーションセンサー
・音声合成
・翻訳

ペンのブロックが追加される24ページ

スプライトにプログラムを追加して、きれいな模様を書かせてみよう。

回す角度や、歩く歩数を変えてどんな模様ができるかためしてみよう。
ワンポイント:線の消し方

書いた線を消したい場合はブロックカテゴリーの[ペン]の中の[消す]ブロックを使います。ブロックパレットの中の[消す]ブロックをクリックしても消えます。

25ページ

スプライトに正方形を書かせてみよう。

三角形や六角形も書いてみよう。
他の例(3A. ゲーム・アクション編, 3C. ダンス・ミュージック編)を⾒てプログラムを改造してみよう。

26ページ

ダンスをするスプライトを追加するよ。このスプライトにはダンスしている、いろいろなコスチュームがあらかじめ設定されているよ。

ここをクリック後「スプライトを選び」を選択

スクラッチで用意されているスプライトから好きなスプライトを、クリックして選択してみよう。
選択するとき、カーソルをのせるとどんな動きをするか⾒ることができるよ。

ワンポイント: 選んだスプライトを削除することもできます。

新しいスクリプトが追加されたよ

27ページ

ダンスの音楽を追加するよ。スプライトの音に新しい音を追加するよ。

ダンスに向いている音楽を探してみよう。
(決まったらクリックして追加してみよう)
スプライトに音として、新しい音を追加するよ。
28ページ

追加した音楽を旗をクリックしたら鳴るようにしよう。

29ページ

スプライトにダンスをさせよう。

新しいスプライのコスチュームを⼊れ替えて踊っているように⾒せるよ
速くコスチュームが変わりすぎる時は[( )秒待つ]
ブロックを⼊れて調節するよ。
秒数は小数(0.2や0.5)なども指定できるよ。
チェック□ 音楽が流れてスプライトが踊っているように⾒える。
30ページ

新しい背景を追加してみよう。

ダンスのプログラムがうまく動くかな。
他の例(3A. ゲーム・アクション編/3B. デジタル・アート編)を⾒てプログラムを改造してみよう。

31ページ

初めての修業は楽しかったかな? これからどんどんScratchを上手に使うための修業のやり方を説明するよ。
Scratchの簡単なプログラ
ムで修業する

4.1 簡単なプログラムから始める。

Scratchを早く知りたい

4.2 Scratchの全部を学ぶ。

ゲームを作りながら修業したい

4.3 ゲームでプログラムを修業。

自分で作ってみたいプログラムがある

4.4 自分のプログラムを作る。

6年⽣/中学⽣なので難しいことから挑戦してみたい

4.5 おとなのプログラムを作る。

補足:

Scratch 3.0は2019年1⽉2日にリリースされました。そのため、現時点(2019年1⽉)では、多くの書籍やWeb上のScratchの教材は Ver 2.0対応で作成されています。そのため、一部の記述に違いがあります。

32ページ

Scratchのサイトには⼊門用のチュートリアルが用意されています。
いろいろなプログラムがあるので、作ってみましょう。

33ページ

他にもScratchの簡単なプログラムのチュートリアルはいろいろあります。
CoderDojo道場にある場合は、それを⾒てみましょう。
Scratchコーディングカード
日経BP社:

プチプロジェクトカード
CoderDojo市川真間
http://beyondbb.jp/CDmama/materials/
puchiPor_201811.pdf

ゴールまで競争しよう/音楽を作ろう
かくれんぼ/物語を作ろう
着せ替え遊び/ピンポンゲーム
さあ、踊ろう/キャラクターを飛ばそう
バーチャルペット/キャッチゲーム

ゴキブリたたき/ ぐるぐる
影分身/ きも目玉
フライングネコアタック/ 雪
ピコピコハンマー/ カラーウェーブ
連続ネコパンチ
34ページ

Scratchの全部を知りたいなら、NHKのWhyプログラミングがお勧めです。
現在(2019年1⽉現在)、20回が放送され、1回から順番にやっていくとScratchの⾼度なプログラミングまで学ぶことができます。
Webには、放送内容な、Scratchの素材やプログラムが置いてあります。
Why! プログラミング
http://www.nhk.or.jp/gijutsu/programming/
6.びっくりハウスをつくれ
7.マックスの農場に雨を降（ふ）らせろ
8.カエルをジャンプさせろ
9.スクラッチ動物園を救（すく）え10.自分だけの楽器をつくれ
11.奇跡のチョウを直せ
12.おかしなラーメン店を直せ
13.スーパーロボット・ワンだふぉーを直せ
14.カエルを家に帰せ
1.壊れた魚を動かせ
15.おそろしの花をさかせろ
2.おかしな踊りを直せ
16.お花見列車を直せ
3.文房具でシューティングゲームを作れ 17.マックスの告白を助けろ
4.北極の子ぐまを救え
18.うさぎとカメのCMを作れ
5.リンゴ犬マックスを応援しろ
19.はかりスパイダーを直せ
35ページ

ゲームを作りながら、Scratchのプログラミングを学んでいきます。
本やWebにそって作っていきましょう。
はじめてのプログラミング(学研まんが入門シリーズ)
学研プラス:

10才からはじめるゲームプログラミン
グ図鑑: スクラッチでたのしくまなぶ
創元社:

マンガの説明を見ながら、大きな横スクロール型のアクションゲームを作っていきます。:

8種類のゲームの作り方が学べます。

36ページ

自分で作りたいプログラムがある場合は、かんばって作ってみよう。
必要に応じて、この前に4.1から4.3の本やWebを参考にしながら作ろう。
あと、Scratchの⼊門用の本の中にも、プログラムを作る時に役⽴つ情報があるよ。
小学生からはじめるわくわくプログラミング2
日経BP社:

CoderDojo Japan公式ブック Scratch(スクラッチ)でつくる! たのしむ! プログラ
ミング道場
ソーテック社:

37ページ

Scratchのプログラミングを理屈にそって学ぶことができますよ。
Scratchで楽しく学ぶ
アート&サイエンス
日経BP社:

等加速度運動、二進法、論
理回路、確率、三角関数、モンテカルロ法、フラクタル図形を用いたさまざまなプログラムをつくります。

おとなも学びたいプ
ログラミング
Scratch入門
日経BP社:

アニメーション、インタ
ラクション、図形＆空間
表現、数値＆時間、サウンド、文字、グラフの内容でScratchを体系的に説明しています。

Scratchで学ぶ プログラ
ミングとアルゴリズムの基本
日経BP社:

Scratchのリストを使って、サーチやソートのアルゴリズムを学びます。
38ページ