2021-09-14 ピクトグラミングに1. 反転表示,2. 線画オブジェクトのグループ化と移動 の機能を追加しました.

posted in: 開発者ブログ | 0

ピクトグラミングを更新しました.PC・タブレット版,スマートフォン版両方です.

追加した機能は

1. 反転表示

2. 線画オブジェクトのグループ化と移動

です.

いずれもすでに先行してブロックピクトグラミングには反映していましたが,ピクトグラミングにも反映させました.

1. 反転表示

ピクトグラムというとサイン用途で使われるものが有名ですが,コミュニケーション用途で用いるピクトグラムのデザイン指針を定めたJIST0103(コミュニケーション支援用絵記号デザイン原則)およびISO19027(Design principles for communication support board using pictorial symbols)では,サイン用途の配色と反転した,黒背景に白のピクトグラムが推奨されています.そのため「RV」(Reverse)の命令を追加しました.

 

命令の様式 処理
RV 反転モード(Reverse mode)に変更する。

 

英語表記 英語 日本語 にほんご
RV Reverse 反転 はんてん

 

 

 

 

2. 線画オブジェクトの移動

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

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

 

 

命令の様式 処理
DO arg1 対応するEND命令までに含まれるL命令,O命令の組み合わせで描かれる線画をarg1という名称で定義する.
MO arg1 arg2 arg3 arg4 arg4 秒かけてx軸正方向に arg2 ピクセル, y軸正方向にarg3 ピクセルだけarg1という名称で定義された線画を等速直線移動する.
MOW arg1 arg2 arg3 arg4 arg4 秒かけてx軸正方向に arg2 ピクセル, y軸正方向にarg3 ピクセルだけarg1という名称で定義された線画を等速直線移動する.直線移動が終了するまで次の命令は実行されない.

 

英語表記 英語 日本語 にほんご
DO DefineObject
defineobject
物定義 ものていぎ
MO MoveObject
moveobject
物移動 ものいどう
MOW MoveObjectWait
moveobjectwait
物移動待ち ものいどうまち

 

ブロックピクトグラミングと,同じ実行結果になるピクトグラミング(日本語版)のプログラムを下に例を示します.「物体を定義するためDO(物定義)命令を使って「りんご」というラベルを設定して定義しています.内部には,円と線分を描く二つの命令があります.これが構成要素となります.平行移動する命令(MO 物移動,MOW 物移動待ち)があり,これにより「りんご」が等速で落下します.オブジェクトの作成を通じて,複数の命令をまとめラベリングする手続き化の処理に慣れ親しんでもらいます

 

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

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

 

 

 

 

アプリケーション下側の命令入力支援領域のボタンも更新しました.

 

 

作品集のページの「やり投げ」もこの機能を使ったバージョンに更新しました.引き続きピクトグラミングシリーズをよろしくお願いします.

再帰と視点

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

関数や手続きの中で自分自身を呼び出す処理を再帰呼出しといいます.

プログラミングを学習する際,この再帰の概念でつまづく人も少なくありません.

 

懸垂を10回するプログラムを例に再帰について考えてみたいと思います.


図 (1)

 


図 (2)

 

これを再帰を使わずにブロックピクトグラミング(ピクトグラミングブロック版)で作成した例です.回数を引数指定して懸垂をする関数(実際は手続き)「懸垂」,図(1)の状態にする手続き「初期状態」と,図(1)→図(2)→図(1)の状態変化をアニメーションで表現する手続き「1回曲げ伸ばし」が定義されておりこちらは折りたたんで表示してあります.人型ピクトグラムとは異なる視点である第三者視点だと,繰返しを使った表現が思いつくでしょう.

 

次に再帰を使って,記述してみます.こちらは関数(実際には手続き)「懸垂」の中で「懸垂」を呼び出しています.皆さん1回懸垂をしては,あと何回だ!がんばろう!と繰り返し念じた経験はないでしょうか?もちろん懸垂以外の,腕立て伏せ,トラック一周,漢字の書き取り…..など繰り返す処理であれば同じことが言えます.これは,実際に懸垂をする人型ピクトグラムになりきって考えた視点と考えられるでしょう.

再帰の考え方を教えるのにご苦労されている先生方多いと思います.ハノイの塔だったり,再帰図形だったりと色々工夫されたりしますが,一度こういうのからスタートするのはいかがでしょうか?いかなる人も反復的な身体動作に関する身体知は有していると思います.

 

Pictogrammingについて

 

 

 

 

 


 

Pictogrammingは、

ためのツールです。

 

ピクトグラムを作る

 

8個の可動パーツに加え、体の向きや色・表情も変更できます。

アニメーションにも対応しているため、幅広い表現が可能です。

プログラミングを
学び始める

 

ピクトグラミングは、テキスト型の擬似言語、ビジュアルブロックに加えPython, JavaScriptなど、複数のプログラミング言語で実行できます。

そのため同じピクトグラムを別言語で作れば、各言語の特徴を実践的に学ぶことができます。

情報デザインを学ぶ

 

ピクトグラムは「インフォグラフィックス」の構成要素の1つです。

ここで言うインフォグラフィックスとは、情報やデータを分かりやすく図示したものです。

情報を分かりやすく伝えるためにどのようなピクトグラムを作るか、それを考えることが情報デザインの学習に直結します。

 

 


 

 

普遍的な記号でありながら私たちの分身でもあるピクトグラムを通して、

 

・社会の諸問題の発見・解決
・自分の内面にある何かを表出
してみませんか?

 

スマートフォン版使い方_JavaScpict

posted in: 開発者ブログ | 0

JavaScpict ジャバスクピクト (ピクトグラミング JavaScript版) 使い方

画面の説明

画面は3つの部分から構成されます.上側は,ピクトグラムを表示する「人型ピクトグラム表示領域」,中央は,プログラムを記述する「プログラムコード入力領域」,下側はプログラムの入力を支援する「プログラムコード入力支援ボタン」です。

プログラムコード記述領域にプログラムを入力することで,人型ピクトグラムのポーズを変えたり動かしたりすることができます。また,「プログラムコード入力支援ボタン」を押すとその命令文を「プログラムコード記述領域」に追加できます.JavaScpictでは,JavaScript言語でプログラミングできます.

 

利用目的に応じたオプション

JavaScpictでは利用の目的に合わせて4つの機能をオンオフできます.

画像(名称) 説明
(座標系表示) 画像の右に表示されているチェックボックスをオンにすると,座標系が表示されます.座標はXY座標系(X方向とY方向の値,両方を組み合わせて位置を表現する)です.横方向がX座標で左端の-320から右端の320まで,縦方向がY座標で上端の-320から下端の320までをとります.つまり,中心が(0,0),左上が(-320,-320),右上が(320,-320),左上が(-320,-320),右上が(320,-320),つまりX軸正方向が右,Y軸正方向が下となります.数学の座標軸とY軸だけ逆方向なので注意して下さい.
(ドラッグ不可)*標準でオン 画像の右に表示されているチェックボックスをオフにすると,人型ピクトグラムは「ピクトグラム表示パネル」上でピクトグラムの体の部位を直接ドラッグすることででも操作することができます。また,ピクトグラム表示領域上で,始点を人型ピクトグラムの体の部分以外の点にして,終点までドラックすると,線分が描けます.

 

コントロールボタン

ピクトグラミングでは再生・停止などのコントロールは,コントロールボタンから制御します.

画像(名称) 説明
(初めから再生) はじめから再生する.
(一旦停止) 停止します.
(停止位置から再生) 停止している状態から再生します.
(すべてクリア) プログラムコード入力領域に記述されているプログラムをすべて消去します.消去前に確認のダイアログボックスが表示されます.

さあ!始めよう

まずは,1時間で学ぶジャバスクピクトからはじめてみましょう.

 

作成コンテンツのダウンロード

 

作成したコンテンツのダウンロードは2通りあります。

 

[1. ショット画像のダウンロード]

(1)画像ダウンロードボタンを押すと,作品名.png の名前でショット画像が保存されます.

[2. アニメーションのダウンロード]

(1)動画ダウンロードボタンの右側にあるチェックボタンをオンにします.

(2)一度最初から最後まで実行します.ゆっくり実行されますが,内部的にはアニメーション画像が動的に生成されています.

(3)動画ダウンロードボタンを押すと,作品名.gif の名前でアニメーション画像が保存されます.

 

 

 

命令セット一覧

 

画面右上のプログラムコード記述領域に命令を入力し定義します.入力文字列は動作や状態を変化させるための「命令」コードと,引数列を空白で区切る以下の方式です.

pic.命令(引数1, 引数2 ....);

命令セット一覧 人型ピクトグラムの動きの変化を表現できる「ピクトアニメーション」,移動の経路が線で引かれることで図形を描く「ピクトグラフィックス」の2種類の命令から構成されています.また両方に共通して使用される変数定義,繰返し,条件分岐等の命令が用意されています.

ピクトアニメーション命令一覧

命令の様式 処理
pic.R(arg1, arg2, arg3, arg4); arg4 秒後にarg1で指定される体の部位を反時計回りにarg2 度だけarg3 秒かけて支点を中心に等速回転する.arg4 が 省略された時は,arg4 に0が,arg3arg4 の両方が省略された時はいずれも0が入力されているものとして取り扱う.
pic.RW(arg1, arg2, arg3); arg1で指定される体の部位を反時計回りにarg2度だけarg3秒かけて支点を中心に等速回転する.回転が終了するまで次の命令は実行されない.arg3が省略された時は,arg3に0が入力されているものとして取り扱う.
pic.M(arg1, arg2, arg3, arg4); arg4秒後にarg3秒かけてx軸正方向に arg1ピクセル, y軸正方向にarg2ピクセルだけ全体を等速直線移動する.arg4が省略された時は,arg4に0が,arg3arg4の両方が省略された時はいずれも0が入力されているものとして取り扱う.
pic.MW(arg1, arg2, arg3); arg3 秒かけてx軸正方向に arg1 ピクセル, y軸正方向にarg2 ピクセルだけ全体を等速直線移動する.直線移動が終了するまで次の命令は実行されない.arg3が省略された時は,arg3に0が入力されているものとして取り扱う.
pic.FR (); 人型ピクトグラムを正面向きにする.(初期状態)
pic.SD (); 人型ピクトグラムを側面向きにする.
pic.C (); 人型ピクトグラムの状態を初期状態にする.
pic.SC(arg1); 人型ピクトグラムの拡大率を標準(初期状態)のarg1倍にする.
pic.SP(arg1); 文字列 arg1 を発話する.
pic.MS(arg1);
人型ピクトグラムにお面を装着する.装着するお面の種類はarg1で指定される.

arg1 がANGERの場合,怒りのお面
arg1 がDISGUSTの場合,嫌悪のお面
arg1 がFEARの場合,恐れのお面
arg1 がHAPPINESSの場合,喜びのお面
arg1 がSADNESSの場合,悲しみのお面
arg1 がSURPRISEの場合,驚きのお面
がそれぞれ装着される.
またarg1にNONEを指定すると装着しているお面を外すことができる.

pic.PS(arg1);
人に仮面を装着する.装着する仮面の種類はarg1で指定される.

arg1 がANGERの場合,怒りの仮面
arg1 がDISGUSTの場合,嫌悪の仮面
arg1 がFEARの場合,恐れの仮面
arg1 がHAPPINESSの場合,喜びの仮面
arg1 がSADNESSの場合,悲しみの仮面
arg1 がSURPRISEの場合,驚きの仮面
がそれぞれ装着される.
またarg1にNONEを指定すると装着している仮面を外すことができる.

pic.SAY(arg1, arg2, arg3); arg3 秒後にarg1で指定される値をarg2秒だけ吹き出しで表示するarg3 が 省略された時は,arg3 に0が,arg2arg3 の両方が省略された時はいずれも0が入力されているものとして取り扱う.
pic.SAYW(arg1, arg2); arg1で指定される値をarg2秒だけ吹き出しで表示する.吹き出しの表示が終了するまで次の命令は実行されない.

ピクトグラフィックス命令一覧

命令の様式 処理
pic.FD(arg1, [arg2]);
人型ピクトグラムを進行方向にarg2 秒かけて距離 arg1 だけ等速で進める.arg2 が 省略された時は,arg2 に0が入力されているものとして取り扱う.
pic.BK(arg1, [arg2]);
人型ピクトグラムを進行方向と逆向きにarg2 秒かけて距離 arg1 だけ等速で進める.arg2 が 省略された時は,arg2 に0が入力されているものとして取り扱う.
pic.RT(arg1, [arg2]);
人型ピクトグラムの進行方向をarg2 秒かけて時計回り方向に角度 arg1 だけ等角速度で回転する.arg2 が 省略された時は,arg2 に0が入力されているものとして取り扱う
pic.LT(arg1, [arg2]);
人型ピクトグラムの進行方向をarg2 秒かけて反時計回り方向に角度 arg1 だけ等角速度で回転する.arg2 が 省略された時は,arg2 に0が入力されているものとして取り扱う.
pic.FDW(arg1, [arg2]);
人型ピクトグラムを進行方向にarg2 秒かけて距離 arg1 だけ等速で進める.移動が終了するまで次の命令は実行されない.arg2 が 省略された時は,arg2 に0が入力されているものとして取り扱う.
pic.BKW(arg1, [arg2]);
人型ピクトグラムを進行方向と逆向きにarg2 秒かけて距離 arg1 だけ等速で進める.移動が終了するまで次の命令は実行されない.arg2 が 省略された時は,arg2 に0が入力されているものとして取り扱う.
pic.RTW(arg1, [arg2]);
人型ピクトグラムの進行方向をarg2 秒かけて時計回り方向に角度 arg1 だけ等角速度で回転する.回転が終了するまで次の命令は実行されない.arg2 が 省略された時は,arg2 に0が入力されているものとして取り扱う.
pic.LTW(arg1, [arg2]);
人型ピクトグラムの進行方向をarg2 秒かけて反時計回り方向に角度 arg1 だけ等角速度で回転する.回転が終了するまで次の命令は実行されない.arg2 が 省略された時は,arg2 に0が入力されているものとして取り扱う.
pic.PEN(arg1, [arg2]);
arg1 がUPの場合,ペンを上げる.DOWN の場合,ペンを下げる.arg1がUPまたはDOWNの時は,ペンの上げ下げをする体の部位の名称をR,RW命令と同様の表記でarg2に指定できる.arg1がFILLの時は,R,RW命令と同様の表記で指定されたarg2の体の部位の座標を含む閉じた線画の内部を塗りつぶすことができる.arg2が省略された場合は BODYが記述されているものとみなされる.

ペンの両端について,arg1がSQUAREの場合,線の両端の形状は四角,arg1がROUNDの場合線,両端の形状を丸を付加する.arg1がBUTTの場合は両端に形状を付加しない.ペンの種類について,arg1 が NORMALの場合は実線を,ERASEの場合は線を消す,XORの場合はすでに描かれていた部分は消し,そうでない部分は描く(反転).

初期状態はペンが上がっている状態で,線の両端の形状は四角(SQUARE),ペンの種類はノーマル(NORMAL).

pic.PENW(arg1); ペンの太さ(幅)を arg1 にする.初期状態は15.
pic.L(arg1, arg2, arg3, arg4, [arg5]); 座標(arg1,arg2)から座標(arg3,arg4)までarg5秒かけて線分を描く.arg5が 省略された時は,arg5 に0が入力されているものとして取り扱う.
pic.LW(arg1, arg2, arg3, arg4, [arg5]); 座標(arg1,arg2)から座標(arg3,arg4)までarg5秒かけて線分を描く.移動が終了するまで次の命令は実行されない.arg5 が 省略された時は,arg5に0が入力されているものとして取り扱う.
pic.O(arg1, arg2, arg3, arg4, [arg5]); 中心座標(arg1,arg2),幅 arg3, 高さ arg4,中心座標を中心に反時計回りに arg5 度回転した楕円を描く.arg5 が 省略された時は,arg5に0が入力されているものとして取り扱う.
pic.T(arg1, arg2, [arg3, [arg4]]); 引数の数が2つの場合,文字列arg1を文字の大きさarg2で人型ピクトグラムの現在位置に描く.

引数の数が3つまたは4つの場合,座標(arg2,arg3),文字の大きさ arg4で文字列 arg1 を描く.arg4 が 省略された時は,arg4に80が入力されているものとして取り扱う

pic.CS(); ペンによって描画された図形を消去する.

共通命令一覧

命令の様式 処理
arg1 = exp2 変数 arg1 に exp2 を代入する.
if (exp1) { } もし 式 exp1 が真ならば対応する命令群を実⾏する.
else if (exp2) { } もし対応する先述の if または elif の条件が全て満た されなくて,かつ条件式 exp2 が真ならば対応する命 令群を実⾏する.
else { } もし対応する先述の if または elif の条件が全て満た されない場合,対応する命令群を実⾏する.
for (let i = 0; i < arg1; i++) { } 対応する命令群をarg1回繰返す.
pic.W(arg1); arg1秒何もせずに待つ.待ちが終了するまで次の命令は実行されない.
pic.S(); 安全モード(Safety mode)に変更する。 安全モード中に描画 した線画の色は人型ピクトグラムと同じ緑色となる。
pic.SG(); 安全緑モード(Safety Green mode)以外で実行すると安全緑モードに変更する。 安全緑モードで再度命令すると通常モードに変更する。安全緑モード中に描画 した線画の色は人型ピクトグラムと同じ白色となる。
pic.SR(); 安全赤モード(Safety Red mode)以外で実行すると安全赤モードに変更する。 安全赤モードで再度命令すると通常モードに変更する。安全赤モード中に描画 した線画の色は人型ピクトグラムと同じ白色となる。
pic.P(); 禁止モード (Prohibit mode) 禁止モードに変更する。
pic.I(); 指示モード(Instruction mode)に変更 する。指示モード中 に描画した線画の色は人型ピクトグラムと同じ白色となる。
pic.A(); 注意モード(Attention mode)に変更する。
pic.SK(); スケルトンモード(Skelton mode)スケルトンモードに変更する。
pic.N(); 通常モード(Normal mode)に変更する。
pic.ST(); 命令が実行される時点での人型ピクトグラムを描画する.

 

ピクトグラム表示領域でのスマホ操作と処理の対応

ピクトグラミングでは,ピクトグラム表示領域上における様々なスマホ操作により,対応した命令を自動的にプログラムを記述する領域に追加できます.

タップする場所 スマホ操作 処理
人型ピクトグラム 体の部位をドラッグ 人型ピクトグラムの対応する部位を回転
体部分をドラッグ(1本指) 人型ピクトグラムの平行移動
体部分をドラッグ(2本指) 人型ピクトグラムの回転
人型ピクトグラミング以外 長押し 人型ピクトグラムの向いている方向の変更(正面と側面)

 

動画プレーヤー

体の部位と表記の対応

R命令やPEN命令では引数で部位を指定します.「前腕」や「下腿」など人型ピクトグラムの構成部品全体の名称での指定と,「肩」「肘」など,構成部品の節点の名称での指定とがあります.

 

構成部品全体の名称

英語 日本語
BODY
Body
LUA
LeftUpperArm
左上腕
LLA
LeftLowerArm
左前腕
RUA
RightUpperArm
右上腕
RLA
RightLowerArm
右前腕
LUL
LeftUpperLeg
左大腿
LLL
LeftLowerLeg
左下腿
RUL
RightUpperLeg
右大腿
RLL
RightLowerLeg
右下腿

 

 

構成部品の節点の名称

英語 日本語
BODY
Body
LS
LeftShoulder
左肩
LE
LeftElbow
左肘
LH
LeftHand
左手
RS
RightShoulder
右肩
RE
RightElbow
右肘
RH
RightHand
右手
LC
LeftCrotch
左股
LK
LeftKnee
左膝
LF
LeftFoot
左足
RC
RightCrotch
右股
RK
RightKnee
右膝
RF
RightFoot
右足

 

パーツ 部位

スマートフォン版使い方_Picthon

posted in: 開発者ブログ | 0

スマートフォン版Picthon (ピクトグラミング Python版) 使い方

画面の説明

画面は三つの部分から構成されます.左上は,ピクトグラムを表示する「人型ピクトグラム表示領域」,右上は,プログラムを記述する「プログラムコード入力領域」,下側はプログラムの入力を支援する「プログラムコード入力支援ボタン」です。

プログラムコード記述領域にプログラムを入力することで,人型ピクトグラムのポーズを変えたり動かしたりすることができます。また,「プログラムコード入力支援ボタン」を押すとその命令文を「プログラムコード記述領域」に追加できます.ピクトグラミングでは,Python言語でプログラミングできます.

 

利用目的に応じたオプション

Picthonでは利用の目的に合わせて2つの機能をオンオフできます.

画像(名称) 説明
(座標系表示) 画像の右に表示されているチェックボックスをオンにすると,座標系が表示されます.座標はXY座標系(X方向とY方向の値,両方を組み合わせて位置を表現する)です.横方向がX座標で左端の-320から右端の320まで,縦方向がY座標で上端の-320から下端の320までをとります.つまり,中心が(0,0),左上が(-320,-320),右上が(320,-320),左上が(-320,-320),右上が(320,-320),つまりX軸正方向が右,Y軸正方向が下となります.数学の座標軸とY軸だけ逆方向なので注意して下さい.
(ドラッグ不可)*標準でオン 画像の右に表示されているチェックボックスをオフにすると,人型ピクトグラムは「ピクトグラム表示パネル」上でピクトグラムの体の部位を直接ドラッグすることででも操作することができます。また,ピクトグラム表示領域上で,始点を人型ピクトグラムの体の部分以外の点にして,終点までドラックすると,線分が描けます.

 

コントロールボタン

ピクトグラミングでは再生・停止などのコントロールは,コントロールボタンから制御します.

画像(名称) 説明
(初めから再生) はじめから再生する.
(一旦停止) 停止します.
(停止位置から再生) 停止している状態から再生します.
(すべてクリア) プログラムコード入力領域に記述されているプログラムをすべて消去します.消去前に確認のダイアログボックスが表示されます.

さあ!始めよう

まずは,1時間で学ぶピクソンからはじめてみましょう.

作成コンテンツのダウンロード

作成したコンテンツのダウンロードは2通りあります。

 

[1. ショット画像のダウンロード]

(1)画像ダウンロードボタンを押すと,作品名.png の名前でショット画像が保存されます.

[2. アニメーションのダウンロード]

(1)動画ダウンロードボタンの右側にあるチェックボタンをオンにします.

(2)一度最初から最後まで実行します.ゆっくり実行されますが,内部的にはアニメーション画像が動的に生成されています.

(3)動画ダウンロードボタンを押すと,作品名.gif の名前でアニメーション画像が保存されます.

 

 

命令セット一覧

 

画面右上のプログラムコード記述領域に命令を入力し定義します.入力文字列は動作や状態を変化させるための「命令」コードと,引数列を空白で区切る以下の方式です.

pic.命令(引数1, 引数2 ....)

命令セット一覧 人型ピクトグラムの動きの変化を表現できる「ピクトアニメーション」,移動の経路が線で引かれることで図形を描く「ピクトグラフィックス」の2種類の命令から構成されています.また両方に共通して使用される変数定義,繰返し,条件分岐等の命令が用意されています.

ピクトアニメーション命令一覧

命令の様式 処理
pic.R(arg1, arg2, arg3, arg4) arg4 秒後にarg1で指定される体の部位を反時計回りにarg2 度だけarg3 秒かけて支点を中心に等速回転する.arg4 が 省略された時は,arg4 に0が,arg3arg4 の両方が省略された時はいずれも0が入力されているものとして取り扱う.
pic.RW(arg1, arg2, arg3) arg1で指定される体の部位を反時計回りにarg2度だけarg3秒かけて支点を中心に等速回転する.回転が終了するまで次の命令は実行されない.arg3が省略された時は,arg3に0が入力されているものとして取り扱う.
pic.M(arg1, arg2, arg3, arg4) arg4秒後にarg3秒かけてx軸正方向に arg1ピクセル, y軸正方向にarg2ピクセルだけ全体を等速直線移動する.arg4が省略された時は,arg4に0が,arg3arg4の両方が省略された時はいずれも0が入力されているものとして取り扱う.
pic.MW(arg1, arg2, arg3) arg3 秒かけてx軸正方向に arg1 ピクセル, y軸正方向にarg2 ピクセルだけ全体を等速直線移動する.直線移動が終了するまで次の命令は実行されない.arg3が省略された時は,arg3に0が入力されているものとして取り扱う.
pic.FR () 人型ピクトグラムを正面向きにする.(初期状態)
pic.SD () 人型ピクトグラムを側面向きにする.
pic.C () 人型ピクトグラムの状態を初期状態にする.
pic.SC(arg1) 人型ピクトグラムの拡大率を標準(初期状態)のarg1倍にする.
pic.SP(arg1) 文字列 arg1 を発話する.
pic.MS(arg1)
人型ピクトグラムにお面を装着する.装着するお面の種類はarg1で指定される.

arg1 がANGERの場合,怒りのお面
arg1 がDISGUSTの場合,嫌悪のお面
arg1 がFEARの場合,恐れのお面
arg1 がHAPPINESSの場合,喜びのお面
arg1 がSADNESSの場合,悲しみのお面
arg1 がSURPRISEの場合,驚きのお面
がそれぞれ装着される.
またarg1にNONEを指定すると装着しているお面を外すことができる.

pic.PS(arg1)
人に仮面を装着する.装着する仮面の種類はarg1で指定される.

arg1 がANGERの場合,怒りの仮面
arg1 がDISGUSTの場合,嫌悪の仮面
arg1 がFEARの場合,恐れの仮面
arg1 がHAPPINESSの場合,喜びの仮面
arg1 がSADNESSの場合,悲しみの仮面
arg1 がSURPRISEの場合,驚きの仮面
がそれぞれ装着される.
またarg1にNONEを指定すると装着している仮面を外すことができる.

pic.SAY(arg1, arg2, arg3) arg3 秒後にarg1で指定される値をarg2秒だけ吹き出しで表示するarg3 が 省略された時は,arg3 に0が,arg2arg3 の両方が省略された時はいずれも0が入力されているものとして取り扱う.
pic.SAYW(arg1, arg2) arg1で指定される値をarg2秒だけ吹き出しで表示する.吹き出しの表示が終了するまで次の命令は実行されない.

ピクトグラフィックス命令一覧

命令の様式 処理
pic.FD(arg1, [arg2])
人型ピクトグラムを進行方向にarg2 秒かけて距離 arg1 だけ等速で進める.arg2 が 省略された時は,arg2 に0が入力されているものとして取り扱う.
pic.BK(arg1, [arg2])
人型ピクトグラムを進行方向と逆向きにarg2 秒かけて距離 arg1 だけ等速で進める.arg2 が 省略された時は,arg2 に0が入力されているものとして取り扱う.
pic.RT(arg1, [arg2])
人型ピクトグラムの進行方向をarg2 秒かけて時計回り方向に角度 arg1 だけ等角速度で回転する.arg2 が 省略された時は,arg2 に0が入力されているものとして取り扱う
pic.LT(arg1, [arg2])
人型ピクトグラムの進行方向をarg2 秒かけて反時計回り方向に角度 arg1 だけ等角速度で回転する.arg2 が 省略された時は,arg2 に0が入力されているものとして取り扱う.
pic.FDW(arg1, [arg2])
人型ピクトグラムを進行方向にarg2 秒かけて距離 arg1 だけ等速で進める.移動が終了するまで次の命令は実行されない.arg2 が 省略された時は,arg2 に0が入力されているものとして取り扱う.
pic.BKW(arg1, [arg2])
人型ピクトグラムを進行方向と逆向きにarg2 秒かけて距離 arg1 だけ等速で進める.移動が終了するまで次の命令は実行されない.arg2 が 省略された時は,arg2 に0が入力されているものとして取り扱う.
pic.RTW(arg1, [arg2])
人型ピクトグラムの進行方向をarg2 秒かけて時計回り方向に角度 arg1 だけ等角速度で回転する.回転が終了するまで次の命令は実行されない.arg2 が 省略された時は,arg2 に0が入力されているものとして取り扱う.
pic.LTW(arg1, [arg2])
人型ピクトグラムの進行方向をarg2 秒かけて反時計回り方向に角度 arg1 だけ等角速度で回転する.回転が終了するまで次の命令は実行されない.arg2 が 省略された時は,arg2 に0が入力されているものとして取り扱う.
pic.PEN(arg1, [arg2])
arg1 がUPの場合,ペンを上げる.DOWN の場合,ペンを下げる.arg1がUPまたはDOWNの時は,ペンの上げ下げをする体の部位の名称をR,RW命令と同様の表記でarg2に指定できる.arg1がFILLの時は,R,RW命令と同様の表記で指定されたarg2の体の部位の座標を含む閉じた線画の内部を塗りつぶすことができる.arg2が省略された場合は BODYが記述されているものとみなされる.

ペンの両端について,arg1がSQUAREの場合,線の両端の形状は四角,arg1がROUNDの場合線,両端の形状を丸を付加する.arg1がBUTTの場合は両端に形状を付加しない.ペンの種類について,arg1 が NORMALの場合は実線を,ERASEの場合は線を消す,XORの場合はすでに描かれていた部分は消し,そうでない部分は描く(反転).

初期状態はペンが上がっている状態で,線の両端の形状は四角(SQUARE),ペンの種類はノーマル(NORMAL).

pic.PENW(arg1) ペンの太さ(幅)を arg1 にする.初期状態は15.
pic.L(arg1, arg2, arg3, arg4, [arg5]) 座標(arg1,arg2)から座標(arg3,arg4)までarg5秒かけて線分を描く.arg5が 省略された時は,arg5 に0が入力されているものとして取り扱う.
pic.LW(arg1, arg2, arg3, arg4, [arg5]) 座標(arg1,arg2)から座標(arg3,arg4)までarg5秒かけて線分を描く.移動が終了するまで次の命令は実行されない.arg5 が 省略された時は,arg5に0が入力されているものとして取り扱う.
pic.O(arg1, arg2, arg3, arg4, [arg5]) 中心座標(arg1,arg2),幅 arg3, 高さ arg4,中心座標を中心に反時計回りに arg5 度回転した楕円を描く.arg5 が 省略された時は,arg5に0が入力されているものとして取り扱う.
pic.T(arg1, arg2, [arg3, [arg4]]) 引数の数が2つの場合,文字列arg1を文字の大きさarg2で人型ピクトグラムの現在位置に描く.

引数の数が3つまたは4つの場合,座標(arg2,arg3),文字の大きさ arg4で文字列 arg1 を描く.arg4 が 省略された時は,arg4に80が入力されているものとして取り扱う

pic.CS() ペンによって描画された図形を消去する.

共通命令一覧

命令の様式 処理
arg1 = exp2 変数 arg1 に exp2 を代入する.
if exp1: もし 式 exp1 が真ならば対応する命令群を実⾏する.
elif exp2: もし対応する先述の if または elif の条件が全て満た されなくて,かつ条件式 exp2 が真ならば対応する命 令群を実⾏する.
else: もし対応する先述の if または elif の条件が全て満た されない場合,対応する命令群を実⾏する.
for _ in range(arg1) 対応する命令群をarg1回繰返す.
pic.W(arg1) arg1秒何もせずに待つ.待ちが終了するまで次の命令は実行されない.
pic.S() 安全モード(Safety mode)に変更する。 安全モード中に描画 した線画の色は人型ピクトグラムと同じ緑色となる。
pic.SG() 安全緑モード(Safety Green mode)以外で実行すると安全緑モードに変更する。 安全緑モードで再度命令すると通常モードに変更する。安全緑モード中に描画 した線画の色は人型ピクトグラムと同じ白色となる。
pic.SR() 安全赤モード(Safety Red mode)以外で実行すると安全赤モードに変更する。 安全赤モードで再度命令すると通常モードに変更する。安全赤モード中に描画 した線画の色は人型ピクトグラムと同じ白色となる。
pic.P() 禁止モード (Prohibit mode) 禁止モードに変更する。
pic.I() 指示モード(Instruction mode)に変更 する。指示モード中 に描画した線画の色は人型ピクトグラムと同じ白色となる。
pic.A() 注意モード(Attention mode)に変更する。
pic.SK() スケルトンモード(Skelton mode)スケルトンモードに変更する。
pic.N() 通常モード(Normal mode)に変更する。
pic.ST() 命令が実行される時点での人型ピクトグラムを描画する.

 

ピクトグラム表示領域でのスマホ操作と処理の対応

ピクトグラミングでは,ピクトグラム表示領域上における様々なスマホ操作により,対応した命令を自動的にプログラムを記述する領域に追加できます.

 

タップする場所 スマホ操作 処理
人型ピクトグラム 体の部位をドラッグ 人型ピクトグラムの対応する部位を回転
体部分をドラッグ(1本指) 人型ピクトグラムの平行移動
体部分をドラッグ(2本指) 人型ピクトグラムの回転
人型ピクトグラミング以外 長押し 人型ピクトグラムの向いている方向の変更(正面と側面)

 

体の部位と表記の対応

R命令やPEN命令では引数で部位を指定します.「前腕」や「下腿」など人型ピクトグラムの構成部品全体の名称での指定と,「肩」「肘」など,構成部品の節点の名称での指定とがあります.

 

構成部品全体の名称

英語 日本語
BODY
Body
LUA
LeftUpperArm
左上腕
LLA
LeftLowerArm
左前腕
RUA
RightUpperArm
右上腕
RLA
RightLowerArm
右前腕
LUL
LeftUpperLeg
左大腿
LLL
LeftLowerLeg
左下腿
RUL
RightUpperLeg
右大腿
RLL
RightLowerLeg
右下腿

 

 

構成部品の節点の名称

英語 日本語
BODY
Body
LS
LeftShoulder
左肩
LE
LeftElbow
左肘
LH
LeftHand
左手
RS
RightShoulder
右肩
RE
RightElbow
右肘
RH
RightHand
右手
LC
LeftCrotch
左股
LK
LeftKnee
左膝
LF
LeftFoot
左足
RC
RightCrotch
右股
RK
RightKnee
右膝
RF
RightFoot
右足

 

パーツ 部位

2021-08-29 ブロックピクトグラミングにいくつかの機能を追加しました(1. 反転表示,2. 線画オブジェクトのグループ化と移動,3. 文字列入出力).

ピクトグラミングのビジュアルブロック版である,ブロックピクトグラミングのPC日本語版とPC英語版を更新しました.

主に追加した機能は

1. 反転表示

2. 線画オブジェクトのグループ化と移動

3. 文字列入出力

です.

1. 反転表示

ピクトグラムというとサイン用途で使われるものが有名ですが,コミュニケーション用途で用いるピクトグラムのデザイン指針を定めたJIST0103(コミュニケーション支援用絵記号デザイン原則)およびISO19027(Design principles for communication support board using pictorial symbols)では,サイン用途の配色と反転した,黒背景に白字のピクトグラムが推奨されています.そのため,「マークを設定するブロック」に「反転」も指定できるようにしました.「マークを設定するブロック」は「図形」カテゴリの一番上にあります.

 

 

 

2. 線画オブジェクトの移動

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

一つ以上の基本図形から構成されるオブジェクトを定義できるブロック,定義されたオブジェクトを表示するブロック,定義されたオブジェクトを等速直線移動するブロックの三つを「図形」カテゴリに追加しました.下に例を示します.「物体を定義するための囲みブロックを使い「りんご」というラベルを設定して定義しています.囲みブロックの内部には,円と線分を描く二つのブロックがあります.これが構成要素となります.さらに「実行ボタンが押されたとき」の囲みブロックの中に,りんごを平行移動する命令があり,これにより「りんご」が等速で落下します.単に定義したオブジェクトを,定義した際の位置に表示するだけであれば,「物体〇〇を描く」ブロックを使います.オブジェクトの作成を通じて,複数の命令をまとめラベリングする手続き化の処理に慣れ親しんでもらいます.

 

等速直線運動以外の動きをしたければ,変数を設定して微小時間ごとに変化量を変えれば,実現できます.これは人型ピクトグラムを移動,回転する場合も同様です.次のプログラムは「りんご」が自由落下します.

 

3. 文字列入出力

ピクトグラミングでは,これまでも吹き出しの形で文字列を一定時間表示したり,ピクトグラムの構成要素として文字列を設定する機能はありました.しかしこれからはいずれも付加的な機能としての位置付けです.

一方,汎用プログラミング言語を用いた初学者向け学習では,文字列入出力をベースとするプログラムが題材になります.今回,カテゴリ「入出力」を追加し,ダイアログボックスを表示し値を特定の変数に格納するブロックと,画面上に小型化した人型ピクトグラムをカーソルに見立てて文字列を整列して逐次表示するブロックの二つを用意しました.この機能はすでにピクトグラミングPython言語版であるPicthonおよびJavaScript言語版であるJavaScpictには実装されていましたが,今回ブロック版にも実装しました.下の例は,高等学校情報科「情報Ⅰ」教員研修用教材でも紹介されている利子を計算するプログラムの例です.同一クラス内で学習者の習熟度に応じてテキスト型とブロック型の言語を併用する運用も想定できます.ピクトグラミングシリーズは基本静止画またはアニメーションピクトグラムを作成するのが目的の仕様になっているため,入力を要求するブロックはプログラムの最初に配置するようにしてください.途中に配置しても最初にダイアログボックスが表示されますので注意ください.

ブロックピクトグラミングPCひらがな版および各種スマートフォン版は順次新バージョンに変更していきます.

また,しばらくの間,各ページのフッタに旧版のブロックプログラミングのアプリケーションページへのリンクは残しておきます.旧版の利用が必要な場合,そちらのリンクを辿って利用ください.

次回の全体のアップデートは2021年年末を予定しています.特に高等学校「情報I」のデータ活用,中学技術科「情報分野」での授業での利用を想定した機能を中心にいくつか追加する予定です.

 

 

スマートフォン版使い方-ピクトグラミング

posted in: 開発者ブログ | 0

ピクトグラミング

スマートフォン版

 

 

画面の説明

 

人型ピクトグラム表示パネル,その下にプログラムコード 記述領域,さらにその下にエラーメッセージを出力するコンソールパネルと続きます。

プログラムコード記述領域にプログラムを入力することで,人型ピクトグラムのポーズを変えたり動かしたりすることができます。

人型ピクトグラムは人型ピクトグラム表示パネル上で直接ドラッグすることででも操作することができます。ただし,スマートフォン版では,操作が通常版に比べ限定されています.

 

操作 操作
人型ピクトグラムの表示領域内

(人型ピクトグラムの描画可能点付近を除く)

ドラッグ 人型ピクトグラムの対応する部位を回転
長押し 人型ピクトグラムの向いている方向の変更(正面と側面)
人型ピクトグラムの描画可能点付近 クリックのみ 描画可能点におけるペンの持ち・放し

 

利用目的に応じたオプション

ピクトグラミングでは利用の目的に合わせて3つの機能をオンオフできます.

画像(名称) 説明
(座標系表示) 画像の右に表示されているチェックボックスをオンにすると,座標系が表示されます.座標はXY座標系(X方向とY方向の値,両方を組み合わせて位置を表現する)です.横方向がX座標で左端の-320から右端の320まで,縦方向がY座標で上端の-320から下端の320までをとります.つまり,中心が(0,0),左上が(-320,-320),右上が(320,-320),左上が(-320,-320),右上が(320,-320),つまりX軸正方向が右,Y軸正方向が下となります.数学の座標軸とY軸だけ逆方向なので注意して下さい.
(ドラッグ不可) 画像の右に表示されているチェックボックスをオフにすると,人型ピクトグラムは「ピクトグラム表示パネル」上でピクトグラムの体の部位を直接ドラッグすることででも操作することができます。また,ピクトグラム表示領域上で,始点を人型ピクトグラムの体の部分以外の点にして,終点までドラックすると,線分が描けます.

 

コントロールボタン

ピクトグラミングでは再生・停止などのコントロールは,コントロールボタンから制御します.

画像(名称) 説明
(初めから再生) はじめから再生する.
(一旦停止) 停止します.
(停止位置から再生) 停止している状態から再生します.
(すべてクリア) プログラムコード入力領域に記述されているプログラムをすべて消去します.消去前に確認のダイアログボックスが表示されます.

さあ!始めよう

まずは,1時間で学ぶピクトグラミングからはじめてみましょう.

Pictogramming オンラインマニュアルも参考になります.

作成コンテンツのダウンロード

 

作成したコンテンツのダウンロードは2通りあります。

 

[1. ショット画像のダウンロード]

(1)画像ダウンロードボタンを押すと,作品名.png の名前でショット画像が保存されます.

[2. アニメーションのダウンロード]

(1)動画ダウンロードボタンの右側にあるチェックボタンをオンにします.

(2)一度最初から最後まで実行します.ゆっくり実行されますが,内部的にはアニメーション画像が動的に生成されています.

(3)動画ダウンロードボタンを押すと,作品名.gif の名前でアニメーション画像が保存されます.

 

命令セット一覧

 

画面右上のプログラムコード記述領域に命令を入力し定義します.入力文字列は動作や状態を変化させるための「命令」コードと,引数列を空白で区切る以下の方式です.

命令 引数1 引数2 ....

命令セット一覧 人型ピクトグラムの動きの変化を表現できる「ピクトアニメーション」,移動の経路が線で引かれることで図形を描く「ピクトグラフィックス」の2種類の命令から構成されています.また両方に共通して使用される変数定義,繰返し,条件分岐等の命令が用意されています.

ピクトアニメーション命令一覧

命令の様式 処理
arg1 arg2 arg3 arg4 arg4 秒後にarg1で指定される体の部位を反時計回りにarg2 度だけarg3 秒かけて支点を中心に等速回転する.arg4 が 省略された時は,arg4 に0が,arg3arg4 の両方が省略された時はいずれも0が入力されているものとして取り扱う.
RW arg1 arg2 arg3 arg1で指定される体の部位を反時計回りにarg2度だけarg3秒かけて支点を中心に等速回転する.回転が終了するまで次の命令は実行されない.arg3が省略された時は,arg3に0が入力されているものとして取り扱う.
arg1 arg2 arg3 arg4 arg4秒後にarg3秒かけてx軸正方向に arg1ピクセル, y軸正方向にarg2ピクセルだけ全体を等速直線移動する.arg4が省略された時は,arg4に0が,arg3arg4の両方が省略された時はいずれも0が入力されているものとして取り扱う.
MW arg1 arg2 arg3 arg3 秒かけてx軸正方向に arg1 ピクセル, y軸正方向にarg2 ピクセルだけ全体を等速直線移動する.直線移動が終了するまで次の命令は実行されない.arg3が省略された時は,arg3に0が入力されているものとして取り扱う.
FR (Front) 人型ピクトグラムを正面向きにする.(初期状態)
SD (Side) 人型ピクトグラムを側面向きにする.
C (Clear) 人型ピクトグラムの状態を初期状態にする.
SC arg1 人型ピクトグラムの拡大率を標準(初期状態)のarg1倍にする.
SP arg1 文字列 arg1 を発話する.
MS arg1
人型ピクトグラムにお面を装着する.装着するお面の種類はarg1で指定される.

arg1 がANGERの場合,怒りのお面
arg1 がDISGUSTの場合,嫌悪のお面
arg1 がFEARの場合,恐れのお面
arg1 がHAPPINESSの場合,喜びのお面
arg1 がSADNESSの場合,悲しみのお面
arg1 がSURPRISEの場合,驚きのお面
がそれぞれ装着される.
またarg1にNONEを指定すると装着しているお面を外すことができる.

PS arg1
人に仮面を装着する.装着する仮面の種類はarg1で指定される.

arg1 がANGERの場合,怒りの仮面
arg1 がDISGUSTの場合,嫌悪の仮面
arg1 がFEARの場合,恐れの仮面
arg1 がHAPPINESSの場合,喜びの仮面
arg1 がSADNESSの場合,悲しみの仮面
arg1 がSURPRISEの場合,驚きの仮面
がそれぞれ装着される.
またarg1にNONEを指定すると装着している仮面を外すことができる.

SAY arg1 arg2 arg3 arg3 秒後にarg1で指定される値をarg2秒だけ吹き出しで表示するarg3 が 省略された時は,arg3 に0が,arg2arg3 の両方が省略された時はいずれも0が入力されているものとして取り扱う.
SAYW arg1 arg2 arg1で指定される値をarg2秒だけ吹き出しで表示する.吹き出しの表示が終了するまで次の命令は実行されない.

ピクトグラフィックス命令一覧

 

命令の様式 処理
FD arg1 [arg2] 人型ピクトグラムを進行方向にarg2 秒かけて距離 arg1 だけ等速で進める.arg2 が 省略された時は,arg2 に0が入力されているものとして取り扱う.
BK arg1 [arg2] 人型ピクトグラムを進行方向と逆向きにarg2 秒かけて距離 arg1 だけ等速で進める.arg2 が 省略された時は,arg2 に0が入力されているものとして取り扱う.
RT arg1 [arg2] 人型ピクトグラムの進行方向をarg2 秒かけて時計回り方向に角度 arg1 だけ等角速度で回転する.arg2 が 省略された時は,arg2 に0が入力されているものとして取り扱う
LT arg1 [arg2] 人型ピクトグラムの進行方向をarg2 秒かけて反時計回り方向に角度 arg1 だけ等角速度で回転する.arg2 が 省略された時は,arg2 に0が入力されているものとして取り扱う.
FDW arg1 [arg2] 人型ピクトグラムを進行方向にarg2 秒かけて距離 arg1 だけ等速で進める.移動が終了するまで次の命令は実行されない.arg2 が 省略された時は,arg2 に0が入力されているものとして取り扱う.
BKW arg1 [arg2] 人型ピクトグラムを進行方向と逆向きにarg2 秒かけて距離 arg1 だけ等速で進める.移動が終了するまで次の命令は実行されない.arg2 が 省略された時は,arg2 に0が入力されているものとして取り扱う.
RTW arg1 [arg2] 人型ピクトグラムの進行方向をarg2 秒かけて時計回り方向に角度 arg1 だけ等角速度で回転する.回転が終了するまで次の命令は実行されない.arg2 が 省略された時は,arg2 に0が入力されているものとして取り扱う.
LTW arg1 [arg2] 人型ピクトグラムの進行方向をarg2 秒かけて反時計回り方向に角度 arg1 だけ等角速度で回転する.回転が終了するまで次の命令は実行されない.arg2 が 省略された時は,arg2 に0が入力されているものとして取り扱う.
PEN arg1 [arg2] arg1 がUPの場合,ペンを上げる.DOWN の場合,ペンを下げる.arg1がUPまたはDOWNの時は,ペンの上げ下げをする体の部位の名称をR,RW命令と同様の表記でarg2に指定できる.arg1がFILLの時は,R,RW命令と同様の表記で指定されたarg2の体の部位の座標を含む閉じた線画の内部を塗りつぶすことができる.arg2が省略された場合は BODYが記述されているものとみなされる.

ペンの両端について,arg1がSQUAREの場合,線の両端の形状は四角,arg1がROUNDの場合線,両端の形状を丸を付加する.arg1がBUTTの場合は両端に形状を付加しない.ペンの種類について,arg1 が NORMALの場合は実線を,ERASEの場合は線を消す,XORの場合はすでに描かれていた部分は消し,そうでない部分は描く(反転).

初期状態はペンが上がっている状態で,線の両端の形状は四角(SQUARE),ペンの種類はノーマル(NORMAL).

PENW arg1 ペンの太さ(幅)を arg1 にする.初期状態は15.
L arg1 arg2 arg3 arg4 [arg5] 座標(arg1,arg2)から座標(arg3,arg4)までarg5秒かけて線分を描く.arg5が 省略された時は,arg5 に0が入力されているものとして取り扱う.
LW arg1 arg2 arg3 arg4 [arg5] 座標(arg1,arg2)から座標(arg3,arg4)までarg5秒かけて線分を描く.移動が終了するまで次の命令は実行されない.arg5 が 省略された時は,arg5に0が入力されているものとして取り扱う.
O arg1 arg2 arg3 arg4 [arg5] 中心座標(arg1,arg2),幅 arg3, 高さ arg4,中心座標を中心に反時計回りに arg5 度回転した楕円を描く.arg5 が 省略された時は,arg5に0が入力されているものとして取り扱う.
T arg1 arg2 [arg3 [arg4]] 引数の数が2つの場合,文字列arg1を文字の大きさarg2で人型ピクトグラムの現在位置に描く.

引数の数が3つまたは4つの場合,座標(arg2,arg3),文字の大きさ arg4で文字列 arg1 を描く.arg4 が 省略された時は,arg4に80が入力されているものとして取り扱う

CS ペンによって描画された図形を消去する.

共通命令一覧

命令の様式 処理
SET arg1 exp2 変数 arg1 に exp2 を代入する.
IF exp1 もし exp1が実数値なら,その実数値の確率で対応するELSEIFまたはELSEまたは ENDまでの命令を実行する.expが条件式なら,条件が真であれば対応するELSEIFまたはELSEまたは ENDまでの命令を実行する.
ELSEIF exp2 もし対応する先述のIFまたはELSEIFの条件が全て満たされなくて,かつexp2が実数値なら,その実数値の確率で対応するELSEIFまたはELSEまたはENDの直前までの命令を実行する.exp2が条件式なら,条件が真ならば対応するELSEIFまたはELSEまたはENDの直前までの命令を実行する.
ELSE もし対応する先述のIFまたはELSEIFの条件が全て満たされない場合,対応するENDまでの命令を実行する.
REPEAT arg1 対応するENDまでの命令をarg1回繰返す.
D name arg1 .. argN arg1からargNまでのN個の引数を伴う手続きnameを登録する.引数列の終端は改行とする.
E name arg1 .. argN [start] 登録されているarg1 からargNまでのN個の引数を伴う手続きnameを実行開始からstart秒後に実行する.startが省略されている場合は,0が入力されているものとして取り扱う.
EW name arg1 .. argN [waittime] 登録されているarg1 からargNまでのN個の引数を伴う手続きnameを実行する. 次の命令はその[waittime]秒後に実行する.waittimeが省略されている場合は,0が入力されているものとして取り扱う.
END 条件文,または繰返し,または定義の終了.
arg1 arg1秒何もせずに待つ.待ちが終了するまで次の命令は実行されない.
S 安全モード(Safety mode)に変更する。 安全モード中に描画 した線画の色は人型ピクトグラムと同じ緑色となる。
SG 安全緑モード(Safety Green mode)以外で実行すると安全緑モードに変更する。 安全緑モードで再度命令すると通常モードに変更する。安全緑モード中に描画 した線画の色は人型ピクトグラムと同じ白色となる。
SR 安全赤モード(Safety Red mode)以外で実行すると安全赤モードに変更する。 安全赤モードで再度命令すると通常モードに変更する。安全赤モード中に描画 した線画の色は人型ピクトグラムと同じ白色となる。
P 禁止モード (Prohibit mode) 禁止モードに変更する。
I 指示モード(Instruction mode)に変更 する。指示モード中 に描画した線画の色は人型ピクトグラムと同じ白色となる。
A 注意モード(Attention mode)に変更する。
SK スケルトンモード(Skelton mode)スケルトンモードに変更する。
N 通常モード(Normal mode)に変更する。
ST 命令が実行される時点での人型ピクトグラムを描画する.

命令コードと表記の対応

英語表記 英語 日本語 にほんご
R Rotate 回転 かいてん
RW RotateWait 回転待ち かいてんまち
M Move 移動 いどう
MW MoveWait 移動待ち いどうまち
W Wait 待ち まち
FR Front 正面 しょうめん
SD Side 側面 そくめん
MS Mask お面 おめん
PS Persona 仮面 かめん
ANGER Anger 怒り いかり
DISGUST Disgust 嫌悪 けんお
FEAR Fear 恐れ おそれ
HAPPINESS Happiness 喜び よろこび
SADNESS Sadness 悲しみ かなしみ
SURPRISE Surprise 驚き おどろき
NONE None 無し なし
C Clear クリア くりあ
SAY Say 言う いう
SAYW SayWait 言う待ち いうまち
FD Forward
fd
前進 ぜんしん
BK Backward
bk
後進 こうしん
RT RightTurn
rt
右回り みぎまわり
LT LeftTurn
lt
左回り ひだりまわり
FDW ForwardWait
fdw
前進待ち ぜんしんまち
BKW BackwardWait
bkw
後進待ち こうしんまち
RTW RightTurnWait
rtw
右回り待ち みぎまわりまち
LTW LeftTurnWait
ltw
左回り待ち ひだりまわりまち
PEN Pen
pen
ペン ぺん
PENW Penw
penw
ペン幅 ぺんはば
RELEASE Release
release
離す 放す 放す
UP Up
up
上げる あげる
HOLD Hold
hold
持つ 持つ
DOWN Down
down
下げる さげる
FILL Fill
fill
塗る ぬる
ROUND Round
round
まる
SQUARE Square
square
四角 しかく
BUTT Butt
butt
端無し はしなし
L Line
line
せん
LW LineWait
linewait
線待ち せんまち
O Oval
linewait
えん
CS ClearScreen クリアスクリーン くりあすくりーん
SET Set
set
代入 だいにゅう
IF If
if
もし もし
ELSEIF Elseif
elseif
他でもし ほかでもし
ELSE Else
else
ほか
REPEAT Repeat
repeat
繰返し
繰り返し
くりかえし
D Define

define

定義 ていぎ
E Execute

execute

実行 じっこう
EW ExecuteWait

executewait

実行待ち じっこうまち
END End
end
終わり おわり
SC Scale 倍率 ばいりつ
SP Speak
speak
話す はなす
S Safety 安全 あんぜん
SG SafetyGreen 安全緑 あんぜんみどり
SR SafetyRed 安全赤 あんぜんあか
P Prohibit 禁止 きんし
I Instruction 指示 しじ
A Attention 注意 ちゅうい
SK Skelton 透明 とうめい
N Normal 標準 ひょうじゅん
ST Stamp スタンプ すたんぷ

 

 

 

 

体の部位と表記の対応

R命令やPEN命令では引数で部位を指定します.「前腕」や「下腿」など人型ピクトグラムの構成部品全体の名称での指定と,「肩」「肘」など,構成部品の節点の名称での指定とがあります.

言語 パーツ 部位
英語
(English)
日本語

構成部品全体の名称

英語 日本語 にほんご
BODY
Body
からだ
LUA
LeftUpperArm
左上腕 ひだりじょうわん
LLA
LeftLowerArm
左前腕 ひだりぜんわん
RUA
RightUpperArm
右上腕 みぎじょうわん
RLA
RightLowerArm
右前腕 みぎぜんわん
LUL
LeftUpperLeg
左大腿 ひだりだいたい
LLL
LeftLowerLeg
左下腿 ひだりかたい
RUL
RightUpperLeg
右大腿 みぎだいたい
RLL
RightLowerLeg
右下腿 みぎかたい

 

 

構成部品の節点の名称

英語 日本語 にほんご
BODY
Body
からだ
LS
LeftShoulder
左肩 ひだりかた
LE
LeftElbow
左肘 ひだりひじ
LH
LeftHand
左手 ひだりて
RS
RightShoulder
右肩 みぎかた
RE
RightElbow
右肘 みぎひじ
RH
RightHand
右手 みぎて
LC
LeftCrotch
左股 ひだりまた
LK
LeftKnee
左膝 ひだりひざ
LF
LeftFoot
左足 ひだりあし
RC
RightCrotch
右股 みぎまた
RK
RightKnee
右膝 みぎひざ
RF
RightFoot
右足 みぎあし

 

 

2021-08-21 ピクトグラミングトップページをリニューアルしました.

ピクトグラミングのトップページをリニューアルしました.

アクセスしたデバイスにより自動的に表示するトップページを変更するようになっています.

アクセスしたデバイス用の4通りのアプリケーション(Pictogramming, Block Pictogramming, Picthon, JavaScpict)と使い方へのリンクのみで構成されるシンプルかつ軽量なページです.それ以外の例えば,学習用テキスト,作品例等の関コンテンツへのリンクは全てフッター部分に集約しました.

今後は定常的に,トップページ以外のサイト構造やページをより使いやすいサイトをすべく随時更新していきます.今後ともピクトグラミングシリーズをよろしくお願いいたします.

 

(1) PC,タブレットでアクセスした場合のトップページです.

 

(2) スマートフォンでアクセスした場合のトップページです.

 

[ブロックピクトグラミング] ピクトグラム作成環境「ピクトグラミング」ブロック版の紹介,入門動画(計4動画)を作成いただきました!

posted in: 開発者ブログ | 0

「ピクトグラミング」ブロック版「ブロックピクトグラミング」を使用したピクトグラミングの紹介,入門動画を作成いただきましたので,紹介したいと思います.

 

今回紹介するのは以下の4本です.

 

まずはじめに紹介するのが,「とりあえずピクトグラミングを始める説明」の動画です.題名が示すとおり,まずはピクトグラミングがどういうものかを7分程度で知ることができます.

 

こちらは「とりあえず体験するピクトグラミング1,2」です.解説者の話し方,振る舞い方や人型ピクトグラムとのインタラクションの仕方など大変参考になります.ワークショップなどの体験講座での利用及びピクトグラミングファシリテータ養成を想定した動画となっています.2動画で完結です.

 

 

こちらは「ピクトグラミング入門」の初回動画.ピクトグラミングは,プログラミングの基本とのなる諸概念(逐次実行,平行実行,繰返し,条件分岐,関数等)を学べる要素を取り入れていますが,その視点を含めた動画内容となっています.つい先日共通テストの科目として導入などでも話題になっている高等学校「情報」をはじめ,小学校から大学に至る広範囲での情報デザインやプログラミングの授業での利活用が想定されます.

2回目以降の動画の公開が楽しみです.

 

[ピクソン] ピクトグラミングPython版であるPicthon(ピクソン)で,共通テスト「情報」で採用予定のDNCL2をサポートしていきます.

ピクトグラミングの派生アプリケーションの一つであるPicthonで,共通テスト「情報」で採用予定のDNCL2をサポートしていきます.

まずは,共通テスト「情報」サンプル問題Q2で提示されているプログラム程度は動作するように実装しました.

 

人型ピクトグラムが頑張って地面に文字列を描いていきます.

画面下のプルダウンで「DNCL2」を選択すると,DNCL2の基本命令がボタン入力できます.今のところ共通テスト「情報」サンプル問題で使われている最低限度の命令のサポートのみですが,正式なDNCL2の仕様は今後公開されると思います.

DNCLは読むために最適化された記述言語なので,それで読み書きすることの一長一短もあるのですが,検討の余地があると考えて,研究,調査も含め開発していきます.