事例163

情報デザイン・プログラミング・データ分析をカバーするコンテンツ作成環境「ピクトグラミング」

※クリックすると拡大します。

この問題に対処するため、「人型ピクトグラム」に着目して、コンテンツ作成環境である「ピクトグラミング」(※)、およびその派生アプリケーションを開発してきました。今回は、この環境を「情報Ⅰ」、「情報Ⅱ」の主要単元である、「情報デザイン」、「プログラミング」、「データ分析」等の単元に関して、複眼的視点で単元を横断して学習することができる統合学習環境として活用する方式について紹介いたします。

※ https://pictogramming.org/

「ピクトグラミング」は、「ピクトグラム」と「プログラミング」を合わせた造語で、ピクトグラム作成のための環境として作用しますし、一方で、プログラミングを学習する環境としても作用します。こちらが画面のスクリーンショットです。

早速、デモで紹介したいと思います。ピクトグラムを作るという授業説明動画をデモとしてご覧いただきます。 

※クリックすると拡大します。

ピクトグラミングは、教育利用を目的としていますので、英語、日本語、日本語平仮名をサポートする2次言語で記述できますが、その他、派生アプリケーションとしてPython版の学習環境であるPicthon(ピクソン)、JavaScript版の学習環境であるJavaScript(ジャバスクピクト)、ブロック型の学習環境であるブロックピクトグラミングなども準備しています。

それぞれ説明いたします。はじめは、Pythonの手を振るプログラムを例にプログラミングの諸概念を学習するサンプル動画を見ていただきます。 

次に素数判定やソートのプログラムを例にアルゴリズムを学習するサンプル動画を紹介します。

さらにデータの解析や活用の例として、データからインフォグラフィックを作成するプログラムの例を見ていただきます。 

こちらがブロック版のピクトグラミングであるブロックピクトグラミングの、スクリーンショットです。ブロックピクトグラミングを用いて、図形描画によるアルゴリズムの学習を目的とした授業風景のデモをご覧ください。

ここまでいくつかデモを見ていただきました。

Picthon、JavaScpict、ブロックピクトグラミングは、記述する言語が異なるだけで、基本機能は同一です。高等学校では、テキスト型のプログラミングが推奨されていますが、学習者のスキルや授業の目的に応じて使用するアプリケーションを選択することができます。

「同調的学習」がおのずと可能になる環境を作ることができる

なぜ人型ピクトグラムに着目するのか、その理由について説明したいと思います。非常口のマークを例にすると、非常口のマークを策定する上で、マークの中の走る人型を囲む空間が、見る人を包む空間とつながって、走る人は見る人の投影になります。つまり、このピクトグラムを見た人が、表示されている人型のピクトグラムをいかに同一視するかというところに、力点が置かれたといわれています。

また、LOGOの開発者として有名なパパート(S. Papert)は、「学習においては同調的学習が重要である」と述べています。この同調的学習では、いくつかのタイプの同調が提示されています。

一つ目が「身体同調」です。これは学習する内容が自分の身体に対する感覚や知識と強く結び付いているというものです。例えばピクトグラミングでは、「走る」、「手を振る」という身体動作のピクトグラムを作るということに相当します。

次が「自我同調」です。自我同調は、意図や目的、要求、好き嫌いを持った人間としての自意識と一貫していることが重要であるということです。ピクトグラミングを使った実習では、例えば、天使という空想上の人物や、好きなアイドルやタレントの動作、振る舞いといったようなものを模倣して作成するということに相当すると思います。

三つ目が「文化同調」、これは文化にしっかりと肯定的に根を張った活動に結び付いているということです。これは、社会で利活用されているデザイン的なピクトグラムの作成に相当します。このように、人型ピクトグラムに着目することで、知らず知らずのうちに同調的学習を誘発する学習環境を構築することができます。

こちらが作品例です。ピクトグラミングシリーズを使うことによって、このようなデザイン原則に則ったピクトグラムを作ることができます。

情報Iの主な単元の教育目標を網羅できる

最後に、ピクトグラミングを使った情報Ⅰの4単元での活用例について、少し考えてみます。

「(3)コンピューターとプログラミング」の単元では、ピクトグラミングシリーズをプログラミングの開発環境として利用できます。そして、ピクトグラムを作るプロセスの中で、プログラミングの諸概念を学習するだけでなく、従前のプログラミングの実習でよくあるような、文字列を表示するプログラムなども利用できることは、先ほどのPicthonのデモでご紹介しました。

※クリックすると拡大します。

また、「(4)情報通信ネットワークとデータと利用」の単元では、こちらもPicthonのデモで紹介したように、何らかのデータを分析・解析して、その結果をインフォグラフィックのような形式で表示するようなプログラムも作成するというアプローチで、活用することができます。

さらに、ピクトグラムというのは一種の社会の写し絵です。つまり、社会の様々な問題を浮き彫りにする、一つのコンテンツです。情報社会の問題解決のためのアプローチとして、ピクトグラムを活用するような学習が期待できます。

ピクトグラミングシリーズの各種アプリケーション、および授業テキスト、サンプルプログラムなどの関連コンテンツは次のURLからアクセスできます。ぜひご活用ください。

https://pictogramming.org/

第13回全国高等学校情報教育研究会全国大会（オンライン大会）　講演より