長年にわたり、Blockly and Blockly Games のチームは多くの教訓を学んできました 新しいブロックの開発にも適用できます以下はその 私たちが犯した間違いや他者がよく犯す誤りのコレクションです。
これらはブロックリーのビジュアルスタイルと すべてのユースケースや設計に当てはまるとは限りません。他のソリューションもあります。これは、 ユーザーが直面する可能性のある問題と、それらを回避する方法を完全に網羅したものではありません。 できます。事例は若干異なり、それぞれでトレードオフがあります。
1. 条件付きとループ
新規ユーザーにとって最も難しいブロックは、条件とループです。多数 ブロックベースの環境では、これら 2 つのブロックを同じ「Controls」 両方のブロックは同じ形状で、同じ色です。 新規ユーザーが 2 つのブロックを混同してしまうため、フラストレーションがたまることがよくあります。 Blockly は、条件とループを個別の「ロジック」に移動することを推奨および 'ループ'色で分類されます。これにより、 これらは、形状が似ていても動作が異なる個別のアイデアです。
おすすめの方法: 条件とループは分離しておきます。
2. 1 ベースのリスト
初心者のプログラマーは、最初のプログラマーがゼロベースのリストに遭遇すると、反応が悪くなります。 あります。その結果、Blockly は Lua と Lambda Moo に先駆けてリストを作成し、 文字列インデックスは 1 から始まります。
Blockly のより高度な使い方として、ゼロベースのリストを使用して、 テキストへの遷移が容易になります若年層や初心者向け その場合でも 1 ベースのインデックス作成をおすすめします。
おすすめの方法: 1 を最初の数字にします。
3. ユーザー入力
ユーザーからパラメータを取得する方法は 3 つあります。プルダウンは 最も制限が厳しいため、シンプルなチュートリアルや演習に適しています。入力フィールド 自由度が増し、よりクリエイティブな活動に適しています。値のブロック 入力（通常はシャドウ ブロックを使用）により、値を計算するための （ランダムなジェネレータ）を使用することです。
おすすめの方法: ユーザーに適した入力方法を選択します。
4. ライブ ブロック画像
ブロックのドキュメントには、参照先のブロックの画像を含める必要があります できます。スクリーンショットの撮影は簡単です。しかし、そのような画像が 50 枚あり、 1 人が 50 言語に翻訳され、そのうちの 1 人が 2,500 言語を維持 使用できます。配色を変更し、2,500 枚の画像の更新が必要 --もう一度、
このメンテナンスの悪夢から私たちを解放するために、Blockly Games は Blockly のインスタンスが読み取り専用モードで実行されているすべてのスクリーンショット結果 画像と同一に見えますが、最新の状態であることが保証されます。読み取り専用 国際化が可能になりました。
推奨事項: 複数の言語をサポートする場合は、読み取り専用モードを使用します。
5. もう 1 人のレフト
米国における子どもたちからのフィードバック（興味深いことに他の国からは見られませんでした） 左右の混乱が明らかになったのです。この問題は、 矢印の追加です。方向がアバターなどの相対的場合は スタイルが重要です。A → 直線矢印や ↱ ターン矢印はわかりにくい アバターが反対方向を向いているときに認識されます最も役立つのは ⟳ 円形です 回転する角度が矢印よりも小さい場合でも、矢印が差し込まれます。
推奨事項: 可能であれば、テキストを Unicode アイコンで補完します。
6. ブロックの概要
可能な限り、たとえそのリスクが軽減されたとしても、より高度なアプローチを採用するべきです。 柔軟性に欠けるという点です次の Apps Script 式について考えてみましょう。
SpreadsheetApp.getActiveSheet().getDataRange().getValues()
潜在的な機能をすべて保持する 1 対 1 のマッピングでは、上記の 4 つのブロックを使用して作成されます。ただし、Blockly は、より高次の 式全体をカプセル化する 1 つのブロックになります。目標 残りの 5%は難しくても Blockly はテキストベースの言語を置き換えるものではなく、 最初の学習曲線を経て すぐに使い始めることが サポートしています。
おすすめの方法: API 全体をやみくもにブロックに変換しないでください。
7. オプションの戻り値
テキストベース プログラミングの多くの関数は、アクションを実行してから結果を返す
指定します。この戻り値は使用できる場合もあれば、使用できない場合もあります。たとえば、スタックの
pop() 関数を使用します。Pop を呼び出して、最後の要素を取得し、削除することもできます。
または、戻り値を持つ最後の要素を削除するように
無視されます。
var last = stack.pop(); // Get and remove last element. stack.pop(); // Just remove last element.
一般的に、ブロックベースの言語は戻り値を無視することにあまり適していません。 value ブロックを、値を受け入れるものに挿入する必要があります。他にも 戦略をいくつか見ていきましょう。
a）問題を回避する。ほとんどのブロックベースの言語では、 これらのケースを回避してくださいたとえば、Scratch には 戻り値を返すことができます。
b）2 つのブロックを指定します。ツールボックス内のスペースが問題でない場合は、 2 つのブロックがあり 返されます。この方法の短所は、ユーザーが Google の判断を ほぼ同じブロックがたくさんあるツールボックスです。
c）1 つのブロックを変更します。プルダウン、チェックボックス、その他のコントロールを使用して、 ユーザーは戻り値の有無を選択できます。ブロック オプションに応じて形状が変わります。たとえば Blockly のリスト アクセス ブロックに表示されます。
d）価値を食べる。App Inventor の最初のバージョンでは、特殊なパイプが 結果を返します。ユーザーはコンセプトを理解しておらず、 2 番目のバージョンの App Inventor では、パイプブロックが削除され、 使い捨て変数に値を代入するだけにすることをおすすめします。
推奨事項: 各戦略には長所と短所があるため、適切なものを選択してください 提供できます
8. 成長ブロック
ブロックによっては、可変数の入力が必要になる場合があります。例は 任意の数値の集合を合計する加算ブロック、または if/elseif/else を 任意の elseif 句のセットを含むブロック、または 任意の数の初期化された要素です。いくつかの戦略があります。 メリットとデメリットがあります。
a）最も単純なアプローチは、ユーザーが小さな文字からブロックを ブロックします。たとえば、2 つの数値をネストして 3 つの数値を ブロックがあります。もう一つの例は if/else ブロックのみを提供し、 ネストさせると elseif 条件を作成できます
このアプローチの利点は、初期のシンプルさです（ユーザーとの 必要ありません。デメリットは、多数のワーカーが コードが非常に煩雑になり、ユーザーが 維持します。
b）別の方法として、ブロックを動的に展開して常に 1 つ存在させることもできます。 自由入力が可能です。同様に、最後の入力があれば、最後の入力が削除されます。 自由入力があります。これは、最初のバージョンでは、 App Inventor を使用します。
自動的に増加したブロックは、数年間 App Inventor のユーザーに低評価されました 理由があります。まず 自由なインプットがあり 「complete」。次に、スタックの中央に要素を挿入すると、 編集箇所と配下にある要素がすべて切断され 再接続します。とはいえ、順序が重要ではなく、ユーザーが 非常に便利なオプションです
c）穴の問題を解決するために、ブロックに +/- ボタンを追加して、 手動で入力を追加または削除できます。Open Roberta はこのようなボタンを 2 つ使用して、 入力を削除したりできます他のデベロッパーも、それぞれに 2 つのボタンを追加しています。 スタックの中間からの挿入と削除が 対応できます。また、各行に 2 つの上下ボタンを追加して、 スタックに対応できます
この戦略では、ブロックごとに 2 つのボタンのみを使用するオプションから、 1 行あたり 4 ～ 4 個のボタンを一方ではデータにアクセスできなくなると ユーザーが必要とするアクションを実行できると、 宇宙船エンタープライズの橋のように見えるって。
d）最も柔軟なアプローチは、ブロックにミューテーター バブルを追加することです。この そのリソースの構成ダイアログを開く単一のボタンとして ブロックします。要素は自由に追加、削除、並べ替えることができます。
このアプローチのデメリットは、ミューテータが特定のタスクに対して直感的では 説明します。ミューテータを導入するには、なんらかの指示が必要です。 低年齢の子どもを対象とするブロックベースのアプリケーションでは、ミューテータを使用しないでください。 一度学んだことは、パワーユーザーにとってはかけがえのないものです。
推奨事項: 各戦略には長所と短所があるため、適切なものを選択してください 提供できます
9. クリーンなコード生成
Blockly の上級ユーザーは、生成されたコード（JavaScript、 Python、PHP、Lua、Dart など）が記述され、記述されたプログラムをすぐに認識できます。 つまり、この機械生成されたコードを維持するには、余分な労力が必要です。 読み取ります余分な丸かっこ、数値変数、空白文字など 冗長なコード テンプレートはすべて、洗練されたコードの作成の妨げとなります。 生成されるコードにはコメントを含める必要があります。また、生成されたコードに従う必要があります。 Google のスタイルガイド。
推奨事項: 生成されたコードに誇りを持てるようにする。お客様に見せます。
10. 言語の依存関係
クリーンなコードを求める副作用として、Blockly の動作は 主に、クロスコンパイル言語の動作に関して定義されます。最も 一般的な出力言語は JavaScript ですが、Blockly がクロスコンパイルすると 保存するために、不当な試みをしてはなりません。 動作を統一する必要があります。たとえば JavaScript では、 string は false ですが、Lua では true です。データの単一のパターンを定義すると、 動作は、ターゲット言語に関係なく、Blockly のコードで実行されます。 GWT コンパイラから出力されたように見える保守不能なコードが生成されます。
推奨事項: Blockly は言語ではありません。既存の言語で 影響を与えるためです。