HTML5とJavaScriptで作る落ち物パズルゲーム全コード

今すぐ本編を読む！

発売日	2024-11-07 16:00:00
FANZA品番	d_471363
ジャンル	全年齢向け評論オカルト男性向けコミケ97（2019冬）
メーカー	るてんのお部屋
価格	1100 円～

今すぐ本編を読む！

『テトリス』や『ぷよぷよ』に類似した落ち物パズルゲームの全コードを掲載して解説した本です。HTML5＋JavaScriptで、フルスクラッチで開発しています。サンプルとして『CthulhuDrop』という、落ち物パズルゲームが付属します。

実際に遊べる落ち物パズルゲームを試しながら、その中身を確認できる技術書です。シンプルなコードなので理解しやすいです。

サンプルゲーム『CthulhuDrop』の紹介もします。横2列、縦1〜3列のブロックが落ちてきます。落下物は時計回り、反時計回りに回転できます。

落下後、重力に従ってブロックは落下します。そして、縦横斜めに3ブロック以上連続していると消去できます。また、消えたブロックに隣接する同種のブロックも消滅します。連鎖が終了するまで、消え続けます。

本書を通して、ゲーム開発の勘所をつかんでいただければと思います。

●簡略化した目次

第1章全体像
第2章HTML、CSS、main.js他
第3章タイトルシーン
第4章ドロップシーン
第5章描画処理
第6章ゲーム処理
第7章ゲーム基本関数
第8章リソース管理関数

●詳細な目次

第1章全体像
・1-1作る「落ち物パズルゲーム」の仕様
・1-2キー操作
・1-3ファイル構造
・1-4大まかな分類
・1-5js-game/nest.js
・1-6シーンのファイルの構造

第2章HTML、CSS、main.js他
・2-1index.html
・2-2css/main.css
・2-3js-main/main.js

第3章タイトルシーン
・3-1js-main/scn.titile.js

第4章ドロップシーン
・4-1js-main/scn.drop.js

第5章描画処理
・5-1js-main/draw-core.js
・5-2js-main/draw-dropping.js
・5-3js-main/draw-ef.js
・5-4js-main/screenshot.js

第6章ゲーム処理
・6-1js-main/drop-core.js
・6-2js-main/drop-input.js
・6-3js-main/drop-utl.js
・6-4js-main/drop-stuff.js
・6-5js-main/drop-erase.js
・6-6js-main/drop-erase-search.js
・6-7js-main/drop-erase-expand.js

第7章ゲーム基本関数
・7-1js-game/game.core.js
・7-2js-game/game.anim.js
・7-3js-game/game.canvas.js
・7-4js-game/game.view.js
・7-5js-game/game.ui.js

第8章リソース管理関数
・8-1js-game/resouce.image.js
・8-2js-game/resouce.font.js
・8-3js-game/resouce.sound.js