enchant.js　その1 - ire0014のブログ

概要

日経ソフトウェア7月号の記事で「enchant.jsでらくらくゲームプログラミング入門」という特集があって第1回は「9分でゲームを作る」というタイトルでした。
ホントですか！と思ったのでやってみました。

内容

どんなゲーム？

ブラウザゲームで、画面の上から白い熊がまっすぐ落ちてくるので、茶色い熊をドラッグして動かして避けていくゲームです。得点とかクリアはありません。白熊にぶつかるとゲームが終わります。ブラウザリロードで再開。

準備

まずはブラウザやテキストエディタが必要ですが、まぁ皆さんあると思います。インターネットエクスプローラーとメモ帳でOKです。私はFirefoxとサクラエディタを使いました。OSはwindows7です。
次にenchant.jsをダウンロードする必要があります。便利な関数とか画像とかが入っています。
Githubからからか
公式サイトの左側の「Download」
から取得して適当なフォルダに解凍しておきましょう。

じゃあスタート！

ということで記事通りに作業を始めていきました。画像も用意されているし、記事として、段階的に作っていってくれるのでわかりやすかったです。
まぁ実際記事を読みながらだったので20分くらいはかかりました。そして動きました！上記の画像です。感動！今回が連載第1回なのでこれを期に学んで行こうと思います。
当たり判定とか大変なんじゃないかと思うのですが「if(白熊.within(茶熊))」みたいな書き方でtrueとfalseが返ってくるだけという簡単なつくり！すごい！
Githubにソースアップしました。

動画

記事には記事の筆者が本当に9分で作成した証拠動画が紹介されていました。

※私ではございません。
これも面白かったです。まずなんかスタートとゲームオーバーが用意されてる！作っている途中でつまずいたりするのも面白いし、テキストエディタはVimという奴でしょうか。カスタマイズしているのか、入力補完(携帯の予測変換みたいなの)があってやりやすそうです。というかそもそも普通のJavaScriptの書き方じゃないんですけど。これがcoffeeスクリプトですか？わかりませんけども。
スタートからの経過時間を表示したり、3秒ごとにスピードが速くなったり白熊が出てくる数を多くしたりとゲーム性も付けています。そして最後に1分あまったところで白熊さんがトコトコ走っている様に画像を切り替えてグッと面白そうになりました。ていうかかわいい！
作っていく過程を動画で見せるのが多くなってきましたね。やっぱりかっこいいなぁ。