html5でゲームをつくる

次世代HtmlのHtml5では、かなりリッチに作り込みが出来るようになっています。

Html5.jp
http://www.html5.jp/

JavaScriptから図を描くことができるCanvasHtml5の仕様に入っていて
これまでは、FlashJavaアプレットで表現していたゲームも、
このCanvas(とjavascript)を利用して作ることが出来ます。

HTML5Canvasで作られたゲーム厳選18選
http://blog.verygoodtown.com/2010/09/html5-canvas-game-18/

既にたくさんのゲームが作られてる。

で、ゲームを開発するためのゲームエンジンまで作られています。

IMPACT
http://impactjs.com/

ブラウザからスマートフォンまで幅広く動くのはHtml5ならではですねー。

Canvasで四角を描く


onload = function() {
draw();
};
function draw() {
/* canvas要素のノードオブジェクト */
var canvas = document.getElementById('canvassample');
/* canvas要素の存在チェックとCanvas未対応ブラウザの対処 */
if ( ! canvas || ! canvas.getContext ) {
return false;
}
/* 2Dコンテキスト */
var ctx = canvas.getContext('2d');
/* 四角を描く */
ctx.beginPath();
ctx.moveTo(20, 20);
ctx.lineTo(120, 20);
ctx.lineTo(120, 120);
ctx.lineTo(20, 120);
ctx.closePath();
ctx.stroke();
}
http://www.html5.jp/canvas/how.html より