ようこそ!浜村拓夫の世界へ

    ブログ内検索

    最近の記事

    ブックマーク数の多い記事

    Blog Translation

    Powered By FC2ブログ

    Powered By FC2ブログ
    ブログやるならFC2ブログ


    FC2ブログ LOGIN

    with Ajax Amazon

    JavaScriptの勉強にenchant.js

    このエントリーを含むはてなブックマーク はてなブックマーク - JavaScriptの勉強にenchant.js あとで読む
    JavaScriptを勉強する教材として、enchant.jsというライブラリを使ったゲーム制作が面白そうです。

    HTML5/JavaScriptによるゲーム開発はプログラミング入門に最適なのだ

    プログラミングを学びたいなら、HTML5とJavaScriptでゲーム開発するのが一番の近道だと思う。
    なぜかというと、オブジェクト指向という、かなり面倒な概念をおそろしく具体的に学ぶことが出来るからだ。



    HTML5の登場で、ダイナミックなWebページが、手軽に作れるようになった。

    HTML5・JavaScript・CSS3アプリケーション開発入門 (日経BPパソコンベストムック)
    日経BP社
    2011-07-29
    ★★★★☆


    enchant.jsはもともとBASICでゲームを作るように気軽にゲーム開発につかえることを目指してHTML5/JavaScript向けに開発したものだが、実際には今のWebブラウザとハードウェアがあまりに進化していたために、BASICでは到底およばなかったような恐ろしく複雑で重い処理を、ほとんど制約を意識せずに書くことが出来る。



    JSで、ベーマガが今再び。

    もちろん、かといって制約から完全に自由なわけではない。
    けれども、これほど奔放にオブジェクト指向を、その設計された本来の意味で活用してかなり複雑なゲームを作る、という体験は今までにない大きな可能性を感じざるを得ない。



    インスタンスをバンバン作って、豪快にメモリを使う。

    たとえばRubyやPythonといった言語からオブジェクト指向を学ぼうとすると、オブジェクト指向における「オブジェクト」とは、数字を入れる箱だったり、メソッドを入れる器としてしか認識できない。

    しかしもともとオブジェクト指向とは、オブジェクト同士がメッセージをやりとりすることによって複雑な処理を協調動作させていく、というイメージから生まれたものだ。

    今日メソッドと呼ばれているものは、もとは「メッセージ」と呼ばれていて、それはオブジェクト間が文字通りメッセージをやりとりする、というイメージの中で生まれたものだ。

    言葉とイメージのつながりは初心者にこそ重要で、目に見えないなにものかが「オブジェクト」であるよりも、目に見える爆発やミサイルといったものが「オブジェクト」である、と言われた方が圧倒的に理解し易い。

    そしてクラスの継承や多態性(ポリモーフィズム)、ダックタイピングといった直感的な理解がやや難しい概念も、ゲームでこそわかりやすくできる。



    ゲームプログラミングでは、
    ・オブジェクトが具体的である
    ・メッセージのやりとりを意識した、メソッドの作成

    オブジェクト指向プログラミング - Wikipedia

    オブジェクト指向プログラミング言語の仕組み
    オブジェクト指向プログラミング言語は、相互にメッセージを送りあうオブジェクトの集まりとしてプログラムを構成することができる仕組みを持つ。
    そのために、少なくともオブジェクトについての3つの仕組みと、オブジェクトの管理についての3つの仕組みが必要となる。

    オブジェクトの仕組み
    - オブジェクトに蓄えられる情報、データを表現する仕組み。
    - 他のオブジェクトにメッセージを配送する仕組み。
    - 受け入れ可能な各種メッセージに対応して、処理する事柄を記述する仕組み(メソッド)。



    実際、ARCで研究員の同級生で、全くの素人たちを集めて、JavaScriptによるプログラミングを教えてみたところ、夕方にはみんな自分の思い通りのプログラムをなんらかの形で書けるようになるところまで上達した。

    パズルを楽しむように課題に挑戦し、自分の力で解いて行くことでプログラミングを自分のものにしていくという体験は、彼らを夢中にさせたのだ。

    この経験をもとに、今現在、プログラムの全くの初心者がenchant.jsを使ってプログラミングの基礎を覚えることができるような教育プログラムを構築できないか模索中だ。



    素晴らしい構想だな~!
    パズルで遊ぶように、楽しみながらプログラミングを習得すると。

    文部科学省の「プログラミン」 - 右脳的プログラミングのすすめ - 浜村拓夫の世界

     本当の意味でコンピュータリテラシーがあるというのは、つまりプログラミングができるということだ――。“パーソナル・コンピュータ”という概念の生みの親で、先進的なプログラミング言語「Smalltalk」やGUIというインターフェイスの開発者としても知られるコンピュータ科学者のアラン・ケイ博士は、そう言い切る。コンピュータに囲まれて育ったわれわれの子どもたちは、コンピュータリテラシーを持つ初めての世代になるだろう、と。



    小学生以下の子供なら、タイルプログラミングが向いていると思うけど、
    中高生以上なら、JavaScriptでお手軽なゲームプログラミングをやってみたら良い。

    ●enchant.js
    http://enchantjs.com/

    enchant.js は HTML5 + JavaScript ベースのゲームエンジンです。
    わずか30KBのソースコードで、PC, Mac, iPhone, iPad, Android すべてで動作する クロスプラットフォームなアプリケーションを開発可能なスタンドアロンライブラリです。



    4Gamer.net ― プログラミングは最高だ。無差別級ゲームコンテストも発表されたUEI「enchant.js meetup!」レポート

    発端は,今年の3月ごろに清水氏が漏らした「昔あったファミリーベーシックみたいなものがほしい」という言葉から始まったという。
    その場にいた学生達は「ファミリーベーシックってなに?」と思いながら聞いていたらしいのだが,調べると,テレビにつないで子供がプログラミングしてゲームが作れるものらしい。
    こんな感じかなと当時大学1年だった田中 諒氏が1週間くらいでさらさらっと作ったのがenchant.jsのα版となるものだ。



    ファミリーベーシック - Wikipedia

    ファミリーベーシックとは、任天堂のファミリーコンピュータの周辺機器の一つ。
    BASIC言語を組み込んだロムカセットと、ファミコン本体のエキスパンドコネクタに接続するキーボードの2点がセットになっている。
    前述の2点をファミコン本体に接続することにより、BASICの文法に基づいた簡単なゲームプログラムを自作することができるようになる。

    ファミリーベーシック



    プラグイン localStorage.enchant.js
    3G回線の遅さ,不安定さを解消するためのLocalStorageプラグインについての概要紹介だ。
    これは,よく使う画像を,ブラウザのLocalStorageに保存しておこうというもの。
    LocalStorageというのは,いわばCookieの大きい奴のような感じで,URLごとに関連した文字列を保存しておける仕組みだ。
    本来文字列しか扱えないのだが,Base64コーディングすることによって,画像を保存し,ネットワークからダウンロードすることなしに使ってやろうというわけだ。



    Webアプリでも通信量を削減するために、いろいろ工夫されてるんだな~。
    JavaScriptって、すごいやね!

    今後,プログラムを目指すならHTML5(とJavaScript)が最適であると判断したという。
    HTML5は,現在のFlashと同等以上の意味を持ったものとなり,「HTML5を制するものだけが未来への切符を手にすることができる」と清水氏は語る。



    ゲームのようなインタラクティブなWebアプリ、あるいはリッチ・コンテンツは、ActionScriptでSWFを作るという路線から、HTML5+JavaScript(enchant.js)へと転向していくのかもしれない。
    =ブラウザがあれば、どこでも動くのだから。

    これから練習するなら、
    (1) JavaScript (enchant.js)
    (2) ActionScript
    という順番が良いかな?

    ActionScriptには、無料のFlashDevelopもあるけど、基本的にはAdobe製品を買わなきゃ不便?
    ASと較べて、JavaScriptは、プログラムを書く環境が圧倒的にお手軽?



    9leap : どこでも遊べる、投稿型ゲームサイト
    http://9leap.net/

    ●mario.js
    ゲーム作成に役立つJavaScriptのライブラリが、他にもいろいろあるみたい。

    JavaScriptゲームエンジン『enchant.js』『mario.js』について調べてみました - sakotsu inspire

    『mario.js』ってなんですか?
    JavaScriptでアクションゲームの実装について調べていたところ、『mario.js』というソースコードに行き着きました。
    エンコードされたバイナリデータ(不可解な大量の文字列の塊)からマリオのドットグラフィックやサウンドを再現してるんですね。



    便利なライブラリを公開してくれて、助かるな~。
    ありがたく使わせていただこう。
    関連記事

    コメント

    コメントの投稿


    管理者にだけ表示を許可する

    トラックバック

    トラックバックURL:
    http://hamamuratakuo.blog61.fc2.com/tb.php/699-e5197506

    FC2Ad