Standard version of Block Pictogramming can handle some commands but uses functions IE unsupported. Hence, it can not work on IE. Therefore we release simple version of Block Pitogramming. This version provides blocks only about fundamental concepts of programming. This version is suitable for novice user.
「ブロック版をぜひ使いたいのだけど学校のブラウザがIEしか使えなくて」という声に対応いたしました．ブロックピクトグラミングは変数を扱えますが，IEでサポートしていない機能を使っているため，IEで動作しませんでした．そこで，ブロックピクトグラミングシンプル版を公開しました．こちらのバージョンはIE(Internet Explorer)でも動作します．トップページからアクセスできます．
IEで対応できないブロックを削除することで，IE対応にするだけではなく，ブロックプログラミング通常版に比べて，単純な命令ブロック以外を間引くことで，初学者でも使いやすいように工夫いたしました．例えば，繰返しのカテゴリは１種類，条件分岐の命令も条件式を定義して分岐する形態のブロック群は削除し，確率により実行する命令を分岐するブロック１種類のみにしています．一方で，複数の動作や描画をまとめるための関数ブロックや，算術演算系のブロックは残しています．今後，ブロックの構成やブロックにどうラベルと記述する良いのか等々に関しては，現場の先生と協力していければと考えています．ご関心のある先生はぜひご連絡ください．
There is no difficulty for constructing syntax of branch instruction because the description itself is prepared in the block-type programming language, but notation of a conditional expression is a hurdle for novices. Therefore, the probability blocks with the probability of execution as an argument has been added to category “logic” of Block Pictogramming.
This block asks the human pictogram to raise the left arm with a probabirity of 50% and raise the right arm otherwise.
ブロック型のプログラミング言語では，分岐命令の記述自体は用意されているのでテキスト型ほど困難はないのですが，条件式を記述することはやはり初学者にはハードルとなります．分岐処理を体得する手軽な方法として，確率によって処理を分けるプログラムを書くことが考えられます．そこで，ブロックピクトグラミングに，確率を引数とする確率ブロックを論理カテゴリに追加しました．
このブロックでは，50%の確率で左腕をあげ，それ以外で右腕を上げるように人型ピクトグラムにお願いします（人型ピクトグラムは素直なので必ずその通りに動作してくれます）．
One of the characteristics of Pictogramming is that a corresponding command is generated automatically by mouse operation on the human pictogram display area. Moving objects and show corresponding command sequence in the same time seems to good way to learn programming for novice in a way. Block Pictogramming now supports the function that corresponding blocks (programs) are automatically added by mouse operation.
The following four operation acts:
1. Drag the parts (arms, legs, and body) of the human pictogram to rotate.
2. Drag the humanoid pictogram with right button to translate.
3. Drag where no human pictogram exists to draw a line segment.
4. Hold the mouse button down where no human pictogram exists to change the orientation (front, side) of it.
ピクトグラミングの特徴としてピクトグラム表示領域上でのマウス操作で，対応する命令が生成されるという特徴があります．まずは，直感的にオブジェクトを動かして，それに対応する命令列を同時に提示するというのは，プログラミングを学ぶ上の初歩の初歩として一定の意味があると考えています．
ブロックピクトグラミングにおいても，ピクトグラム表示領域に対するマウス操作で自動的に対応するブロックが追加されていくようにしました．次の４種類の操作が対応します．
１．人型ピクトグラムの部品（腕，足，体）を左ドラッグして回転させる．
２．人型ピクトグラムを右ドラックして平行移動させる．
３．人型ピクトグラムのないところをドラックして線分を描く．
４．人型ピクトグラムのないところを長押しして人型ピクトグラムの向き（正面，側面）を変化する．
先日とある先生から，人型ピクトグラムの倍率（大きさ）を連続して変えるのが面倒だというコメントをいただきました．
そこで，倍率変化命令の引数の値の意味を「標準の大きさ（初期状態）」と比較して「何倍」ではなく，今の大きさからみて「何倍」という意味に変更しました．
よって，徐々にピクトグラムが小さくなるプログラムは，
出力例（早送り）
ブロックピクトグラミング（ピクトグラミングブロック版）では，
のように書けるようになりました．ピクトグラミングファミリーでは全て共通の処理系を使っていますので，
ピクトグラミング
REPEAT 10 SC 0.9 W 1 END
Picthon (ピクトグラミング Python版)
for _ in range(10):
pic.SC(0.9)
pic.W(1)
でも，同じ挙動となります．
倍率を連続的に変化させるという処理を実装してこなかったのには，理由があって，ピクトグラムは奥行きを表現しないという基本則があることです．よって配置を考える上で，一度標準に大きさに比べて相対的な大きさを指定することはあっても，連続的に変化することは想定していません．
ちなみに斜め向きの人型ピクトグラムはなく，人型のピクトグラムに正面と側面のピクトグラムしかない理由も奥行きを表現しないことが理由です．一方で，どうしても，ピクトグラムを徐々に小さくしたり，大きくしたりしたいという子も少なからずいて，いつも悩むところです．以前「何を実装しないか」というエントリを書きましたが，常に考えさせられます．
例えば，Scratchでも壁についたら跳ね返るブロックはありますが，弾を発射するブロックは用意されていません．ピクトグラミングは，よくピクトプログラミングと言い間違えられますが，ピクトグラムを作るためのプログラミングというのは副次的で，常に進化するピクトグラム（Pictogram + ing）との共生を主目的としています．
ピクトグラミングを設計・実装する際に，ある機能を利用可能にしようか否かという判断に一番気を使います．
ピクトグラミングにもいくつか表立って公開していない機能があります．
それらの多くは，デザイン指針に準じたピクトグラムを作るという目的のみで考えると，必要ない機能，あるいは逸脱したデザインのピクトグラムの作成を逆に許してしまうものです．
一方，それらの機能も，プログラミングを学習する文脈からすると，ある方が可能性が広がります．
なかなか難しい判断ですが，いくつかの機能を実現するブロックを追加しました．日本語版，英語版の両方とも追加しています．
冒頭で申し上げた理由により，これらはいずれも「その他」カテゴリに配置しています．
（１）話す，言うブロック
「話す」ブロックは引数で与えられた文を音声合成で発生します．
「言う」ブロックは，引数で与えられた文を指定された条件で，吹き出しで表示します．
一般には，アルゴリズムの学習をはじめプログラミング言語を用いるとどうしても，演算の結果を数字や文字で出力するような機能が欲しいということになってきます．例えば，1から10までの和を求めるプログラムを書くとかです．
文字列処理やリストも扱いたくなると思いますので，Google Blocklyで用意されているこれらのブロックも使用できるようにしました．
（２）お面，仮面ブロック
ピクトグラムには表情がありません．なので，お面をかぶって表情を出すことができます．回転命令において，回転の対象に「頭」があり，なぜ単なる円なのに，回転があるか不思議に思われた方もいらっしゃるかもしれませんが，これが理由です．また人間の側にも仮面という形で表情を出せるようにしました．これも以前からある機能でしたが，今回Block Programmingでも使えるようにしました．
これは標準のピクトグラムの作成指針にはありませんが，望ましくない状態のピクトグラムを作成して，それに対して人が嫌悪感を抱いている状況を表現するとか，逆に最近嬉しかった出来事をピクトグラムで表現してもらう等々の使い方が考えられます．
同じ挨拶でも表情が異なると随分異なった印象を与えてしまいます．私たち人間も常に気をつけないとですね．
ピクトグラム作成にあたり，最初から最後までデザインのルール下だけで考えるのではなく，回り道を許容し，遊びごごろを通じて作成する場を提供できれば，これまでにないようなデザインの点から見ても申し分のない，素敵なピクトグラムが誕生するかもしれませんね．
Picthon（Picthon）は，人型ピクトグラムに関するコンテンツ生成環境ピクトグラミング（Pictogramming）シリーズの一つでPython言語でピクトグラムコンテンツが作成できます．同時に，プログラミング学習環境でもあります．
まずは1時間ピクトグラムと遊んでみましょう．
とりあえず深呼吸から始めましょう．ピクトグラムと一緒にみなさんも体を動かして深呼吸を3回してみてください．
では始めていきましょう．下がピクトグラミングの画面です．
画面右上のプログラムコード記述領域に命令を入力し定義します．とりあえず，次のように入力して，実行ボタン
を押してみてください．
pic.R("RUA", 120)
人型ピクトグラムの右腕が上がりました．
pic.R("RUA",120)の一番はじめの pic は，人型ピクトグラムを表す識別子です．R は Rotate（回転）の略です．ピクトグラミングではこのR命令を使っていろいろなポージングアニメーションを作成できます．次のRUAは回転する体の部位です．文字列は””で囲みます．回転する部位は以下の図の9箇所で，BODYを除く8箇所は3文字の英字で表現します．ここではRUA(Right Upper Armの略です）なので，右腕が回転します．ちなみに部位LLLはLeft Lower Legの略になります．ピクトグラムは顔がないので，どちらが右腕なのかと思われるかもしれませんが，この人型ピクトグラムは鏡に映った自分の分身でもあるので思っていただければいいです．
では次に，先ほど入力したpic.R("RUA", 120) の括弧の中の最後に,1を追加して，実行ボタンを押してみてください．
pic.R("RUA",120, 1)
すると先ほどと異なり下のように動きながら右腕が上がりました．この最後の1は1秒間で動かすという意味です．このように最後に数字を追加するとその数字の秒数で指定された角度回転します．この数字を省略すると最初にやったように0秒（一瞬）で移動します．
では2行目に新しく，pic.R("LUA", -120, 1) と入力して実行してみて下さい．
pic.R("RUA", 120, 1)
pic.R("LUA", -120, 1)
すると両腕が同時に上がりました．ピクトグラミングでは命令は上から順番に実行されますが，R命令では次に記述された命令も同時に実行されますので，結果２つの回転は同時に開始されます．では，右腕を回転して，右腕の回転が終わったら，左上の回転を開始したい場合はどうすれば良いでしょうか？
1行目のRをRWに変更して実行してみて下さい．
pic.RW("RUA", 120, 1)
pic.R("LUA", -120, 1)
このRWはRotate Waitの意味で回転が終了するまで次の命令は実行を開始しません．このR命令とRW命令を組み合わせる，言い換えると逐次（ちくじ）実行と並列実行を組み合わせることで，様々な動きを表現できます．
次に，これを実行してみて下さい．
pic.RW("LUA", -120, 1)
pic.RW("LLA", -90, 0.3)
pic.RW("LLA", 90, 0.3)
１回左の前腕を振りました．繰返し振らせたければ，for _ in range(arg1):を使います．arg1は繰り返したい回数です．また，繰返したい命令は全て4文字分字下げします．
pic.RW("LUA", -120, 1)
for _ in range(5):
pic.RW("LLA", -90, 0.3)
pic.RW("LLA", 90, 0.3)
ピクトグラムがハローって手を振ってくれてます．ハローワールド！
次のプログラムを入力して実行してみましょう．
pic.PEN_HOLD("LLA")
pic.R("LUA", 360, 1)
なんと！円がかけました．ピクトグラミングでは動きの履歴を線画で描画できます．
このPEN_HOLDはこれ以降は動きの履歴を描くという意味です．次のLLAは，先ほどと同じく体の部位です．体の部位の名称もR命令と同じです．
どの点で描くかは以下の図の対応になっています．
SKという命令（Skelton の略です）を書くと人型ピクトグラムが透明になりますので，何を描いたかが，わかりやすくなります．
pic.SK()
pic.PEN_HOLD("LLA")
pic.R("LUA", 360, 1)
違う図形も描いてみましょう．
pic.SK()
pic.PEN_HOLD("LLA")
for _ in range(4):
pic.RW("LUA", 90)
で左手を使って四角形を描くことができます．
このように時間0のRW命令は元の位置とその命令を実行したあとの位置を両端とする線分を描画します．
左腕の今の位置から，左上腕を反時計回りに90度回転した位置まで線分を描きます．さらにそこから左上腕を反時計回りに90度回転した位置まで別の線分を描きます．と繰り返すので，四角形が描けるわけです．
一方4行目のRWをRに変更すると
pic.SK()
pic.PEN_HOLD("LLA")
for _ in range(4):
pic.R("LUA", 90)
何も描かれません．
時間0のR命令は，今の位置と同時に行われる複数のR命令の動きを全て実行したあとの位置を両端とする線分を描画します．
よってこの場合，左腕の初期位置から，左上腕を反時計回りに90+90+90+90 (=360) 度回転した位置まで線分を描きます．360度回転した位置というのは回転する前の位置と同じなので，結果なにも描かれないことになります．
R,RW命令のアニメーションの時間を0以外の値にして，また複数のR,RW命令をうまく組み合わせると様々な図形が描けます．例を一つ示します．同時に複数の体の部位を動かすところがポイントになってます．
pic.SK()
pic.PEN_HOLD("LLA")
pic.R("LUA", 360, 5)
pic.R("LLA", 180, 5)
ここまでで説明した命令の仕様は以下の通りです．
| 命令の様式 | 処理 |
|---|---|
| pic.R( arg1, arg2, arg3, arg4) | arg4 秒後にarg1で指定される体の部位を反時計回りにarg2 度だけarg3 秒かけて支点を中心に等速回転する．arg4 が 省略された時は，arg4 に0が，arg3，arg4 の両方が省略された時はいずれも0が入力されているものとして取り扱う． |
| pic.RW( arg1, arg2, arg3) | arg1で指定される体の部位を反時計回りにarg2度だけarg3秒かけて支点を中心に等速回転する．回転が終了するまで次の命令は実行されない．arg3が省略された時は，arg3に0が入力されているものとして取り扱う． |
| for _ in range(arg1): | 対応する命令群をarg1回繰返す． |
| pic.PEN_HOLD(arg1) | arg1で指定された部位のペンを持ち，これ以降その移動の軌跡を描く． |
| pic.PEN_RELEASE(arg1) |
arg1で指定された部位のペンを放し，これ以降その移動の軌跡を描かないようにする． |
| pic.SK() | ピクトグラムを透明に変更する。透明の状態のときは通常に変更する。 |
禁止，注意，指示，安全の4項目に関するピクトグラムデザインのガイドラインも策定されて．通常，世の中に広く普及しているピクトグラムは作成ガイドラインに則ってデザインされています．ブロックピクトグラミングでは，禁止，注意，指示，安全（3種）用のピクトグラムを作るための6つのマークを簡単に設定できます．
表示できるマークの一覧を示します．
ピクトグラミングはまだまだたくさんのブロックをサポートしています．またPythonのプログラムでない形式のテキストで直接記述した形式ですが，作品例もあります．簡単でしょ？ぜひ色々なポーズを取らせてみたり，色々な図形を描いて，さらに適切なマークを設定して，あなたのオリジナルピクトグラムを作ってみてください．
Pictogramming（ピクトグラミング）は，人型ピクトグラムに関するコンテンツ生成環境です．同時に，プログラミング学習環境でもあります．
ピクトグラミングのブロック版，ブロックピクトグラミングを使って，ピクトグラムと遊んでみましょう．
とりあえず深呼吸から始めましょう．ピクトグラムと一緒にみなさんも体を動かして深呼吸を3回してみてください．
では始めていきましょう．下がブロックピクトグラミングの画面です．
画面右側のプログラム記述領域にブロックを移動しブロックを組み立てていきます．ブロックは中央にあるカテゴリ一覧から選択します．
とりあえず，「動き」のカテゴリから「回転」ブロックをクリックまたは，プログラム入力領域にドラッグします．
次に，配置したブロックの「左かた」の部分を「右かた」に，「90」度の部分を「120」度に変更してみましょう．
変更したら，実行ボタンを押してみてください．
人型ピクトグラムの右腕が上がりました．
ピクトグラムは顔がないので，どちらが右腕なのかと思われるかもしれませんが，この人型ピクトグラムは鏡に映った自分の分身でもあるので思っていただければいいです．
では続けて，「左かたを１秒で時計回りに120度、回転待ちする。」と言うブロックを追加して一つ目のブロックの下にくっつけて実行してみて下さい．
右腕を回転して，右腕の回転が終わったら，左腕の回転が開始して，最終的にばんざいの姿勢になりました．ピクトグラミングでは命令は上から順番に実行されます．
では，両腕が同時にあげるにはどうすれば良いでしょうか？
1行目の「待ち」を消してみて実行してみて下さい．
ピクトグラミングでは命令は上から順番に実行されますが，”待ち”がないと次の命令も同時に実行されますので，結果２つの回転（左腕と右腕）は同時に開始されます．この”待ち”のあるなしを組み合わせる，言い換えると逐次（ちくじ）実行と並列実行を組み合わせることで，様々な動きを表現できます．
一度プログラムを全て消去しましょう．
ボタンを押してください．
次に，これを組み立てて実行してみて下さい．
右腕を上げたあと，１回右の前腕を振りました．繰返し振らせたければ，繰返したい部分を「繰返し」カテゴリにある繰返しブロックで囲みます．
ピクトグラムがハローって手を振ってくれてます．ハローワールド！
次のプログラムを入力して実行してみましょう．
なんと！円がかけました．ピクトグラミングでは動きの履歴を線画で描画できます．
「透明」のブロックを配置すると人型ピクトグラムが透明になりますので，何を描いたかが，わかりやすくなります．
違う図形も描いてみましょう．
で左手を使って四角形を描くことができます．
このように時間0で体の部位を動かす場合，元の位置とその命令を実行したあとの位置を両端とする線分を描画します．
左腕の今の位置から，左上腕を反時計回りに90度回転した位置まで線分を描きます．さらにそこから左上腕を反時計回りに90度回転した位置まで別の線分を描きます．と繰り返すので，四角形（正方形）が描けるわけです．
一方，「回転」ブロックの「待ち」を無くすと
何も描かれません．
時間0の”待ち”の無い回転命令は，今の位置と同時に行われる複数の”待ち”の無い回転命令の動きを全て実行したあとの位置を両端とする線分を描画します．
よってこの場合，左腕の初期位置から，左上腕を反時計回りに90+90+90+90 (=360) 度回転した位置まで線分を描きます．360度回転した位置というのは回転する前の位置と同じなので，結果なにも描かれないことになります．
回転命令の時間を0以外の値にして，また複数の回転命令をうまく組み合わせると様々な図形が描けます．例を一つ示します．同時に複数の体の部位を動かすところがポイントになってます．
禁止，注意，指示，安全の4項目に関するピクトグラムデザインのガイドラインも策定されて．通常，世の中に広く普及しているピクトグラムは作成ガイドラインに則ってデザインされています．ブロックピクトグラミングでは，禁止，注意，指示，安全（3種）用のピクトグラムを作るための6つのマークを「マークを『』にする。」ブロックを使って簡単に設定できます．
表示できるマークの一覧を示します．
ピクトグラミングはまだまだたくさんのブロックをサポートしています．またブロックでないテキストで直接記述した形式ですが，作品例もあります．簡単でしょ？ぜひ色々なポーズを取らせてみたり，色々な図形を描いて，さらに適切なマークを設定して，あなたのオリジナルピクトグラムを作ってみてください．
