MASANAGA
BABA

戦闘ゲーム

battliGame1
battleGame2
battleGame3
battleGame4
battleGame5

Vue3とSassを使用して制作したファンタジーRPG風の戦闘ゲームです。

プレイヤーは複数のステージを進みながら、様々なスキルやアイテムを駆使して敵と戦います。

ゲーム進行に応じて敵の難易度が上昇し、戦略性の高いバトルが楽しめる設計です。

敵の状態異常(毒・睡眠)やプレイヤーの強化成長要素、モーダルウィンドウによるアイテム/スキル選択、ショップ機能、ログ表示など、細部まで工夫を凝らしました。

使用スキル

・Vue3(Composition API):状態管理・再利用性の高い構成でゲームロジックを実装

・Sass:ミックスイン・変数・ネストを活用したスタイル管理

・HTML/CSS:レスポンシブなレイアウトとUI表現

・JavaScript:DOM操作やゲームロジック全般の補完

・Font Awesome:ステータスやアイコンの視覚的演出に使用

・GSAPアニメーション

主な実装機能

・ステージごとの敵キャラクター出現とランダム戦闘

・HP/MPゲージ、ログ表示、経験値によるプレイヤー強化

・状態異常(毒・睡眠)による戦略的バトル

・スキル使用(ポイズン・スリープ・パワーアタック)

・アイテム使用・購入・売却(ポーション・巻物・爆弾など)

・バトル後のショップ・次ステージ遷移モーダルの導入

・戦闘ログの記録と表示