HTML5 Game Dev Wiki

Outline

HTML5 Game Dev Wiki

概要

HTML5 の Canvas と Java Script を利用してゲームを作成します。

基本的な開発予定
1. 簡単なFPSゲームを作成
2. ゲームプログラムの基本構造を固める
3. 別ジャンルのゲームを作成

ゲーム開発を進めながら HTML5 によるゲーム開発のノウハウを整理していく予定です。

Google ガジェット(OpenSocial) 対応

開発中のゲームは Google ガジェット(OpenSocial) としても動作します。
iGoogle の画面から以下の XML を指定して追加します。

KioMiku Player	http://cnut256.appspot.com/gadgets/kmp.xml
wPhone	http://cnut256.appspot.com/gadgets/wphone.xml
JS FPS	http://cnut256.appspot.com/jsfps/gadget.xml
Mini Games	http://cnut256.appspot.com/minigames/gadget.xml

（フォーカスの関係で表示直後はキーボードが利かない状態ですが、ゲーム画面をクリックするとキーボード入力が有効になります。）

ウェブページに埋め込むことも可能です。
以下のコードをウェブページの HTML に埋め込みます。

KioMiku Player (埋込例： http://h5gamedev.sourceforge.jp/?Welcome:KioMiku_Player )

<script src="http://www.gmodules.com/ig/ifr?url=http://cnut256.appspot.com/gadgets/kmp.xml&amp;synd=open&amp;w=340&amp;h=350&amp;title=KioMiku+Player&amp;border=%23ffffff%7C3px%2C1px+solid+%23999999&amp;output=js"></script>

wPhone (埋込例： http://h5gamedev.sourceforge.jp/?Welcome:wPhone )

<script src="http://www.gmodules.com/ig/ifr?url=http://cnut256.appspot.com/gadgets/wphone.xml&amp;synd=open&amp;w=220&amp;h=420&amp;title=wPhone&amp;border=%23ffffff%7C3px%2C1px+solid+%23999999&amp;output=js"></script>

JS FPS (埋込例： http://h5gamedev.sourceforge.jp/?Welcome:JS_FPS )

<script src="http://www.gmodules.com/ig/ifr?url=http://cnut256.appspot.com/jsfps/gadget.xml&amp;synd=open&amp;w=430&amp;h=420&amp;title=JS+FPS&amp;border=%23ffffff%7C3px%2C1px+solid+%23999999&amp;output=js"></script>

Mini Games (埋込例： http://h5gamedev.sourceforge.jp/?Welcome:Mini_Games )

<script src="http://www.gmodules.com/ig/ifr?url=http://cnut256.appspot.com/minigames/gadget.xml&amp;synd=open&amp;w=530&amp;h=460&amp;title=Mini+Games&amp;border=%23ffffff%7C3px%2C1px+solid+%23999999&amp;output=js"></script>

OpenSocial について

サーバ上に配置済みのアプリ

動作確認用です。

JS FPS
- http://cnut256.appspot.com/jsfps/game.html
JS FPS Editor（データ保存が可能です。サーバの動作は鈍重）
- http://cnut1024.byteact.com/jsfps/editor.html
ミニゲーム集（炉リンダンス、ガチムチ・ボクシング、ファイアーマン）
- http://cnut256.appspot.com/minigames/game.html

解説ページ

wiki:TestPage

参考サイト

Akihabara	http://www.kesiev.com/akihabara/
Aves Engine	http://www.dextrose.com/en/projects/aves-engine
Ben Joffe	http://www.benjoffe.com/code/
JavaScript Adventures	http://www.mrspeaker.net/javascript/
HTML5 Canvas Cheat Sheet	http://simon.html5.org/dump/html5-canvas-cheat-sheet.html

素材サイト

しゅがーぽっと	http://www.icnet.ne.jp/~sugarpot/index.html
仮設サイト	http://www.geocities.jp/bhmqm120/material.htm
スキマノソザイ	http://wato5576.hp.infoseek.co.jp/index.html
stockvault	http://www.stockvault.net/
01SoundEarth	http://www.01earth.net/sound/
ULTIMATEゲーム事業部	http://utm-game-web.hp.infoseek.co.jp/free-sound.htm

Witch Craft	http://witchcraft-jp.sakura.ne.jp/index.html
MikuMikuDance	http://www.geocities.jp/higuchuu4/
Xiao Sphere	http://xiao-sphere.net/
ぽりぽりぽり	http://ameblo.jp/pandacocoa/
ガチムチ素材集	http://www10.atwiki.jp/herrington/
ニダーRPG人民共和国	http://nida.vs.land.to/
TAM Music Factory	http://www.tam-music.com/index.html
キオ式アニキャラ3D	http://kiomodel3.sblo.jp/

etc (gadgets-alpha-20100830)	2010-08-30 05:53
h5gamedev (sgskel-alpha-20100908)	2010-09-08 16:35

HTML5 Game Dev