2017/8/10

2017年8月10日
電通大学
全国高等学校情報教育研究会
分科会発表

プログラミング的思考を育てる情報科の授業
アサンプション国際高等学校

2017年8月10日
電通大学
全国高等学校情報教育研究会
分科会発表

１．はじめに（聖母被昇天学院高等学校より校名変更）

情報科社会科探究科教諭 岡本弘之
okamoto@assumption.ed.jp

疑問プログラミング教育の目標は？
• プログラム言語の習得か？
• Ｗｏｒｄ・Ｅｘｃｅｌなどの操作授業と同じ？
• 言語は何？はやりすたりはないか？
→将来のＩＴ技術者の育成• プログラミングによる問題解決か？
• アルゴリズムなどプログラミングの考え方の習得• プログラミングを利用して問題解決→問題解決能力の育成【知識・技能】（小）身近な生活でコンピュータが活用されていることや、問題の解決には必要な手順があることに気付くこと。
（中）社会におけるコンピュータの役割や影響を理解するとともに、簡単なプログラムを作成できるようにすること。
（高）コンピュータの働きを科学的に理解するとともに、実際の問題解決にコンピュータを活用できるようにすること。

【思考力・判断力・表現力等】
・ 発達の段階に即して、「プログラミング的思考」（自分が意図する一連の活動を実現するために、どのような動きの組合せが必要であり、一つ一つの動きに対応した記号を、どのように組み合わせたらいいのか、記号の組合せをどのように改善していけば、より意図した活動に近づくのか、といったことを論理的に考えていく力）を育成すること。
小学校段階におけるプログラミング教育の在り方について（議論の取りまとめ）
平成28年6月16日 初等中等教育局教育課程課教育課程企画室
http://www.mext.go.jp/b_menu/shingi/chousa/shotou/122/attach/1372525.htm

2017年8月10日
電通大学
全国高等学校情報教育研究会分科会発表

まとめると• コンピュータの働きを科学的に理解する• 問題解決にコンピュータを活用できる• プログラミング的思考を育成する• プログラミング的思考とは、自分が意図する一連の活動を実現するために、どのような動きの組合せが必要であり、一つ一つの動きに対応した記号を、どのように組み合わせたらいいのか、記号の組合せをどのように改善していけば、より意図した活動に近づくのか、といったことを論理的に考えていく力

２．授業の実践

今回はプログラミング的思考・問題解決の授業紹介12017/8/10

授業を３つやってみました
2.1 授業その１• ペーパープロトタイピングの授業（3時間）

2.2 授業その２• Webサイト「アルゴロジック」を使った授業（1時間）

2.3 授業その３• LEGOマインドストームを使った問題解決の授業（2時間）

授業その１ ペーパープロトタイピング

ペーパープロトタイピングとは？
• ペーパー・プロト
タイピングとは、紙でアプリやサイトをつくってみること(紙芝居のようなものです）（実際の開発の際にも行われている方法です。）

授業その１ ペーパープロトタイピング

企画書の例
タイトル

食事のカロリーを教えてくれるアプリ

ターゲット

体重が気になる高校生むけ

アプリの概要スマートフォンで食事の写真を撮影すると、自動的にカロリーを表示してくれるアプリ

提案の理由

食事のカロリーが気になる人は多いと思うので、売れると思ったから生徒の例：好きなタレントが朝起こしてくれるアプリ
落ち込んだときに励ましてくれるアプリ
添い寝してお話してくれるアプリ

2.1 授業その１
ペーパープロトタイピング（3時間）

授業その１ ペーパープロトタイピング

１時間目：
オリジナルアプリを企画する• オリジナルアプリのアイデアを考え企画書にまとめる

グループで意見交換
こんなア
プリがほしい！

自分の企
画を考える

こういうア
プリは売れる！

企画書にまとめる

このアプ
リを企画
しよう

ターゲッ
ト・開発の理由も授業その１ ペーパープロトタイピング

生徒の企画のアイデアの例• 運動量を計測してアドバイスをくれるアプリ• なくしたものがどこにあるか教えてくれるアプリ• 持ち主の興味のありそうな情報を提供するアプリ• 花や鳥の写真から名前を教えてくれるアプリ• コーディネートを提案してくれるアプリ• 赤ちゃんが何を言っているか教えてくれるアプリ• 写真から誰か知りたいときに教えてくれるアプリ• 相手の顔を写したら考えていることがわかるアプリ• 好きなタレントが出演する情報がすぐわかるアプリ• 服の試着をスマホ内でしてくれるアプリ• 登録されている人の位置がわかるアプリ• 遊びに行くときの大体の予算を計算してくれるアプリ• 歌ったら曲を教えてくれるアプリ（2017年度 高校2年生）

2

2017/8/10

授業その１ ペーパープロトタイピング

授業その１ ペーパープロトタイピング

２時間目
紙でアプリの画面を制作する（参考）ワークシート• アプリの画面を考え、台紙に書いて制作する＜手順＞• 配布した用紙から画面を切り抜く• 台紙に基本の画面（ページ）を３枚以上作る• 一部分が変わる部
分は付箋で表現授業その１ ペーパープロトタイピング

３時間目
発表・相互評価①４人グループの中で順番に発表します• 発表は一人3分程度• 発表内容は• アプリの概要• 開発の理由• 画面の動き• 画面の動きは、紙芝居のように制作した画面を見せながら他の人に説明してください

授業その１ ペーパープロトタイピング

自己評価・相互評価をまとめる＜手順＞①自己評価シートに制作物を貼り付ける（フローチャートのように矢印にそって貼り付ける）②もらった裏にコメントシートも貼り付ける③意見を参考に考察・改善点を記入する④感想を記入する撮影

食べ物を撮影してください②発表を聞く人はいいところ・改善点を記入します

授業その１ ペーパープロトタイピング

５００カロリーです

ダイエ ット
サポ ー トアプ リ

考察・改善点

戻る

撮影

感想・コメント

授業その１ ペーパープロトタイピング

3

2017/8/10

授業その１ ペーパープロトタイピング

授業その１ ペーパープロトタイピング

成果と課題

発表は楽しそう！！
成果• 「プログラミング的思考」育成にはつながる• 創造的な授業で生徒の反応はよかった• 評価はしやすい

課題• これってプログラミングの授業？
• 実際にプログラミングはしていない• フローチャートで書かせてみたらいいかも

授業その２ アルゴロジック

アルゴロジックとは

2.2 授業その２「アルゴロジック」（1時間）
ゲーム形式でアルゴリズム体験ができるWebサイト
ＪＥＩＴＡ（一般社団法人電子情報技術産業協会）
http://home.jeita.or.jp/is/highschool/algo/

授業その２ アルゴロジック（参考）ワークシート

授業その２ アルゴロジック①順次処理 ～順番に処理する～
順次処理（順番に処理する）

4

2017/8/10

授業その２ アルゴロジック

授業その２ アルゴロジック③分岐処理～条件で処理を分ける～②繰り返し処理 ～繰り返す～
繰り返し処理分岐処理（同じことを繰り返す）（条件により処理が変わる）

授業その２ アルゴロジック

授業その２ アルゴロジック

成果と課題

授業のまとめに
例えば信号の渡り方を教えるには

スタート

成果

横断歩道にさしかかる

人間なら・青信号になれば渡りなさい• コンピュータの働きを科学的に説明しやすい

信号を見る

コンピュータなら →・どの信号を見ればいいのか？
・どうすれば渡っていいのか？
・渡るときに車が来たらどうするの？
細かな手順（プログラム）を考える必要がある※最適な手順＝アルゴリズムという信号＝青No

Yes
左右を確認
車なし

• アルゴリズムの説明・基本的な処理・フローチャートについて説明できる• 説明の前の導入に使える• ゲーム教材なので生徒の反応もよいNo

Yes
注意してわたる課題• 評価がしにくい• 進んだレベルで評価？→スクリーンショットの提出？

終わり

授業その２ アルゴロジック

Ｓｗｉｆｔ Ｐｌａｙｇｒｏｕｎｄも使ってみた
Ｓｗｉｆｔ Ｐｌａｙｇｒｏｕｎｄ（ＡｐｐｌｅのiＰadアプリ・無料）• 「コードを学ぼう」でゲーム形式でコードを各自で学ぶことができる• 画面はきれいなので生徒の反応はいい

2.3 授業その３「マインドストーム」４台で（2時間）

アルゴロジックと利点と課題は同じ

52017/8/10

授業その３ マインドストーム

授業その３ マインドストーム

ＬＥＧＯマインドストームを使ってコースその１「ぴたりと止める」• 直線ですすんで的のところでピタリと止める

ここが目標！
8.0m

ダウンロードＬｅｇｏに送信

電源・実行
実行させる

授業その３ マインドストーム

授業その３ マインドストーム

コースその２「まわってすすむ」

授業の手順①「ＰＬＡＮ」

8m

×印付近で一回転させてからゴールの的にたどり着いてください

授業その３ マインドストーム

授業その３ マインドストーム

授業の手順②「ＤＯ」

授業の手順③「ＣＨＥＣＫ」

6

2017/8/10

授業その３ マインドストーム

授業その３ マインドストーム

授業の手順④「ＡＣＴＩＯＮ」

問題解決の手順
Ｐｌａｎ
プログラ
ム回転数を増やそう

動かしてみよう角度を調整しよう

ＡｃｔｉｏｎＤｏ

改善実行

曲がる角度が課題だ！

Ｃｈｅｃｋ

手前で止まった！

確認

ＰＤＣＡサイクルで改善を繰り返す→問題解決（目標達成）へ

授業その３ マインドストーム（参考）ワークシート

授業その３ マインドストーム

評価は問題解決のプロセス！
①プランを立てて②結果を記録

③話し合
い改善

④新たなプラン

授業その３ マインドストーム

2017年8月10日
電通大学
全国高等学校情報教育研究会
分科会発表

成果と課題
成果
• プログラムして動かすと盛り上がる• ４台しかないのがよかった• ２グループに１台＝待ち時間は相談タイムになった• プログラミングによる問題解決の授業ができた

課題

３．考察とまとめ• 本当はもっと複雑にすべきだが・・• 時間の都合でセンサーは使わなかった・・・

72017/8/10

まとめ

まだまだ試行錯誤中・・

2.1 ペーパープロトタイピングの授業（3時間）• 目標と評価は何？

• プログラミング的思考育成につながりそう

2.2 Web「アルゴロジック」を使った授業（1時間）• コンピュータの科学的理解の授業に使えそう

2.3 マインドストームを使った問題解決（2時間）• 何を目標とするべきか• 何を評価するのか• こんな授業でいいのか？
• 高校生ならばもっと高度な内容が必要か？
• 限られた時間数・全員にやらせるならこの程度？
まだまだ悩み中・・・・• コンピュータによる問題解決の授業ができそう

2017年8月10日
電通大学
全国高等学校情報教育研究会
分科会発表

スライド・プリントは公開しています「情報科の授業アイデア」（岡本のＷｅｂページ）• 情報科の先生方、情報交換しましょう！！
okamoto@assumption.ed.jp

情報科 授業検索

http://www.okamon.jp

8