6 2月 2021

[ピクソン] print関数をサポートしました．

by admin | posted in: 開発者ブログ | 0

ピクトグラミングPython版ピクソンにprint関数をサポートしました．

ピクトグラムを描画する領域に小人化した人型ピクトグラムが行送りで表示していきます．

例えば，単純な入出力を伴う学習用プログラムが書きやすくなりました．

特にピクソン，ジャバスクピクトは，今後情報I,IIの諸単元の演習もしやすいように少しづつ機能追加していこうと思います．

6 1月 2021

[ピクトグラミング] 情報処理学会　情報教育シンポジウム　SSS2020において，題目”ピクッと-ピクトグラム作成を通じた状態遷移モデルの学習環境 -”が優秀論文賞を受賞しました．

by admin | posted in: トップページに表示する記事, 更新情報, 開発者ブログ | 0

情報処理学会　情報教育シンポジウム　SSS2020において，題目”ピクッと-ピクトグラム作成を通じた状態遷移モデルの学習環境 -”が優秀論文賞を受賞しました．

概要：筆者は，ピクトグラムコンテンツ作成環境「ピクトグラミング」を提案している．ピクトグラミングは，プログラミング学習環境の側面も有し，様々な文脈で利用されている．人型のピクトグラムを変形する命令，線画によるオブジェクト記述のための命令，セーフティーマーク記述のための命令を併用することで，短時間でピクトグラムのデザイン指針に準じたアニメーション効果を含む多様な作品を作成できる．同時にプログラミングの諸概念が学習できるのが特徴である．また，Python言語，JavaScript言語，ビジュアルブロック言語により記述できる派生環境もインターネット公開している．ピクトグラミングおよび派生環境は，手続き型のプログラミングパラダイムをベースとしている．ピクトグラミングの資産を活用しつつ，ピクトグラムの状態とその状態遷移を状態遷移図で表現するピクトグラムコンテンツ作成環境「Picuit（ピクっと）」を新たに開発した．本論文では，その実装方式を中心に論ずる．

論文PDFはこちらから入手できます．

「ピクッと」は，論文では状態遷移を状態遷移図で表現する方式となっていますが，これとは異なる仕様で，Pictogrammingシリーズと同様にWeb公開する予定です（2021-01-31現在）．

13 12月 2020

[ピクトグラミング] ブロックピクトグラミングひらがな版（ピクトグラミングブロック版のひらがな版）の学習用テキスト(58ページ)を公開しました．

by admin | posted in: トップページに表示する記事, 更新情報, 開発者ブログ | 0

ブロックピクトグラミング（ピクトグラミングブロック版）ひらがな版　の授業・自学習用テキスト(58ページ)を公開しました．

ブロックピクトグラミング日本語版のテキストをひらがな分かち書きにしたものです．

以下のような構成になっています．

・にちじょうせいかつにおけるピクトグラム（１章）… ピクトグラムとは何か．ブロックピクトグラミングの基本的な使い方．

・ちくじじっこう，へいこうじっこう（２章） … 命令を決められた順番に一つづつ実行する．複数の命令を同時並行で実行する

・にたようなしょりをまとめる（３章） … 複数の命令を繰り返し実行する場合について．

・からだのぶいをうごかしてえをえがこう（４章） … 体の部位を動かす命令を考えことで様々な図形を描きます．

・あるいてえをかこう（５章） … 人型ピクトグラムの歩行で図形描画する（タートルグラフィックスに相当）テーマで復習する

・じっこうごとにことなったしょりをする（6章） … 条件によって実行する命令を変える

・ただしくつたえるむつかしさをしる（7章） … デザイン指向のピクトグラムを作成するテーマで総復習する

各章の演習問題の解答例も巻末に掲載しています．

こちらからダウンロードできます．

BlockPictogramming(ブロックピクトグラミング) ひらがな

BlockPictogrammingがくしゅうようテキスト(7しょう　20201213ばん)

また，学習用PDFコンテンツのページから，他の各種テキストもダウンロード可能です．ご活用ください．

今後も様々な視点からの研究・実践報告をして，その視点に応じた教材を順次提供していく予定です．授業用スライドがご入用の方はご相談ください．また，学習内容に応じた別のテキストや教授用スライド，クイズプリント等も用意しておりますので，ご関心のある学校の先生方は個別にご相談ください(こちらのページの連絡先からコンタクトください)．

1 12月 2020

[ブロックピクトグラミング] 小学校，中学校向けコンテンツ「図形描画」に特化したシンプルなバージョンを（中心角）更新しました．

by admin | posted in: トップページに表示する記事, 更新情報, 開発者ブログ | 0

ピクトグラミングサイトには，小学校向けコンテンツのカテゴリがあります．

図形描画に特化した2バージョンを（中心角，外角）を以前より公開しています．

右うでを回すことで，多角形を描画する人型ピクトグラムならではの描画方式のバージョンを更新しました．中心角を基に多角形を描きます．こちら（ https://pictogramming.org/editor/blockD2.html ）からアクセスできます．IE(インターネットエクスプローラ)でも動作します．授業利用を想定し，ブロックの種類は数種類に限定しています．各種機能ボタンも極力排除し非常にシンプルな画面構成となっています．

以前のバージョンとの違いは次の通りです．

右うでを回転するブロックの表記を「右うでを（　　）°回転した位置まで線を引く」に変更
「ペンを持たずに右腕を回転する」ブロックの追加
描画スピードを回転角度対して一定になるように変更
人型ピクトグラムの大きさ自体を変更することによる拡大縮小図形の描画

また，いわゆるタートルグラフィックスのバージョンもあります．外角を基に多角形を描きます．ブロックはわずか4種類です．こちらからアクセスできます．IE(インターネットエクスプローラ)でも動作します．

22 11月 2020

[情報I] 情報I教員研修用教材に掲載されているクイックソートをPicthon（ピクトグラミングPython版）で作ってみました．

by admin | posted in: トップページに表示する記事, 更新情報, 開発者ブログ | 0

クイックソートは，情報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)

実行例

19 11月 2020

[情報I] ランダムウォークをPicthon（ピクトグラミングPython版）で作ってみました．

by admin | posted in: トップページに表示する記事, 更新情報, 開発者ブログ | 0

ランダムウォークは，情報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)

実行例

15 11月 2020

[Picthon] ピクソン(ピクトグラミングPython版)を用いた実践事例が情報処理学会誌 Vol.61 No.12（2020-11-15発行）に掲載されました．

by admin | posted in: トップページに表示する記事, 更新情報, 開発者ブログ | 0

神戸大学附属中等教育学校の米田貴先生が執筆された「情報の授業をしよう！：動かして学ぶプログラミングの授業事例 -失敗することも楽しむPythonの授業-」が情報処理学会誌 Vol.61 No.12（2020-11-15発行）pp.1174-1179に掲載されています．

「逐次，並行実行，変数，繰返しなどプログラミングの諸概念を学ぶ上でピクトグラミングの派生アプリ，ピクソンを用いて行った高等学校　教科「情報」におけるプログラミング教育についての実践報告である. ピクソンは，Pythonのプログラムを実行してピクトグラムを作成できる教材である．ブラウザベースで動くこともあり導入が簡単であること，限られた授業時数の中で，プログラミングの習熟度も統一されていない40名前後の生徒に対し一斉授業の形式で授業をしていく上で，生徒自身が楽しみながら試行錯誤を通じて学びやすい教材だと判断し，採用した．7コマ程度の授業で行った実践について報告する．」

記事のダウンロードは以下からできます（情報処理学会非会員の方は発刊後2年間は有料です）．

https://ipsj.ixsq.nii.ac.jp/ej/?action=pages_view_main&active_action=repository_view_main_item_detail&item_id=207722&item_no=1&page_id=13&block_id=8