PowerPoint プレゼンテーション

(1)

Scratch を用いた

プログラミング教育について

平成

29

年度

ICT

活用教育研修会九州工業大学

齊藤剛史

2017

年

8

月

21

日

(2)

講師紹介



名前： 齊藤剛史（さいとうたけし）



所属：九州工業大学

大学院情報工学研究院

システム創成情報工学研究系



連絡先：

[email protected]



専門：画像処理・パターン認識

(3)

内容



本日の流れ



資料について

 HP

で公開済み

 http://www.slab.ces.kyutech.ac.jp/~saitoh/20170821_ICTIizuka/

3

Time Contents

10:20 – 10:25 (5min) ①Scratchを学ぶ

10:25 – 10:45 (20min) ②Scratchの操作説明

10:45 – 11:35 (50min) ③Scratchを用いたプログラミング教育例 11:35 – 11:50 (15min) ④プログラミング教育の導入について

(4)

Scratch

平成

29

年度

ICT

齊藤剛史

2017

年

8

月

21

日

(5)

プログラミング言語



コンピュータプログラムを記述するための形式言語



おもに英語の単語と記号を組み合わせた、特殊な文法（構文）で記述される。

5

Wikipediaより

(6)

The 2017 Top Programming Languages

 IEEE Spectrum

 2017.7.18

http://spectrum.ieee.org/computing/software/the-2017-top-programming-languages

(7)

代表的なプログラミング言語

 Python

 綺麗なコードが簡単に書ける言語

 C

言語

 組み込み・OS関係で使われている言語

 Java

 オブジェクト指向の代表的な言語

 JavaScript

 Web系で最も使われている言語

 PHP

 サーバーサイドのWebアプリケーションに適した言語

 Swift

 iOS・OSXのアプリ開発に使われる新しい言語

 Ruby

 日本で生まれたプログラミング言語

7

(8)

様々なプログラミング言語



画面に「

Hello, world!

」と

表示するプログラム #include <stdio.h>

int main(void) {

printf("Hello, world!");

return 0;

}

#include <iostream>

int main() {

std::cout << "Hello, world!" << std::endl;

}

C

C++

public class Hello {

public static void main(String[] args) { System.out.println("Hello, world!");

} }

Java

10 PRINT "Hello, world!"

20 END

BASIC

WRITE(6,10)

10 FORMAT('Hello, World!') STOP

END

FORTRAN

printf ('Hello, world!¥n')

MATLAB

program Hello(output);

begin

writeln('Hello, world!') end.

Pascal

(9)

Scratch では？

#include <stdio.h>

int main(void) {

printf("Hello, world!");

return 0;

}

#include <iostream>

int main() {

std::cout << "Hello, world!" << std::endl;

}

C

C++

public class Hello {

public static void main(String[] args) { System.out.println("Hello, world!");

} }

Java

10 PRINT "Hello, world!"

20 END

BASIC

WRITE(6,10)

10 FORMAT('Hello, World!') STOP

END

FORTRAN

printf ('Hello, world!¥n')

MATLAB

program Hello(output);

begin

writeln('Hello, world!') end.

Pascal

9

(10)

Scratch とは？

 Scratch

（スクラッチ）



米国マサチューセッツ工科大学（

MIT

）メディアラボが開発された、無償で利用できるプログラミング環境

設計者：Mitchel Resnick（ミッチェルレズニック）



あらかじめ用意されたブロックを組み合わせることで簡単にプログラムの作成が可能



小学生から大人まで、誰でもすぐにプログラミングを始めることが可能

(11)

Scratch とは？

 Scratch

（スクラッチ）



米国マサチューセッツ工科大学（

MIT

）メディアラボが開発された、無償で利用できるプログラミング環境

設計者：Mitchel Resnick（ミッチェルレズニック）



あらかじめ用意されたブロックを組み合わせることで簡単にプログラムの作成が可能



小学生から大人まで、誰でもすぐにプログラミングを始めることが可能

11

Hat block

Stack block Boolean block

C Block Reporter block

Cap block

(12)

Scratch とは？

 Scratch



すべての年代の人々に使われている。



特に

8

歳から

16

歳向けにデザインされている。

 150

以上の国で使用されており、

40

カ国語以上に翻訳されている。

https://scratch.mit.edu/statistics/

(13)

Scratch とは？

 Scratch

 Windows

、

Mac

など、様々なコンピュータで利用できる。



ウェブアプリケーションのため、特別なソフトウェアを必要としない。



作成したプログラムの結果（動作）をすぐに画面で確認できるため、間違ったプログラムを作っても簡単に修正できる。



作成したプログラムを

Scratch

のサイトで世界中の人々に公開したり、他人が作成したプログラムを見たりすることができる。

13

(14)

必要な動作環境

 OS

 Windows

、

Chrome OS

、

Mac

、

Linux

 Web

ブラウザ

 Chrome

、

Firefox

、

Safari

、

Edge

、

Internet Explorer



インターネット接続



オフラインエディタを利用することで、インターネット接続なしで

Scratch

プロジェクトを作成が可能

(15)

Scratch で何ができる？



他のプログラミング言語と同様に、様々なプログラムを作ることができる。



シューティングゲーム



アドベンチャーゲーム

 RPG

ゲーム



動く紙芝居のようなアニメーション



お金の計算



体調管理ソフト



物理シミュレーション



学校などで使うプレゼンテーション資料



ロボットや電子楽器などのような電子機器を制御するプログラム

15

(16)

ビジュアルプログラミング言語



プログラムをテキストで記述するのではなく、視覚的なオブジェクトでプログラミングするプログラミング言語

 AgentSheets

、

Alice

、

Analytica

、

ASTERIA

、

Automator

、

CODE

、

Choregraphe

、

DRAKON

、

jMax

、

LabVIEW

、ラダー・ロジック、

Lava

、

Max/MSP

、

Microsoft Robotics Studio

、

Mindscript

、

MOONBlock

、

OpenMusic

、

Prograph CPX

、プログラミン、

Pure

Data

、

Quartz Composer

、

SCADE

、

Simulink

、

Etoys

、

Scratch

、

Stagecast Creator

、

Subtext

、

SynthMaker

、

ThingLab

、

ToonTalk

、

VISCUIT

、

VisSim

、

Visulan

、

VSXu

など

Wikipediaより

(17)

ビジュアルプログラミング言語



プログラミン



文部科学省が開発したビジュアルプログラミング言語

 http://www.mext.go.jp/programin/

17

(18)

ビジュアルプログラミング言語

 VISCUIT

（ビスケット）

 2003

年に

NTT

の研究で開発されたビジュアルプログラミング言語

 http://www.viscuit.com/

(19)

③ Scratch を用いた

プログラミング教育例

平成

29

年度

ICT

齊藤剛史

2017

年

8

月

21

日

(20)

プログラミング教育の実践上の工夫



プログラミングに対して、児童生徒に抵抗感を与えないために、モチベーションを継続できるように工夫して実践する。



授業の進め方



サンプルプログラムや参考サイトのリンク集を用意して、児童生徒が自分で見比べて仕組みを理解したり、アルゴリズムを考えたりする。



児童生徒同士で一緒に取り組んだり、分からなくなった時に教えあったりするような協働型の学習スタイルを導入する。

平成26年度文部科学省委託事業情報教育指導力向上支援事業プログラミング教育実践ガイド

(21)

プログラミング教育の実践上の工夫



授業の進め方



目標を細分化し、小さな目標を達成する体験を積み重ねながら最終目標に近づけるようスモールステップで課題を設定することで、児童生徒の「プログラミングは難しい」という思い込みを払拭させ、自分にもできるという自己効力感を高めさせる。



児童生徒は、ある程度自分でコンピュータを動かすことができるようになると、自分自身で発展・改良する。

21

(22)

プログラミング教育の実践上の工夫



授業の方針



教員が全てを教えるのではなく、最小限の基礎知識から自分の思い描く働きを実現するために、

児童生徒が考え、友達との協働によって確認・

発展のアイデアを得て、試行錯誤しながらプログラミングするという児童生徒の主体性を重視する授業スタイルが望まれる。

(23)

取り組み内容

1.

基礎知識の説明

2.

サンプルプログラムの紹介例

3.

チュートリアルの利用例

4.

演習問題例

23

(24)

「②

Scratch

の操作説明」を参考にして下さい。

(25)

サンプルプログラムの紹介例

総和を求めるプログラム

(26)

総和（ 1 から N までの総和）

 N=10

の場合

 𝑆 = 1 + 2 + 3 + 4 + 5 + 6 + 7 + 8 + 9 + 10 = 55

 N=100

の場合

 𝑆 = 1 + 2 + ⋯ + 99 + 100 = 5050



公式

 𝑆 = σ

_𝑖=1^𝑁

𝑖 =

¹

2

𝑁(𝑁 + 1)

(27)

処理の流れ

²⁷

START sum ← 0

i ≦ N yes no

END i← 1

sum ← sum + i i ← i + 1

sum を出力

(28)

処理の流れ



フローチャート（

flowchart

、流れ図）



プロセスの各ステップを箱で表し、流れをそれらの箱の間の矢印で表すことで、アルゴリズムやプロセスを表現する図



端子（開始／終了）

プロセスの開始と終了を示す。



処理

具体的な処理を示す。



判断

一般に「Yes/No」あるいは「真/偽」が答えと

なる判断を表す。



入出力

「ユーザーがXを入力」、「Xを表示」などと書かれる。

(29)

処理の流れ

²⁹

START sum ←0

i ≦ N yes no

END i← 1

sum ←sum + i i ← i + 1

sum を出力

総和を格納する変数カウンタ

カウンタがN以下か確認する

現在までの総和に iを加えるカウンタを更新する

カウンタがN以下の場合カウンタがNより大きい場合

結果（総和）を出力する

(30)

プログラム例

(31)

チュートリアルの利用例

(32)

 Scratch

公式ウェブサイトに「お試し作品集」が用意されている。

(33)

チュートリアルの利用

 Scratch

公式ウェブサイトに「お試し作品集」が用

意されている。

33

(34)

チュートリアルの利用

 Scratch

公式ウェブサイトに「お試し作品集」が用

意されている。

(35)

チュートリアルの利用

 Scratch

の

Web

サイトで用意されているチュートリアルを利用する。

 名前を動かそう

 飛ばしてみよう

 ミュージックを作ろう

 ゴールまで競争しよう

 かくれんぼ

 オシャレをしよう

 物語を作ろう

 ピンポンゲーム

 さあ、踊ろう

 キャッチゲーム

 バーチャルペット

(36)

ゴールまで競争しよう



右側の説明を参考にする。

(37)

演習問題例

(38)

演習問題

 10

個のブロックを用いてプログラムを作りなさい。



それぞれのブロックを

1

個以上使うこと。



数値等は変更してよい。

(39)

演習問題

 10

個のブロックを用いてプログラムを作りなさい。



それぞれのブロックを

1

個以上使うこと。



数値等は変更してよい。



答えは一つだけでない。

39

(40)

の導入について

平成

29

年度

ICT

齊藤剛史

2017

年

8

月

21

日

(41)

プログラミング教育の課題



授業時間の確保



指導人材の養成・確保



指導方法・教育教材の開発・普及



環境整備



その他

41

(42)

実践事例



プログラミング教育実践ガイド



平成

26

年度文部科学省委託事業情報教育指導力向上支援事業



小中高校の実践事例の紹介

1 年生からのプログラミング体験（小1：生活科，特別活動）

めざせ！行列のできるおすし屋さん！（小4：図画工作科）

プログラムロボット学習（小4～6：総合的な学習の時間）

調べた人物をプログラムで表現してみよう（小6：総合的な学習の時間）

アニメーション制作でプログラミングの基礎学習（中2：技術・家庭科（技術分野））

プログラミングを利用してLEDを制御しよう

車型ロボを制御して課題コースをクリアしよう

ペアで取り組む交差点の信号機プログラミング

（中3：技術・家庭科（技術分野））

(43)

プログラミングの学び方



書籍で学ぶ。



独学



プログラミング教室で学ぶ。



学習サイトで学ぶ。

43

(44)

Scartch 関連図書（ 1/11 ）



スクラッチアイデアブック

ゼロから学ぶスクラッチプログラミング



石原正雄（著）



出版社カットシステム

 ISBN-13 978-4877832179



発売日

2009/01

(45)

Scartch 関連図書（ 2/11 ）



小学生からはじめるわくわくプログラミング



阿部和広（著）



出版社日経

BP

社

 ISBN-13 978-4822285159



発売日

2013/7/25

45

(46)

Scartch 関連図書（ 3/11 ）



ゲームで遊ぶな、ゲームを作ろう！

スクラッチ

2.0

アイデアブック

ゼロから学ぶスクラッチプログラミング



 ISBN-13 978-4877833404



発売日

2014/4/1

(47)

Scartch 関連図書（ 4/11 ）



スクラッチではじめるプログラミング



 ISBN-13 978-4877833480



発売日

2014/07

47

(48)

Scartch 関連図書（ 5/11 ）



いちばんはじめのプログラミング

Scratch

で、作る楽しさ、考える楽しさをそだてる

Scratch2.0

対応



たにぐちまこと（著）



出版社マイナビ

 ISBN-13 978-4839954864



発売日

2015/3/24

(49)

Scartch 関連図書（ 6/11 ）

 Scratch

ではじめよう！プログラミング入門



杉浦学、阿部和広（監修）



出版社日経

BP

社

 ISBN-13 978-4822297749



発売日

2015/6/11

49

(50)

Scartch 関連図書（ 7/11 ）

 Scratch

で学ぶ

プログラミングとアルゴリズムの基本



中植正剛、太田和志、鴨谷真知子（著）



出版社日経

BP

社

 ISBN-13 978-4822297930



発売日

2015/11/21

(51)

Scartch 関連図書（ 8/11 ）



小学生からはじめるわくわくプログラミング

2 

倉本大資（著）、阿部和広（監修）、酒匂寛（翻訳）



出版社日経

BP

社

 ISBN-13 978-4822295820



発売日

2016/5/12

51

(52)

Scartch 関連図書（ 9/11 ）

 CoderDojo Japan

公式ブック

Scratch

でつくる！たのしむ！プログラミング道場



角田一平、とがぞの、高村みづき、若林健一、砂金よしひろ（著）



出版社ソーテック社

 ISBN-13 978-4800711519



発売日

2016/12/22

(53)

Scartch 関連図書（ 10/11 ）



日経

Kids+

子どもと一緒に楽しむ！

プログラミング（日経ホームマガジン）



日経

PC21

（編集）



出版社日経

BP

社

 ISBN-13 978-4822238810



発売日

2017/3/4

53

(54)

Scartch 関連図書（ 11/11 ）



はじめてのプログラミング

（学研まんが入門シリーズ）



橋爪香織、たきりょうこ（著）、阿部和広、うめ（小沢高広・妹尾朝子）（監修）



出版社学研プラス

 ISBN-13 978-4052045851



発売日

2017/4/18

(55)

プログラミングの学び方



書籍で学ぶ。



 TECH::CAMP

https://tech-camp.in/

 Life is Tech !

https://life-is-tech.com/

 EX-Gram

http://www.ex-gram.com/

 CodeCamp

https://codecamp.jp/

 Tech Kids CAMP

http://techkidscamp.jp/

 STAR Programming SCHOOL

http://www.star-programming-school.com/

 TENTO

http://www.tento-net.com/

など



55

(56)

プログラミングの学び方



書籍で学ぶ。



 paiza

http://paiza.jp

 Flappy Code

http://studio.code.org/flappy/1



ドットインストール http://dotinstall.com/

 Codecademy

http://www.codecademy.com/

など

(57)

プログラミング教育の課題



授業時間の確保



指導人材の養成・確保



指導方法・教育教材の開発・普及



環境整備



その他

57

(58)

環境整備



コンピュータ



デスクトップ、ノート

PC

、タブレット

 InterCLASS

などの授業支援システムがあると望ましい。



物理的セキュリティ対策



電源設備、熱対策



ネットワーク



ウイルス対策



プリンタ



プロジェクタ、スクリーン



ホワイトボード

(59)

その他



児童生徒の事前知識



パソコンの基本操作

キーボード操作

マウス操作

– 左クリック、右クリック、ダブルクリック、ドラッグ

アルファベット

59

(60)

その他



プログラムの管理



先生が用意するサンプルプログラム

どのように児童・生徒に配布する？

サンプルプログラムを示しながら、一緒に作る。

共有フォルダを利用する。

学習システムを利用する。



児童・生徒が作成するプログラム

どこに保存する？

自宅で作成したプログラムをどのように学校の端末で動かす？

USBメモリ、SDカード、メール、クラウドサービス

セキュリティ

(61)

その他



評価方法



試験の実施

試験時間にプログラムを作成する問題は適していない。

– ブロックを描くことは難しい。

プログラムを理解する問題

– 問題文にプログラムを示し、どのように動作するのか考えさせる。

プログラムを修正する問題

– 問題文にプログラムを示し、動作を変更するためにはどのように修正すれば良いか考えさせる。

回答は一意でない。



課題の提出

コピーが出回る可能性がある。

回答は一意でない。



プレゼンテーションの実施

61

(62)

プログラミングの手順

問題発生問題解決のアイデア仕様決定

設計

コーディングデバッグ

ドキュメント作成

 問題の分析

 問題解決に必要な仕様の洗い出し

 仕様を実現するための

データ構造、アルゴリズムの設計

 設計に従ってプログラムの作成

 プログラムの誤りの洗い出し

 プログラムの修正

 プログラム開発の記録

 利用者のための使用説明書作成

(63)

プログラミングの手順



どんなプログラムを作るか考えをまとめる。

1.

紙やホワイトボードにアイデアを列挙する。

どんな種類（ゲーム、アニメーション）？

スプライト（キャラクタ）は？、背景は？、マウス操作は？、キー操作は？

2.

アイデアを整理する。

処理の流れ、変数

3.

プログラムを作る

4.

テストする（動作を確認する）

→

直す

→

テストする

→

直す

→

・・・

ある程度できたら、他の人にも体験してもらう。

63