2023-01-26 ピクトグラミングシリーズ第5弾 Picby(ピクビー:Ruby言語版)を公開しました.

Pictogramming(ピクトグラミング),Pictoch(ピクトッチ),Picthon(ピクソン),JavaScpict(ジャバスクピクト)に続くピクトグラミングシリーズ第5弾としてPicby(ピクビー)を公開しました.

 

 

Ruby言語でプログラミングできます.できる処理はピクトグラミングと同様です.他のピクトグラミングシリーズのアプリケーションと同様に全てクライアント側で処理するため安心してお使いいただけます.

 

*「ピクトグラミング」は,ピクトグラムの作成を通じて,プログラミングの諸概念や情報デザインについて学習できる統合型アプリケーションです.「ピクトグラミング」には,「Pictoch(ピクトッチ)」「Picthon(ピクソン)」,「JavaScpict(ジャバスクピクト)」, 「Picby(ピクビー)」の派生アプリケーションもあり,これらをまとめてピクトグラミングシリーズと呼んでいます.授業利用にもぜひお役立てください.誰でも自由に利用できます.サイトのURLは https://pictogramming.org です.

2022-09-16 [関連アプリケーション]「人型ピクソートグラム」及び「人型ピクトグラフ」を公開いたしました.

アプリケーション「人型ピクソートグラム」及び「人型ピクトグラフ」を公開いたしました.通常は,ピクトグラミングのトップページの「関連アプリケーション」の項からアクセスできます.

 

この記事中の「はじめる」ボタンからでもアプリケーションにアクセスできます.

人型ピクソートグラム

 

  

人型ピクソートグラム… シーソーのメタファを用いてソートアルゴリズムについて学習できます.手動操作に加え,代表的なソートアルゴリズムの手順を自動再生することで,視覚的に理解できる機能もあります.伊藤一成研究室所属の渡辺大智さん(学部3年)が開発しています.部品イラストは伊藤一成研究室所属の御家雄一さんが作成しました.

人型ピクトグラフ

 

  

人型ピクトグラフ… 人型ピクトグラムを構成素とする統計図表(ピクトグラフ)を作成できます.算数科・数学科・情報科におけるデータ表現,データ活用の授業を中心にお役立てください.伊藤一成研究室所属の高橋伶奈さん(学部3年)が開発しています.

 

 

(参考文献)

  • 渡辺大智,御家雄一,伊藤一成:人型ピクトグラムを用いたソートアルゴリズムを学ぶアプリケーション「人型ピクソートグラム」の実装,2022年度情報処理学会関西支部支部大会, (2022.09.18)
  • 高橋伶奈,御家雄一,伊藤一成:人型ピクトグラムを構成素とするピクトグラフ生成アプリケーション「Human Pictograph」の実装,2022年度情報処理学会関西支部支部大会, (2022.09.18)

 

2022-08-17 ピクソン及びジャバスクピクトの学習用テキストの内容を更新しました.

ピクソン(Python版)及びジャバスクピクト(JavaScript版)の学習用テキストの内容を更新しました.

更新内容は,2022-08-10の記事で説明しました,

「ピクトグラミングシリーズのピクソン(Python版),ジャバスクピクト(JavaScript版)に線画オブジェクトのグループ化と移動 の機能を追加しました」
の内容を追加し,章だてを再構成しました.

2021-08-10 ピクトグラミングシリーズのピクソン(Python版),ジャバスクピクト(JavaScript版)に線画オブジェクトのグループ化と移動 の機能を追加しました.

ピクトグラミングシリーズのピクソン(Python版)ジャバスクピクト(JavaScript版)に線画オブジェクトのグループ化と移動 の機能を追加しました.

ピクトグラミング及びピクトッチ(ビジュアルブロック版)には既に,実装していた機能です.

 

ピクトグラミングシリーズでは,人型ピクトグラム以外のオブジェクトは基本図形(線分または円)の集合で描きます.従来からフレーム単位の描画(Processingで採用されているような描いて全て消すの繰返し)をすればオブジェクトを移動させる(ように見える)ことはできました.しかしより簡便で理解しやすい方法を実装しています.

一つ以上の基本図形から構成されるオブジェクトを定義できる命令,定義されたオブジェクトを等速直線移動する命令です.

例えば,リンゴを落としてみます.

 

ピクトッチ(ビジュアルブロック版)のプログラムを下に例を示します.

 

ピクソン, ジャバスクピクトではオブジェクトの定義を関数定義で行います.

ピクソンを使った,上のリンゴを落とすアニメーションのプログラムのサンプルは次のとおりです.ピクトッチのプログラムと対比してみていただくと良いと思います.

 

def apple():
    pic.O(211, -50, 42, 42, 0)
    pic.L(211, -55, 211, -85)

pic.RV()
pic.RW("RS", 69, 0)
pic.RW("RE", 41, 0)
pic.MO(apple, 0, 320,0.5)

 

MO(Move Object),MOW(Move Object Wait)という命令(メソッド)があり,それぞれ次のとおりです.関数自体を第一引数にします.ちなみに全体の命令セットはピクソンの使い方のページで参照できます.

命令の様式 処理
pic.MO(func, arg1, arg2, arg3) arg3 秒かけてx軸正方向に arg1 ピクセル, y軸正方向にarg2 ピクセルだけfuncという名称で定義された関数で構成される線画を等速直線移動する.
pic.MOW(func, arg1, arg2, arg3) arg3 秒かけてx軸正方向に arg1 ピクセル, y軸正方向にarg2 ピクセルだけfuncという名称で定義された関数で構成される線画を等速直線移動する.直線移動が終了するまで次の命令は実行されない.

 

ジャバスクピクトの上のリンゴを落とすアニメーションのプログラムのサンプルは次のとおりです.

function apple(){
  pic.O(211, -50, 42, 42, 0);
  pic.L(211, -55, 211, -85);
}

pic.RV();
pic.RW("RS", 69, 0);
pic.RW("RE", 41, 0);
pic.MO(apple, 0, 320,0.5);

 

MO,MOW命令(メソッド)の書式はピクソンと同様です.関数自体を第一引数にします.ちなみに全体の命令セットはジャバスクピクトの使い方のページで参照できます.

命令の様式 処理
pic.MO(func, arg1, arg2, arg3); arg3 秒かけてx軸正方向に arg1 ピクセル, y軸正方向にarg2 ピクセルだけfuncという名称で定義された関数で構成される線画を等速直線移動する.
pic.MOW(func, arg1, arg2, arg3); arg3 秒かけてx軸正方向に arg1 ピクセル, y軸正方向にarg2 ピクセルだけfuncという名称で定義された関数で構成される線画を等速直線移動する.直線移動が終了するまで次の命令は実行されない.

 

 

ちなみにピクトグラミング日本語版の場合,以下のようになります.

反転
回転待ち 右肩 69
回転待ち 右肘 41
物移動 りんご 0 320 0.5

物定義 りんご
円 211 -50 42 42 0
線 211 -55 211 -85
終わり

 

人型ピクトグラムの動きと同様,線画オブジェクトに関してもMO命令とMOWをうまく組み合わせると複数のオブジェクトを表示させたり,複雑な動きをさせることができます.こちらを参考ください

 

近日中に学習用テキストなども更新いたします.

 

[ピクトッチ] 2022-06-04 バグ修正

いつもピクトッチをお使いいただきありがとうございます.

「繰返しブロック」に非常に大きい繰返し回数が設定された場合,そのブロックが「実行ボタンが押されたとき」の内部に配置されていなくても実行されてしまうバグを修正しました.具体的には以下のような例です.

よろしくお願いします.

 

[ピクトッチ] 2022-03-19 ピクトッチ(ピクトグラミング ビジュアルブロック版)の学習用テキストを公開しました。

ピクトッチ(ピクトグラミング ビジュアルブロック版)の学習用テキストを公開しました。

次の章構成になっています.

 

1章 日常生活におけるピクトグラム

2章 逐次(ちくじ)実行,並行(へいこう)実行

3章 似たような処理をまとめる

4章 体の部位を動かして絵を描こう

5章 ピクトスイミング

6章 物体移動

7章 実行ごとに異なった処理をする

8 章 正しく伝える難しさを知る -ピクトグラムデザイン-

 

以下のリンクからダウンロードできます.

ピクトッチ学習用テキスト(8章 20220319版)

 

ピクトグラミングシリーズ(ピクトグラミング,ピクトッチ,ピクソン,ジャバスクピクト)の学習用テキストのページからもダウンロードできます。こちらのページも更新いたしました。

学習用テキスト(ピクトグラミング,ピクトッチ,ピクソン,ジャバスクピクト)

引き続きピクトグラミングシリーズをよろしくお願いします。

 

2022-03-17 The name of the visual block version of “Pictogramming” was changed from “Block Pictogramming” to “Pictoch”

The name of the visual block version of “Pictogramming” was changed from “Block Pictogramming” to “Pictoch” (pronunciation is pictotʃ)

 

We will update the materials and other contents gradually.

 

Links

Pictogramming series top page

Pictoch Application page (PC version)

2022-03-17 ビジュアルブロック版のピクトグラミングの名称を「ブロックピクトグラミング」から「ピクトッチ」に変更いたします.

ビジュアルブロック版のピクトグラミングの名称を「ブロックピクトグラミング(Block Pictogramming)」から「ピクトッチ」に変更いたします.

 

教材等のコンテンツは順次アップデートしていきます.

ピクトグラミング,ピクソン,ジャバスクピクトともども,今後ともご愛顧のほどよろしくお願いいたします.

 

関連リンク

ピクトグラミングシリーズトップページ

ピクトッチ アプリケーションページ(PC版)

明治図書出版 数学教育 2022年 03月号にピクトグラミングに関する記事「ピクトグラム×プログラミング=ピクトグラミング?!」が掲載されました.

明治図書出版 数学教育 2022年 03月号にピクトグラミングに関する記事「ピクトグラム×プログラミング=ピクトグラミング?!」が掲載されました.

ピクトグラミング開発の経緯,ピクトグラミングの概要,数学とも関連が深い図形描画の機能について紹介しています.

ぜひご覧ください.

 

今回のタイトルは依頼されたものをそのまま用いましたが,あえて言えば,「!ピクトグラム×!プログラミング=ピクトグラミング」という感じでしょうか.(!はnotの意味)

日本語で表すと「ピクトグラミングは,ピクトグラムでもあらず,プログラミングでもあらず」です.

ピクトグラムもプログラミングも我々が考えているより遥かに奥深いトピックです.最初の一歩としてそれを伝えるために,授業等でピクトグラミングを使っていただければ本望です.

 

 

情報Ⅰの教科書におけるピクトグラムの扱いについての比較,情報処理学会研究報告 コンピュータと教育,CE162

posted in: 更新情報, 開発者ブログ | 0

情報処理学会研究報告 コンピュータと教育,CE162にて「情報Ⅰの教科書におけるピクトグラムの扱いについての比較」というタイトルで発表されました.

概要:令和 4 年度より高等学校共通教科情報科は,必履修科目の「情報 I」が設置される. 本研究では,各教科書のピクトグラムの掲載状況について調査し比較した. その結果, 分冊分の 1 冊を除く 12 冊すべての教科書に
ピクトグラムに関する記述があるものの,ピクトグラムの定義や取り扱っている掲載ピクトグラムもさまざまで,扱い方も教科書ごとに非常に差異があることが判明した.近年では,ピクトグラムの誤用や乱用も深刻化
の一途をたどっており,ピクトグラムに関して正しい知識や情報を学習する意義は大きく,学習内容の体系化,統一化が望ましい.

予稿はこちらからダウンロードできます.

御家雄一,伊藤一成:情報Ⅰの教科書におけるピクトグラムの扱いについての比較,情報処理学会研究報告 コンピュータと教育,CE162 7p (2021.12.05)

 

本ウェブサイトに掲載した著作物のうち,情報処理学会において投稿・掲載・発表等を行った著作物の利用に関する注意
著作物の著作権は情報処理学会に帰属します.著作物は著作権者である情報処理学会の許可のもとに掲載するものです.ご利用に当たっては「著作権法」ならびに情報処理学会倫理綱領に従ってください