Screenshots
Overview
概要
スターフォックス風の2D横スクロールシューティングです。当たり判定と隕石の落下・跳ね返りに物理エンジンMatter.jsを採用し、グローバル重力下で隕石だけを落下させて「物理エンジンらしさ」を演出。3ステージ・難易度3段階・ボス／中ボス・複数武器など、一通りの要素を実装したプロトタイプです。
How to use
遊び方・使い方
ステージセレクトで上下キーにステージ、左右キーで難易度を選びEnter/Spaceで開始します。矢印キー／WASDで移動、Space/Zでショット（押しっぱなしで連射）、X/Shiftでチャージショット（貫通・高ダメージ）、Cでボム（敵弾全消去＋全体大ダメージ）。撃破ドロップで武器（ホーミング／レーザー）やショットレベルアップ・回復を取得し、コンボで最大x4のスコア倍率を狙います。ステージ後半でボスが出現、撃破でSTAGE CLEAR。残機3・コンティニュー2回。落下する隕石は撃ち落とすとスコア、被弾でダメージ。ゲームパッド・タッチ操作にも対応します。
Tech stack
技術スタック
JavaScriptViteMatter.jsCanvas 2DWebAudio
物理エンジンMatter.jsで隕石の落下・跳ね返りを表現。描画はCanvas 2D、BGM／効果音はWebAudio合成、ハイスコアはlocalStorage。Matter.js内蔵のレンダラ／ランナーは使わず、requestAnimationFrameの固定ステップループを自作しています。
Highlights
工夫した点
- グローバル重力はONのまま自機・弾・敵を重力から外し、隕石だけ落下・跳ね返りさせて物理エンジンの存在感を効果的に使い分け
- 衝突カテゴリ（ビットフラグ）とイベントで当たり判定を整理し、各bodyにentity参照を持たせる設計
- 入力（キーボード／ゲームパッド／タッチ）を同一アクションへ集約し、入力バッファのスワップやパーティクル再利用でフレーム毎のアロケーションを抑制
To improve
改善したい点
- ステージ数（3面）やボス攻撃パターンが少なく、ボリューム面でプロトタイプ域
- ランキング（名前入力）やリプレイ、キーリマップ設定UIなど周辺機能が未実装
- 背景・エフェクト演出（ネビュラ、機体トレイル、ボス撃破演出）の強化余地
What's next
今後の展望
- ローカル／オンラインのランキングとリプレイ保存・再生
- ステージ追加・ボス攻撃パターンの多様化・ステージギミック
- キーリマップ設定UIと演出強化