小学校でのプログラミング講座で感じたスクラッチの楽しさ

### はじめに

初めまして！Supershipの伊藤です！

Supershipではエンジニアによる情報発信を進めており、様々な記事を投稿しています。[SupershipのQiita organization](https://qiita.com/organizations/supership-inc)もぜひご覧ください。

実はSupership、検索や広告といった事業の他にも、子どもたちへのキャリア教育など社会貢献活動を通じてミライリアルの幸せを実現するきっかけを提供する活動も行っています！

今回の記事では、小学校のデジタル教育支援活動の一環として開催したプログラミング講座を通して実感した「スクラッチの楽しさ」についてついて触れていきたいと思います！

プログラミング講座についてはこちらの記事をご覧ください！

https://super-stories.com/n/n433ffbde9f98


### スクラッチ(scratch)とは？
> Scratchは、世界最大の子ども向けコーディングコミュニティーで、若者がデジタルな物語、ゲーム、アニメーションを作るために使っている、シンプルなビジュアルインターフェースを持ったコーディング言語です。Scratchは非営利団体Scratch財団によって設計、開発、維持されています。
引用：[Scratchについて](https://scratch.mit.edu/about)

スクラッチはビジュアル型プログラミング言語の1つであり、様々な命名ブロックを組み合わせることでプログラミングをすることができます。

シンプルな操作性や教育向けに無償で提供されていることから、小学校のプログラミング教育で利用されることも多く、文部科学省が作成した[小学校プログラミング教育に関する研修教材](https://www.mext.go.jp/a_menu/shotou/zyouhou/detail/1416408.htm)では、Scratchを使って[正多角形を書く](https://www.youtube.com/watch?v=3fFMSnwTris&list=PLGpGsGZ3lmbDT1aiatXSOfKexgsjfzJ1F&index=4)方法や[ねこ・ねずみを動かす](https://www.youtube.com/watch?v=mTkH5zFyQL8&list=PLGpGsGZ3lmbDT1aiatXSOfKexgsjfzJ1F&index=6)方法について公開されています。

https://www.youtube.com/watch?v=3fFMSnwTris&list=PLGpGsGZ3lmbDT1aiatXSOfKexgsjfzJ1F&index=4

### スクラッチの楽しさ

プログラミング講座を通して感じたスクラッチの楽しさは**自分で書いた絵に命令を与えて動かせる**ことです。

プログラミングというと文法の理解が必要なテキスト型プログラミング言語を思い浮かべますが、スクラッチはブロックを組み合わせることでプログラミングを作成することができ、命令を与える際の文法を気にする必要がありません。また、自分の書いた絵を動かすことができるため、自分だけの世界観の中で表現させることができます。

講座の中では、海の背景に魚を何匹も配置したり、宇宙の背景に星を並べたり、様々な作品が生まれていました。参加した生徒の数人からは「描いた絵が思いどおりに動かせて面白かった」といった感想がもらえるなど、スクラッチには自分で書いた絵に命令を与えて動かせることの楽しさがあると感じました。

スクラッチのサイトでは**アニメーション・アート・ゲーム・音楽・物語・チュートリアル**と分類分けされた作品が公開されており、多種多様な作品に触れることができます。

https://scratch.mit.edu/explore/projects/animations/

#### スクラッチの操作画面 - 絵を描く -

スクラッチで絵を描く方法は2つあり、ステージ(背景)とスプライト(図形)の両方で絵を描くことができます。また、それぞれに命令を与えることが可能です。

<img width = 200 alt="スプライトを選ぶ" src = "https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/340414/d57184ae-d405-537c-376a-47187cf5b5cb.png"><img width = 120 alt="描く" src = "https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/340414/31a0d49f-5c55-5fd4-7b27-1129ca7440b3.png"><img width = 400 alt="絵を描く画面" src = "https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/340414/f4387546-81eb-1ea8-7523-de4288bbac63.png">

操作手順：スクラッチの画面右下にある猫のマークから[スプライトを選ぶ]→[描く]を選ぶ

#### スクラッチの操作画面 - ブロック -
絵を動かすことができるビジュアル型プログラミング言語は他にもありますが、スクラッチはコードと呼ばれるブロックを管理するエリアに**動き・見た目・音・イベント・制御・調べる・演算・変数・ブロック定義**といった9つに分類されたブロックを持ち、それぞれに特定の命令を持ったブロック(以下、命令ブロック)を持っているのが特徴的です。

そのため、自分の絵に「10歩動かす」という命令を与えたときにどういう結果になるかを視覚的に捉えることができ、**コンピュータに命令を与える**ということが理解しやすくなっています。

<img width = 400 alt="命令ブロック" src = "https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/340414/29618a2d-505b-62a0-7f6a-91d121f06a86.png">

操作手順：スクラッチの画面左上のコードを選択して、必要な命令ブロックをドロップ&ドラックする

### スクラッチの操作で気をつけること

#### ステージ(背景)には動きブロックが使えない

スクラッチはステージ(背景)とスプライト(図形)の両方で絵を描き、それぞれに命令を与えることができる一方で、ステージで作成した背景には動きブロックを与えることができません。そのため、スプライトに絵を描いたつもりが、ステージに絵を描いてしまうと描き直しになるので注意が必要です。ステージとスプライトに追加したものは、それぞれスクラッチの画面左上の背景とコスチュームから編集が可能です。

<img width = 300 alt="ステージのコード画面" src = "https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/340414/fbb747ce-4627-594a-559f-7010a497d0f5.png"><img width = 300 alt="スプライトのコード画面" src = "https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/340414/0dd3ed71-1177-5030-204f-b2c064b28196.png">
左図：ステージ(背景)のコード画面 / 右図：スプライト(図形)のコード画面

<img width = 300 alt="背景の画面" src = "https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/340414/352ae79b-1f24-55dc-378c-aee0095f3579.png"><img width = 300 alt="コスチュームの画面" src = "https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/340414/a4ceb4ec-6058-e80f-5c0c-e56a7a341d67.png">
左図：ステージ(背景)の編集画面 / 右図：スプライト(図形)の編集画面

### 実はこんなこともできるスクラッチ
#### Stretch3

実はスクラッチの楽しさは自分で書いた絵に命令を与えて動かせること以外にも、**機械学習を利用できる**ことがあります。

通常のスクラッチには画像認識などの機能はないのですが、TensorFlow.jsを使った機械学習をスクラッチから簡単に体験・利用できる拡張機能([ML2Scratch](https://github.com/champierre/ml2scratch))をはじめ、スクラッチで機械学習を使うための様々な拡張機能が存在します。[Stretch3](https://github.com/stretch3/stretch3.github.io)ではそれらの機械学習の拡張機能を使うことができ、スクラッチのシンプルな操作性と命令ブロックを保ったまま、プログラミングを行うことが可能となっています。

https://stretch3.github.io/

スクラッチでできる画像認識、音声認識、ポーズ推定を活用したプログラミング作品の作り方については[Scratchであそぶ機械学習](https://www.oreilly.co.jp/books/9784873119960/)で紹介されています。

https://www.oreilly.co.jp/books/9784873119960/

#### 小学校プログラミング教育

スクラッチは小学校プログラミング教育で多く使われており、具体的な事例は[小学校を中心としたプログラミング教育ポータル](https://miraino-manabi.mext.go.jp/)※ に掲載されています。

[実施事例](https://miraino-manabi.mext.go.jp/content/285)から一部紹介
- [AI×スクラッチでどんなことができるかな](https://miraino-manabi.mext.go.jp/content/456)
    - AIを生活の中にどのように生かすことができるか考えることを狙いにおいた事例
- [主語と述語に気を付けながら場面に合ったことばを使おう](https://miraino-manabi.mext.go.jp/content/290)
    - 文の中における主語と述語の照応関係や助詞の正しい使い方について理解することに狙いをおいた事例

※ 小学校を中心としたプログラミング教育ポータルは、文部科学省・総務省・経済産業省と民間企業等が連携して設立した未来の学びコンソーシアムが運営しているポータルサイトであり、小学校向けにプログラミングについての説明、教師等向けに実施事例や教材情報等が掲載されている。

### おわりに

今回の記事では、小学校のデジタル教育支援活動の一環として開催したプログラミング講座を通して実感した自分で書いた絵に命令を与えて動かせるというスクラッチの楽しさについて触れながら、スクラッチでできることやスクラッチが小学校のプログラミング教育でどのよう使われているのかを紹介しました。今後、エンジニアとしてプログラミング教育に関わる人に役立てば幸いです。

Supershipではプログラミング講座以外にもネットモラルやマナーについての活動も行っていますで、是非ご覧ください。

https://super-stories.com/n/n39262ed84e94


[Supership](https://supership.jp/)ではプロダクト開発やサービス開発に関わる人を絶賛募集しております。
ご興味がある方は以下リンクよりご確認ください。
[Supership株式会社 採用サイト](https://supership.jp/recruit/)
是非ともよろしくお願いいたします。