ピクトグラミングの派生アプリケーションの一つであるPicthonで，共通テスト「情報」で採用予定のDNCL2をサポートしていきます．
まずは，共通テスト「情報」サンプル問題Q2で提示されているプログラム程度は動作するように実装しました．
人型ピクトグラムが頑張って地面に文字列を描いていきます．
画面下のプルダウンで「DNCL2」を選択すると，DNCL2の基本命令がボタン入力できます．今のところ共通テスト「情報」サンプル問題で使われている最低限度の命令のサポートのみですが，正式なDNCL2の仕様は今後公開されると思います．
DNCLは読むために最適化された記述言語なので，それで読み書きすることの一長一短もあるのですが，検討の余地があると考えて，研究，調査も含め開発していきます．
情報処理学会 情報教育シンポジウム SSS2020において，題目”ピクッと-ピクトグラム作成を通じた状態遷移モデルの学習環境 -”が優秀論文賞を受賞しました．
概要：筆者は，ピクトグラムコンテンツ作成環境「ピクトグラミング」を提案している．ピクトグラミングは，プログラミング学習環境の側面も有し，様々な文脈で利用されている．人型のピクトグラムを変形する命令，線画によるオブジェクト記述のための命令，セーフティーマーク記述のための命令を併用することで，短時間でピクトグラムのデザイン指針に準じたアニメーション効果を含む多様な作品を作成できる．同時にプログラミングの諸概念が学習できるのが特徴である．また，Python言語，JavaScript言語，ビジュアルブロック言語により記述できる派生環境もインターネット公開している．ピクトグラミングおよび派生環境は，手続き型 のプログラミングパラダイムをベースとしている．ピクトグラミングの資産を活用しつつ，ピクトグラムの状態とその状態遷移を状態遷移図で表現するピクトグラムコンテンツ作成環境「Picuit（ピクっと）」を新たに開発した．本論文では，その実装方式を中心に論ずる．
論文PDFはこちらから入手できます．
「ピクッと」は，論文では状態遷移を状態遷移図で表現する方式となっていますが，これとは異なる仕様で，Pictogrammingシリーズと同様にWeb公開する予定です（2021-01-31現在）．
ブロックピクトグラミング（ピクトグラミング ブロック版）ひらがな版 の授業・自学習用テキスト(58ページ)を公開しました．
ブロックピクトグラミング日本語版のテキスト をひらがな分かち書きにしたものです．
以下のような構成になっています．
・にちじょうせいかつ に おける ピクトグラム（１章）… ピクトグラムとは何か．ブロックピクトグラミングの基本的な使い方．
・ちくじじっこう，へいこうじっこう（２章） … 命令を決められた順番に一つづつ実行する．複数の命令を同時並行で実行する
・にたような しょり を まとめる（３章） … 複数の命令を繰り返し実行する場合について．
・からだ の ぶい を うごかして え を えがこう（４章） … 体の部位を動かす命令を考えことで様々な図形を描きます．
・あるいて え を かこう（５章） … 人型ピクトグラムの歩行で図形描画する（タートルグラフィックスに相当）テーマで復習する
・じっこう ごとに ことなった しょり を する（6章） … 条件によって実行する命令を変える
・ただしく つたえる むつかしさ を しる（7章） … デザイン指向のピクトグラムを作成するテーマで総復習する
各章の演習問題の解答例も巻末に掲載しています．
こちらからダウンロードできます．
また，学習用PDFコンテンツのページ から，他の各種テキストもダウンロード可能です．ご活用ください．
ピクトグラミングサイトには，小学校向けコンテンツのカテゴリがあります．
図形描画に特化した2バージョンを（中心角，外角）を以前より公開しています．
右うでを回すことで，多角形を描画する人型ピクトグラムならではの描画方式のバージョンを更新しました．中心角を基に多角形を描きます．こちら（ https://pictogramming.org/editor/blockD2.html ）からアクセスできます．IE(インターネットエクスプローラ)でも動作します．授業利用を想定し，ブロックの種類は数種類に限定しています．各種機能ボタンも極力排除し非常にシンプルな画面構成となっています．
以前のバージョンとの違いは次の通りです．
また，いわゆるタートルグラフィックスのバージョンもあります．外角を基に多角形を描きます．ブロックはわずか4種類です．こちらからアクセスできます．IE(インターネットエクスプローラ)でも動作します．
クイックソートは，情報I教員研修用教材第3章「コンピュータとプログラミング」の131ページに掲載されています．これを Picthon を使って書き換えてみました．ちなみに以前選択ソートをPicthonで書き換えたプログラムはこちらにあります．
def quicksort(a, start, end):
m = int((start+end)/2)
i = start
j = end
while(i<j):
while a[i] < a[m]:
i = i+1
draw(a, i, j)
while a[j] > a[m]:
j = j-1
draw(a, i, j)
if i>=j:
break
temp = a[i]
a[i] = a[j]
a[j] = temp
if i==m:
m = j
elif j==m:
m = i
i = i+1
j = j-1
draw(a, i, j)
if start < i-1:
quicksort(a, start, m-1)
if end > j+1:
quicksort(a, m+1, end)
def draw(a, i, j):
pic.CS()
pic.C()
pic.MW(-300,0)
for k in range(len(a)):
pic.SC(a[k] / 200)
pic.ST()
pic.MW(35, 0)
pic.SC(0)
pic.T("⇩", -325 + i * 35, -150, 50)
pic.T("⇩", -325 + j * 35, -150, 50)
pic.W(0.1)
a = [7,22,11,34,17,52,26,13,40,20,10,5,16,8,4,2,1]
draw(a, -1, -1)
quicksort(a,0,len(a)-1)
実行例
ランダムウォークは，情報I教員研修用教材第3章「コンピュータとプログラミング」の147ページに掲載されています．これを Picthon を使って書いてみました．
このような概念をアニメーション表示できます．ただし，ピクトグラムの拡大解釈なので，必ず同時にピクトグラムの本質を説明することに留意しつつ活用していきたいものです．
import random
pic.sc(0.1) # ピクトグラムの大きさを0.1倍にする．
pic.pen_hold() # 体の部分にペンを持つ
pic.penw(1) # ペンの太さを1にする．
for _ in range(1000):
dx = (random.random() - 0.5) * 10
dy = (random.random() - 0.5) * 10
pic.mw(dx, dy, 0.02)
実行例
神戸大学附属中等教育学校の米田貴先生が執筆された「情報の授業をしよう！：動かして学ぶプログラミングの授業事例 -失敗することも楽しむPythonの授業-」が情報処理学会誌 Vol.61 No.12（2020-11-15発行）pp.1174-1179に掲載されています．
「逐次，並行実行，変数，繰返し などプログラミングの諸概念を学ぶ上でピクトグラミングの派生アプリ，ピクソンを用いて行った高等学校 教科「情報」におけるプログラミング教育についての実践報告である. ピクソンは，Pythonのプログラムを実行してピクトグラムを作成できる教材である．ブラウザベースで動くこともあり導入が簡単であること，限られた授業時数の中で，プログラミングの習熟度も統一されていない40名前後の生徒に対し一斉授業の形式で授業をしていく上で，生徒自身が楽しみながら試行錯誤を通じて学びやすい教材だと判断し，採用した．7コマ程度の授業で行った実践について報告する．」
記事のダウンロードは以下からできます（情報処理学会非会員の方は発刊後2年間は有料です）．
ブロックピクトグラミング（ピクトグラミング ブロック版）の授業・自学習用テキスト(51ページ)を公開しました．
以下のような構成になっています．
・日常生活におけるピクトグラム（１章）… ピクトグラムとは何か．ブロックピクトグラミングの基本的な使い方．
・逐次実行，並行実行（２章） … 命令を決められた順番に一つづつ実行する．複数の命令を同時並行で実行する
・似たような処理をまとめる（３章） … 複数の命令を繰り返し実行する場合について．
・体の部位を動かして絵を描こう（４章） … 体の部位を動かす命令を考えことで様々な図形を描きます．
・歩いて絵を描こう（５章） … 人型ピクトグラムの歩行で図形描画する（タートルグラフィックスに相当）テーマで復習する
・実行ごとに異なった処理をする（6章） … 条件によって実行する命令を変える
・正しく伝える難しさを知る（7章） … デザイン指向のピクトグラムを作成するテーマで総復習する
各章の演習問題の解答例も巻末に掲載しています．
こちらからダウンロードください．
学習用PDFコンテンツのページ から，他の各種テキストもダウンロード可能です．ご活用ください．
Picthon(ピクトグラミングPython版)，JavaScpict(ピクトグラミングJavaScript版)の授業用，自学習用テキストを更新しました(11章構成になりました)．
以下のような構成になっています．
・逐次実行（１章）… 命令を決められた順番に一つづつ実行する
・並列実行（２章） … 複数の命令を同時並列に実行する
・繰返し（３章） … 複数の命令列を繰り返し実行する
・変数（４章） … プログラムの途中で変化する値を扱う
・総復習I（５章） … ピクトグラムの部位の動作で図形描画するテーマで復習する
・リスト・タプル(６章) …一連のまとまった値の集合を扱う
・算術式（７章）… 算術式を記述する
・条件分岐，条件式（8章） … 条件によって実行する命令を変える
・関数（９章） … 一連の処理をまとめて定義し，再利用性を高める
・総復習II（１０章） … デザイン指向のピクトグラムを作成するテーマで復習する
・応用I( １１章） … インフォグラフィックを作成する
こちらからダウンロードください．
学習用PDFコンテンツのページ から，他の各種テキストもダウンロード可能です．ご活用ください．