令和３年度県立高等学校教育課程課題研究（情報）授業実践報告Ｂ班

問題解決とコンピュータの活用における思考力・判断力・表現力の指導方法と評価についての研究－情報デザインの考え方を取り入れたプログラミング教育－
１

単元や課題の設定理由・ねらい「情報活用能力」を「学習の基盤となる資質・能力」と位置付け，特に，情報の授業では，問題の発見・解決を図るための知識及び技能，思考力・判断力・表現力等を，情報デザインやプログラミングの学習を通じて身に付けさせることが求められている。学習指導要領では「コンピュータを効率よく活用するために，アルゴリズムを表現する方法を選択し正しく表現する力，アルゴリズムの効率を考える力，プログラムを作成する力，作成したプログラムの動作を確認したり，不具合の修正をしたりする力を養う」と書かれており，「自分の考えやイメージを効率的なプログラムで表現する力」について，身に付けていきたいと考えた。
本研究では，ピクトグラム（図記号）と呼ばれる概念図にプログラミングで動きを付ける演習を通じて，情報デザインやプログラミングに関する知識の理解及び思考力・判断力・表現力等の育成を目標としている。この活動を通じて，プログラミングの観点と合わせて，「対象物や動作の特徴を捉え，必要な情報を取捨選択し適切にピクトグラムで表現する力」を身に付け，目的や受け手の状況に応じて適切かつ効果的な情報デザインを考える力を育成することもねらいとしている。
２

研究内容(1) 単元の目標・対象物や動作の特徴を捉え，必要な情報を取捨選択し適切にピクトグラムで表現することができる。
・アルゴリズムに関する基本的な知識及び技能を身に付け，自分の考えやイメージを効率的なプログラムで表現することができる。
(2) 学習活動に即した評価規準（「思考・判断・表現」の観点のみ）
・相手に伝えたいイメージや自分の考えを，ピクトグラムで的確に表現している。
・ピクトグラムの動作を，繰り返し・条件分岐・関数を使用したプログラムで的確に表現している。
(3) パフォーマンス課題及びその概要
ア

パフォーマンス課題「オリンピック競技・部活動・学校内の施設や状態等に関する，オリジナルの動くピクトグラムをデザインしよう」という課題を設定した。

- 1 -

イ

授業の進め方
①基本的なプログラミングの流れについて説明する。
②ソフトウェア（ピクトグラミング）の操作に関する演習を行う。
③オリジナルのピクトグラムを作成するよう指示する（パフォーマンス課題）。

ウ

事前学習

・情報デザインの考え方に基づいた適切な表現
・フローチャートによる処理手順の理解
エ

ワークシート(ｱ) ピクトグラム作成プリント- 2 -(4) ルーブリック
達成度

観点の説明
次のア，イの両方を満たしている。
ア

相手に伝えたいイメージや自分の考えを，ピクトグラムで的確に表現している。

Ａ（十分満足できる状況）

イプログラムにおいて ，①動作の繰り返し，②条件分岐による動きの変化，③関数による図形の定義と使用 ，④複数の関節が連動し て動く，の① から④の中から二つ以上使用している。

次のア，イのうち，いずれか一方を満たしている。
ア

相手に伝えたいイメージや自分の考えを，ピクトグラムで的確に表現している。

Ｂ（おおむね満足できる状況）

イプログラムにおいて ，①動作の繰り返し，②条件分岐による動きの変化，③関数による図形の定義と使用 ，④複数の関節が連動し て動く，の① から④の中から一つ以上使用している。

(5) 基本となる指導の流れ
時限学習活動

指導上の留意点○基本的なプログラミングの流れに・基本構造などプログラミングの基関する理解

礎知識について，実習の中で体験・Google ブロックリーを用いて，ビジ的に習得できるように工夫する。

ュアルプログラミングを体験する。
・基本構造を理解する。
１○ソフトウェア（ピクトグラミング）の操作に関する演習・ピクトグラムについて，興味・関心がもてるように，東京オリンピ・ピクトグラミングのサイトから，基礎問題を行う。

ックの開会式でのパフォーマンス
を例に示す○ピクトグラムに関する解説○オリジナルのピクトグラムの作成

２

・静止画だけでなく，動作の繰り返・ピクトグラムを作成する。

しという観点からも考察するよう・ピクトグラムに動きをつける。

指示する。
・ピクトグラム制作のポイントとして，静止画としての完成を最低限とすることを伝える。

情報デザインに関する演習は，必要に応じて別途実施する。

- 3 -(6) 評価の進め方（評価方法）
ピクトグラムの作成プリント及び作成した動くピクトグラムのプログラムデータで評価を行った。
情報デザインの観点では「対象物や動作の特徴を捉え，必要な情報を取捨選択し適切にピクトグラムで表現する力」を身に付けることを目標に，「相手に伝えたいイメージや自分の考えを，ピクトグラムによって的確に表現している」点について評価を行った。
プログラミングの観点では「自分の考えやイメージを効率的なプログラムで表現する力」を身に付けることを目標に，①動作の繰り返し，②条件分岐による動きの変化，③関数による図形の定義と使用，④複数の関節が連動して動くなど，「ピクトグラムの動作を，繰り返し・条件分岐・関数を使用したプログラムで的確に表現している」点について評価を行った。
３

授業の状況(1) 指導するに当たって，学校の状況に応じて留意したことやその理由
情報デザイン及びプログラミングについて学習した知識や技能を生かして，自分が設定した条件に沿ったピクトグラムを作成した。また，作成したピクトグラムについてグループで共有して意見交換し，それをフィードバックして改善点を修正するなど，成果物に対して評価・改善する過程を設けた。
ピクトグラムの作成の前に４時間程度，変数，条件分岐，繰り返し，配列，関数など，プログラミングの基本的な要素について学習した。本実践ではブラウザで動作する「ピクトグラミング」を使用しており，プログラミング言語は Python，JavaScript，ブロック型が用意されている。今回の実践は２時間で行ったため，直感的に操作が可能なブロック型のプログラミング言語を使用した。
(2) 授業実践後に協議して設定したルーブリックと典型的な作品例
達成

観点の説明

生徒の作品例度
次のア，イの両方を満たしてＡ（十分満足できる状況）いる。
ア

相手に伝えたいイメージや自分の考えを，ピクトグラムで的確に表現している。

イプログラムにおいて，①動作の繰り返し，②条件分岐による動きの変化，③関数による図形の定義と使用，④複数の関節が連動し［評価に対する注釈］・「ながらスマホ禁止」というテーマを的確にピクトグラムで表現している。
・プログラムにおいて，①動作の繰り返し，④複数の関節が連動した動きの二つを使用している。
- 4 -て動く，の①から④の中から二つ以上使用している。
次のア，イのうち，いずれか一方を満たしている。
ア

相手に伝えたいイメージや自分の考えを，ピクトグラムによって的確に表現している。

Ｂ（おおむね満足できる状況）

イプログラムにおいて，①動作の繰り返し，②条件分岐による動きの変化，③関数による図形の定義と使用，④複数の関節が連動し［評価に対する注釈］
・「走るの注意！」というテーマを的確にピクトグラムで表現している。
・プログラムにおいて，④複数の関節が連動した動きの一つを使用している。て動く，の①から④の中から一つ以上使用している。

［評価に対する注釈］
・「トランポリン」というテーマが表現できていない（動きからは伝わらない）。
・プログラムにおいて，①動作の繰り返し，④複数の関節が連動した動きの二つを使用している。
(3) 「Ｃ（努力を要する状況）」と評価した生徒への指導の手だて
自分が設定したテーマを的確にピクトグラムで表現 できていない生徒には，情報の取捨選択を意識させ，特徴を捉えたデザインの作成を意識させる。テーマが思いつかない
生徒には，身の回りのピクトグラムを考えさせ，ピクトグラムが活用されている場面についてのイメージをもたせる。プログラムができない生徒には，ピクトグラミングの基本動作の練習を行い，動作をつけさせたり， 同じ動作の部分は繰り返しでまとめたり，動作が不自然な箇所については複数の関節を連動して動かしたりするなど，動きの組み立てに関する助言を行う。
４

まとめ及び考察(1) 実習課題について（生徒の取組状況も含めて）ピクトグラミングは，情報デザインとプログラミングを同時に学習することができるため，効率よく学習ができる。また，今回利用したピクトグラミングは，プログラミン
グ言語の理解に時間を費やすことなくプログラムが作成でき ，すぐに動作確認ができる- 5 -ため試行錯誤が行いやすく，生徒が創意工夫しながら取り組む姿が見られた。
また，ピクトグラムのデザインを考えるに当たっては，「 何を誰にどのように伝えるか」という，情報の発信者としての立場や，受け手としての視点を踏まえて考えることができていた。
(2) 評価について
情報デザインの観点では，相手に伝えたいイメージや自分の考えを，ピクトグラムによって的確に表現しているかどうか，プログラミングの観点では，プログラムにおいて，①動作の繰り返し，②条件分岐による動きの変化，③関数による図形の定義と使用，④複数の関節が連動した動きの中から複数使用しているかどうかで評価を行った。
なお，当初のルーブリック案では，情報デザインの観点を含めなかったが，自分の考えやイメージが伝わっていなければ，ピクトグラムとして成り立たないため，ルーブリックに含めることとした。
(3) 授業実践の改善に向けてピクトグラミングの技術指導に当たって，基本的な動作をまず確認し，基本動作をどのように選択して組み合わせることで，イメージや自分の考えを伝えることができるか，十分に考えさせる時間を取りたかった。また，授業プリントに自分の考えや実現したい動きをきちんと書かせるようにしたい。
プログラミングの技術について，ひととおりの技術を学ぶことができる共通課題を準備し，プログラミングの発展的な問題に取り組みたい生徒に別の課題を準備して，生徒の技能に応じた課題を設定する必要があった。
今回は，ピクトグラミングに用意されているプログラミング言語（ Python，JavaScript，ブロック型）のうちブロック型を使用した。時間があれば，ブロック型以外のプログラミング言語を使用し，より高度な動きのあるピクトグラムについて授業で扱っていきたい。
参考文献と参考ＵＲＬ
・ピクトグラミング（青山学院大学 社会情報学部 伊藤一成研究室）
https://pictogramming.org/?page_id=2919
・Google ブロックリー
http://blockly.xmit.org/apps/index.html?lang=ja- 6 -