[ピクトグラミング] 様々な形状の塗りつぶし図形をこれまでより簡単に描けるようにしました.

posted in: 開発者ブログ | 0

PEN命令はこれまで,arg1がSQUAREあるいはROUNDで線の端点の形状を決めていましたが,これは線画を描くときに折れ線部をどう補完するかが焦点でした.

しかし,線の端点に形状を付加しないBUTT(端無し,はしなし)をいう属性を追加しました.これにより線画だけでなく,様々な塗りつぶし図形をより簡単に描けるようにしました.

命令の様式 処理
PEN arg1 arg1 がUPの場合,ペンを上げる.DOWN の場合,ペンを下げる.arg1がSQUAREの場合,線の両端の形状は四角,arg1がROUNDの場合線,両端の形状に丸を付加する.arg1がBUTTの場合は両端に形状を付加しない.初期状態はペンが上がっている状態で,線の両端の形状は四角.

 

例えば,こんなピクトグラム (「日常のひとこま」に掲載)が簡単にできるようになりました.標準の人型ピクトグラムに台形を重ね合わせた女性のピクトグラムです.

[ピクトグラミング]英語命令版テキストを更新しました!

posted in: 開発者ブログ | 0

以前ご報告しました仕様の多少の変更に伴い,すでに日本語命令版テキストは更新していましたが,今回英語命令版テキストを更新しました.

以下の点が変わっています.

  1. マウスドラックで自動生成される命令が「R  PARTS ANGLE」から「RW PARTS ANGLE TIME」に変わった.
  2. 変数の使い方が「valName」から「:valName」に変更した.

です.授業等でご活用ください.

 

「ピクトグラミング」人型ピクトグラムを介したteachingからlearning への転換 「ピク友」 

posted in: 開発者ブログ | 0

ピクトグラミングを実装している理由の一つにteachingからlearning への転換があります.

 

ここで二者の関係を例に示します.図1の例は上側の人間が教える方,下側の人間が教えられる方を示しています.一斉教授型の授業では上側の人間が教員,下側の人間が児童・生徒・学生と考えてみてもらっていいと思います.この関係の間に,人型ピクトグラムを介在させてみます(図2参照).

教員,学習者のピクトグラミングを使用した授業におけるコード入力を,教員から画面上に配置される人型ピクトグラムへの教授,学習者から画面上に配置される人型ピクトグラムへの教授とみなします(図3のteachingの関係).今回はアプリケーションを使ったピクトグラミング(狭義のピクトグラミング)に存在する人型ピクトグラムとします.するとこれまで,一方的な関係だった教員と学習者の両者が同一の関係になります.その認識の上で必要であれば模倣し合う,一種のlearningの関係を喚起できる(図3のlearningの関係)と考えています.人間間のteachingの関係を突然learningの関係にするのは必ずしも容易ではないので,既存のteachingの関係を維持しつつlearningの関係を構築していきます.

 


図1

 


図2

 


図3

次に教育をめぐる人間関係という別の枠組みで説明します(図4参照).教育をめぐる人間関係は複雑です.例えば,ある教育学者がこう明言した,ある教育委員会がこう取り決めたという規則が一方的に伝わり,伝搬されるという上位下達的な構造の問題があります.今回は,木構造の人間関係図を使用して説明しますが,構造に制限はなく一般的な人的ネットワークを想定しても同様なことが言えます.ここにも先ほどと同様に人間と人間の間にピクトグラムを介在させます(図5参照).全ての人型ピクトグラムを重ね合わせ一体化しグラフの構造を畳み込み,再構成すると,いかなる構造の人間関係も人型ピクトグラムを中心とする放射状の図6に示す構造になります.

つまり人間が人型ピクトグラムへ教授するという関係になり,人間から見れば全ての関係が同一になります.先と同様その認識の上で必要であれば模倣し合う,一種のlearningの関係を喚起できるでしょう.このような人型ピクトグラムを介した人間と人間の関係を「ピク友」と呼びたいと思います.

 

図4

図5

 

図6

アプリケーションとしてのピクトグラミングに限らず,人型ピクトグラムを介在させれば,ヒューマンピクトグラムアンプラグドのピクトカードでも,3Dプリンタで作った人型ピクトグラムのオブジェでも,世の中に長年にわたり存在し我々人間を見守ってきた公共サインに含まれる人型ピクトグラムでも構いません.人型ピクトグラムを介在させることで社会をよりよくする考え方それがピクトグラミング(広義のピクトグラミング)です.

[ピクトグラミング]日本語命令版テキストを更新しました!

posted in: 開発者ブログ | 0

以前ご報告しました仕様の多少の変更に伴い,公開している日本語命令版テキストを更新しました.

以下の点が変わっています.

  1. マウスドラックで自動生成される命令が「回転 部位 角度」から「回転待ち 部位 角度 時間」に変わった.
  2. 変数の使い方が「変数名」から「:変数名」に変更した.

です.授業等でご活用ください.

 

英語版テキストの更新は2018年2月5日ごろを予定しています.

あなたが描きたいものが四角形なのか?それとも人型ピクトグラムのために四角形を描くのか?

posted in: 開発者ブログ | 0

新学習指導要領では,小学校第5学年算数科に多角形の性質を学ぶ学習場面が例示されています.そのため昨今,タートルグラフィックスを利用した授業実践例が数多くレポートされています.

ピクトグラミングでは,タートルグラフィックスに相当するピクトグラフィックスに加え,人型ピクトグラムのアニメーションを作成するピクトアニメーションがあります.

 

もし,小学校5年生のあなたが多角形を描きたいと思わないのに授業で描かないといけなくなってしまったら,人型ピクトグラムのために描いてあげてください.人型ピクトグラムは普段は何もない空間にいるので,四角形があるだけでとても喜びます.またもし気が向いたら人型ピクトグラムをピクトアニメーションを使って,その四角形で色々楽しませてあげてください.その人型ピクトグラム,案外あなたと趣味,興味や考え方が似ているので気が合うと思います.

河合塾の「キミのミライ発見」でピクトグラミングが紹介されました.

posted in: 開発者ブログ | 0

神戸大学附属中等教育学校米田 貴先生による「ヒューマンピクトグラムと共に学ぶ情報の科学 」が河合塾の「キミのミライ発見」で紹介されました.ピクトグラミングに関する内容も掲載されています.ぜひご覧ください.

https://www.wakuwaku-catch.net/jirei1876/

 

[ピクトグラミング]IE(インターネットエクスプローラ) 利用における禁止,注意,指示マークを伴う画像,アニメーション生成機能の対応

posted in: 開発者ブログ | 0

おかげさまで,ピクトグラミング今年に入り,早速のいくつかの小学校,中学校,高校大学で使っていただいているのは以前ご報告した通りです.

学校機関で使っていただこうと思うと,IEしか入っていないのでという学校も少なくありません.ピクトグラミングは学校で使っていただくことを念頭に入れているので,当然対応して行くわけですが,これが結構大変です.

以前,公開直後に,「IE(インターネットエクスプローラ) 利用における画像,アニメーション,プログラムダウンロード機能,及びプログラムアップロード機能の対応」で書いた通り,IEでそもそも画像,アニメーションの生成ができなかったのでこれを対応しました.対応したつもりでいたのですが,今回IEしか使うことができない学校で,生成したピクトグラムを画像やアニメーション形式で保存してポスターサイネージ等で利活用してもらうという授業をやっていただいている先生から,「禁止,注意,指示マークがついていると画像,アニメーションが生成されない」というご連絡,調査してみると,SVG(Scalable Vector Graphics)ファイルを読み込んで,今回適用している方式で画像を生成するとセキュリティ違反が出ることがわかり,禁止,注意,指示マークはPNG形式の画像に変更することにしました.これにより,IEで,禁止,注意,指示マークを伴う作品でも画像,アニメーションで出力できるようになりました.ご報告です.

 

 

 

学研・進学情報(2018年2月号)の中で「ピクトグラミング」が紹介されました.

posted in: 開発者ブログ | 0

学研・進学情報(2018年2月号)「失敗しても面白い! プログラミングを楽しく学ぶ」という神戸大学附属中等教育学校 米田貴先生の実践記事の中で「ピクトグラミング」が紹介されました. 全国の高校や学研模試の受験生に配布されるとのことです.

https://www.gakuryoku.gakken.co.jp/category/news/

ライターの方のご厚意によりPDFもダウンロードできます.

http://www.edu.kobe-u.ac.jp/kuss-top/school/pdf/H29/20180115.pdf

 

[ピクトグラミング] 自撮り(Selfie)

posted in: 開発者ブログ | 0

自撮りが好きなNさんという知人がいまして,拝見していると手順は以下のようです.

 

(1) はじめに,背景となる場所を決める.

(2) 含めたい可動なオブジェクトがあれば,それらを自分で動いて配置し構図を整える.

(3) 最後にポーズをとって,その構図の中に自身が収まる.腕・足の伸ばし方等々の姿勢や,自分の相対位置,表情などが満足でないと,再度微妙にそれらを変化させ,満足がいく一枚が撮れるまで撮影を繰り返す.

 

ピクトグラミングでは,大別して人型ピクトグラムのポーズを決めるピクトアニメーション命令と,人型ピクトグラム自身が動き,その軌跡で図形を描くピクトグラフィックス命令の2種類の命令があり,その両者を組み合わせることで様々なピクトグラムが作成できるようになっています.その場合の作成プロセスは次の通りです.例えば,日常のひとコマに掲載している「段差注意」を例にとってみましょう.

(1′) はじめに,トピックを決める(今回は段差注意)

(2′) 含めるオブジェクト(今回は段差のある床)を人型ピクトグラム自身が動いて描き,構図を整える.

定義 段差
倍率 0.2
移動 −120 200
ペン 下げる
ペン幅 10
右回り 90
前進 180
右回り 90
前進 30
左回り 90
前進 100
ペン 上げる
終わり

注意
実行 段差

(3′) 最後に人型ピクトグラムがポーズをとってその構図の中に収まる.腕・足の絶対角度,ピクトグラムの相対位置や倍率が満足でないと,再度微妙にそれらを変化させ,満足がいくまで試行錯誤を繰り返す.

 

定義 こける
倍率 0.5
回転 体 45
回転 体 15 0.2
回転 左上腕 −120 0.2
回転 左前腕 45 0.2
回転 右上腕 45 0.2
回転 右前腕 90 0.2
回転 左大腿 20 0.2
回転 左下腿 −60 0.2
回転 右大腿 45 0.2
回転 右下腿 −60 0.2
終わり

 

定義 段差
移動 −120 200
ペン 下げる
ペン幅 10
右回り 90
前進 180
右回り 90
前進 30
左回り 90
前進 100
ペン 上げる
移動 −180 ー120
終わり

 

注意
実行 段差
実行 こける

おわかりの通り,自撮りの撮影プロセスと同一の手順を踏みます.Nさんが自撮りできない場合に,私がNさんの指示に従って撮影することもあるのですが,その場合でも,つまり自撮りでない通常の撮影でも同じ手順を踏みます.ピクトグラミングでは,同調的学習(Syntonic learning)を重視していて,人間が普段から何気なく行なっている一連の動作,操作と同じプロセスでコンテンツを作り,また最終的に普段から馴染みのある事象について表現できるように工夫されているのが特徴の一つです.

 

一つだけ違うところといえば,Nさんは表情豊かな方で,自撮りの際は実に様々な表情を作られるのですが,ピクトは一切表情を顔に出さないところでしょうか.

 

[ピクトグラミング] 正しく伝える難しさを知る

posted in: 開発者ブログ | 0

日常のひとこまに何か追加しようと思いまして,メジャーなところで「歩きスマホ禁止」を作ってみようと思い,作ったものをTwitterに投稿したところ,下のようなご指摘がありました.(背景が黒になっているかもしれませんが,それは透過です.)

 

Twitterを見た学生からも「先生これは歩きスマホ禁止というより撮影禁止ですね.」と言われ,初めて「ああなるほど」と納得し,作り直したのがこれ.

 

そうしていたところ,「ねこでした」さんが,アニメーション版の歩きスマホ禁止を作ってくれました.これは秀逸です.体の各部品とスマートフォンの角度や動きといい見事です.さりげなく片手をポケットに突っ込んでいるところも渋い.

正しく伝えるピクトグラムを作るのは,思っている以上に難しいです. 伝える難しさもピクトグラミングで体験できます.