今回のテーマは「HTML5+ゲーム」でした。ゲームのお題は人気だったらしく定員100人のところに200人以上の方が応募されていました。伏見氏(@sidestepism)今回は、ディー・エヌ・エーやグリーなどのソーシャルゲーム開発に利用されているHTML5の紹介や、JavaScriptでゲーム開発を行う為の和製ゲームエンジンについての紹介などがありました。ゲーム開発に利用されているHTML5/CSS3関連技術まずは、ゲーム開発に利用されているHTML5/CSS3について。CanvasFlashを利用できないスマートフォン環境で、ビジュアル表現を行う為には必ず利用されるCanvasは欠かせないHTML5の技術です。各社Canvasをフルに利用されていました。datingディー・エヌ・エーの場合ディー・エヌ・エーさんでは、独自にCanvas用ライブラリ(Arctic.js)を開発し、利用されています。現在は非公開ですが、近々公開されるそうです。Flashが利用出来ない環境でも、Flashが実行出来るようにExGameというSWF用ライブラリも開発されています。モバゲーの様々なゲームがスマホ対応済みサイバーエージェントの場合サイバーエージェントさんでは、AI2Canvasを利用して、IllustratorのデータをCanvas用のデータに変換して利用されています。racingグリーの場合グリーさんでは、FlashをCanvasに変換するライブラリ(Reel)を開発されています。FlashをCanvasに変換するReelまとめディー・エヌ・エーさん、グリーさんは、それぞれモバイルから展開されている為、Flashで作られたゲームが多く、それを再利用するために、スマートフォンでもSWFを利用出来るようCanvasを使ったライブラリを開発されていてサイバーエージェントさんは、データ容量を圧縮する為にCanvasを利用されているようです。Transitionこれもまた、Flashが利用できないスマートフォン環境で、アニメーションを作る際に利用されるCSS3の技術です。Canvas上でアニメーションも可能ですが、描画に時間が掛かってしまうので、Canvas自体をアニメーションさせたり、複数要素のアニメーションを管理するライブラリを開発されたり。各社工夫しながら利用されているようです。JavaScriptゲームエンジンenchant.js続いて、enchant.jsについて。enchant.jsとはenchant.jsは、様々な環境で動作するクロスプラットフォームのゲームを開発することが可能な、HTML5とJavaScriptで作られたゲームエンジン。開発は、日本企業のユビキタスエンターテインメントさんが行なっており、リリースから2ヶ月で200本以上のゲームがenchant.jsを使って作られているそうです。いったライブラリは、大体が英語圏で作られていますが、これは和製で、日本語ドキュメントが充実しています。日本のエンジニアさんには嬉しいライブラリではないでしょうか。どんなことが出来るのかenchant.jsで作られたゲームは、9leapで遊ぶことが出来ます。glide」2Dがメインですが、3Dのゲームも作ることが出来ます。ノベル系のゲームも作れるそうです。今回はご紹介だけ、機会があれば実際にサンプルを作って公開します!まとめ今回のHTML5とか勉強会は、HTML5+ゲームがテーマでした。Webの技術HTML5がゲームで利用されている。なんだか不思議な感じですが、HTML5の可能性を再認識した勉強会でした。ゲームやアプリじゃない、普通のWebサイトでHTML5の技術がどれぐらい利用できるのでしょうか。その辺りの勉強会もあったらいいなぁと思いながら、第22回を楽しみに待っています。