ムーンブロックの使い方から感想まで秋葉原リサーチセンターで開発された「MOONBlock」は「前田ブロック」とも呼ばれており、enchant.jsをベースとした教育用のビジュアルプログラミング言語です。(enchant.jsとは、HTML5+JavaScriptで作られた、簡単にゲームが作れることで人気のフレームワークです)現在、国内で最も有名な教育用のビジュアルプログラミング言語といえばScratchを挙げる方が多いかと思いますが、大人のプログラミング学習にMOONBlockを用いることはScratchにはない利点があります。それは、より高度なプログラム表現を可能としており、if文(条件分岐)やfor文(ループの処理)の理解しやすさを重視しているという点です。そんなより実践につながることを目指して開発されているMOONBlockは、関連するドキュメントはまだ少なめですが大人にもおすすめしたいプログラミング学習サイトとなっています。戻る2.未経験から無理なくJavaScriptにステップアップMOONBlockの基本はScratchなどと同じく、ブロックを組み合わせていくスタイルのビジュアルプログラミング言語です。こちらはあらかじめ用意されたブロックを使用するだけでなく、自力でJavaScriptを記述してオリジナルのブロックを追加する「JavaScriptキット」も使用可能です。このようにMOONBlockは学習を進めて物足りなくなればいくらでも極めていくことが可能な拡張性の高さを誇っており、ビジュアルプログラミング言語から始めてJavaScriptプログラマへと無理のないステップアップが可能となっています。▲目次へ戻る3.ユーザ登録不要でセーブも可能MOONBlockにはユーザ登録や共有の機能がなく動作はブラウザ上になりますが、作業中の内容はセーブすることができるので安心です。詳しいセーブの方法は、次の項目にてご紹介したいと思います。MOONBlockの始め方と動作環境MOONBlockを始めるには、まず次のサイトにアクセスします。Chromeを使用してみて下さい。MOONBlockの画面MOONBlockにアクセスすると、まず次のような画面が表示されます。画面左上には、ブロックのカテゴリが並んでいます。横に長く「パペット」「ビヘイビア」「リアクション」「ゲーム」「ネットワーク」「制御」「ロジック」「変数」「JavaScript」「システム」の、合計10個のカテゴリがありますが、画面サイズにより隠れています。クリック&ドラッグで左右にスライドすると、隠れているカテゴリを表示することができます。画面右上のSTARTと描かれた枠は、実行画面です。画面左下のメニューには、「セーブ」「ソース」「リセット」「スクリーン」「Run」の5つのボタンがあります。画面右下のごみ箱マークには、不要なブロックを重ねることで削除することが可能です。画面中央の黒いフィールドは、全体が入力エリアとなっています。任意のカテゴリをシングルクリックすると、それに対応するブロックの一覧が表示されます。希望するブロックを選んで入力エリアにドラッグ&ドロップすることで、ブロックを配置することができます。キャラクターを配置したい場合、「パペット」のカテゴリを選択して出てくる一番上の「パペット」と書かれたブロックを使用します。パペットとは、MOONBlockにおいてキャラクターのことを指します。ブロックの削除ブロックの削除は、前述のごみ箱へのドラッグ&ドロップで行います。入れ子構造になっている上位のブロックをつかむと、まとめて捨てることができます。画面左下メニューにある「Run」をクリックすると、画面右上の四角い画面内で作成したプログラムが実行されます。「Run」の隣にある「スクリーン」ボタンを押すと、実行画面を拡大して表示することが可能です。元に戻す場合は、実行画面左下にある「×とじる」ボタンを押します。プログラムのセーブとロードMOONBlockはブラウザを再起動してもキャッシュ等をクリアしなければ前回の作業状態が残ったまま再開できますが、特定のポイントでセーブすることも可能です。セーブしたい場合は、まず左下にある「セーブ」ボタンを押します。公式サイトによると、この画面中央に表示されたソースをテキストファイルなどに保存しておき、ロードする場合はこのセーブ画面の内容を消して保存しておいたテキストを貼り付けることで復元できるとのことです。ちなみにこのセーブ画面を表示している間だけアドレスバーに表示されるURLをブックマークしておくことでもセーブできる(ロードしたい場合はブックマークにアクセスするだけ)ので、個人的にはそちらの方が簡単かなとも思います。左下メニューにある「ソース」ボタンをクリックすると、JavaScriptのソースコードを確認することができます。ブロックを配置したらどんなコードが増えているのかその都度確認してみると、JavaScriptの仕組みに対する理解が深まりやすいのではないでしょうか。▲目次へ戻る5.MOONBlockの口コミや評価は?MOONBlockを小学校のクラブで採用された感想を見つけましたので、ご紹介致します。MOONBlockへの取り組みは、教師用端末からChromeを全PCで立ち上げ、MOONBlockのサイトアドレスを全PCに飛ばすことからスタートします。逆に言うと、それ以上の手助けはしないようにしましたし、興味が無いならScratchやプログラミンに取り組んでもよい環境でした。ところが、大抵の子はMOONBlockをそのまま続けています。仮にブラウザだけ立ち上げて、好きなサイトを選べ(アドレスを送らない)となったらどのツールを選択するか。一位はMOONBlockでした。三位はブラウザを閉じて、アクションエディタを起動していました。次のように、マイナス面の評価もみられました。・保存の仕方がネック・思考を思った通りに表せないみたい(出典:MOONBlockとenchantMOONを小学校のクラブで採用した感想)MOONBlockはマウスによる操作感が少し独特なので、その点が子ども達には馴染むのに時間がかかる要素だったようです。セーブとロードの仕方は説明なしでは大人でも気づくのが難しいのではないでしょうか。このあたりはインターフェースの改善など期待したいところかもしれません。思考を思った通りに表せないという点はJavaScriptを使用してオリジナルブロックを作ることで解決可能ですが、やはり子どもには難しいようです。これからJavaScriptを学んでいきたい方にとっては、こんな機能が欲しい!は大きなモチベーションにもつながるのではないでしょうか。その後MOONBlockはコロコロコミックという少年誌が運営する「コロコロゲーム工作ブロック」のベースシステムとして採用されており、さらに子どもにも分かりやすいよう工夫されたインターフェースで多くの小学生がプログラミングの楽しさに目覚めているようです。当サイトによるコロコロゲーム工作ブロックを使用した詳しい感想は、別途記事をご参照下さい。▲目次へ戻る6.MOONBlockは未経験者におすすめのJavaScript学習ツール未経験からプログラミングを学ぶ場合、多くの方が陥るいくつかの落とし穴があるようです。MOONBlock設計の前段階として行われた調査では、プログラミング経験ゼロの大学生や社会人にプログラミングを教えることで、つまづきやすいポイントとして次のような項目が上がりました。(1)A=A+1など変数が変化する代入式(数学的な等式としては矛盾してるように見える)を受け入れられない(2){}や[]などの対応関係がすんなり入力できない。全角半角の区別がつけられない(3)条件分岐やループなどの概念は理解できるがどのように使えばいいのかわからない(4)配列を理解するのに時間がかかるこれらのつまづきを解消することを前提として設計されたMOONBlockは、Scratchなどのビジュアルプログラミング言語とは次のような違いがあります。Scratch、およびSqueakは、前田ブロックのアプローチと比較すると、フローチャートをビジュアル化したものにより近いものであると言える。それは「論理の構築」というプログラミングの一つの側面を教育する用途には適していると言えるが、論理の構築よりも仕様の定義を先に教える前田ブロックとはアプローチが逆である。Scratchはボトムアップ型、前田ブロックはトップダウン型の構築を目指していると言っても良いだろう。Scratchには2.0からクローン機能が搭載されたとはいえ、「本体」というイデアが別に存在するのに対し、前田ブロックはより現状の主流となっているプログラミング言語に近いパラダイムである「クラス」を定義し、「インスタンス」が生成されるという仕組みを導入していることも大きな違いの一つであると言える。(出典:ScratchとMOONBlock(前田ブロック)はどう違うの?)Scratchと比較すると参考サイトや書籍はまだ少ないMOONBlockですが、Scratchなどのその他のビジュアルプログラミング言語と比較してより大人向き、より実践向きな作りを目指している印象です。プログラミング未経験の大人でJavaScriptを扱うエンジニアを目指しているけどいきなりソースコードはハードルが高いと感じる方は、ぜひMOONBlockを利用してみてはいかがでしょうか。▲目次へ戻るSHARE最新記事スキルアップ2020.02.19兵庫県のプログラミングスクール5選|人気おすすめは?料金&特徴を比較2020年最新!この記事では、兵庫県で人気&おすすめのプログラミングスクール5校を料金や講座内容別に徹底比較。ご自分のペースで効率よく学べる無料のオンラインスクールもありますよ。今回は、茨城県で人気&おすすめのプログラミングスクール6校を料金や特徴別に徹底比較。多彩なコースで効率よく学べる人気スクールなど厳選してまとめました。今回は、兵庫県でおすすめのIT専門学校とプログラミングスクールを受講料が安い順ランキングで9校まとめました。若狭湾を囲んで美しいビーチや景勝地が点在する福井県。今回は「プログラミングを学んで東京都内でエンジニアとして就職したい!」という方に向けて、福井でおすすめのIT専門学校&プログラミングスクールを厳選2校ピックアップ。[...]スキルアップ2020.02.10岡山県のIT専門学校&プログラミングスクール7選!学費と特徴を徹底比較きびだんごと桃太郎といえば岡山県!今回は、そんな岡山県でおすすめのIT専門学校&プログラミングスクールを受講料が安い順にランキング形式で7校ご紹介。世界遺産の厳島神社や日本三景と称される安芸の宮島など、世界的に有名な観光地として知られる広島県。