Skip to content
sho10case
Go back

Claudeと二人三脚で「遊戯王DDM風ゲーム」を作ってみた!フェーズ5までの開発記録

こんにちは、ショウです!

「ダイスを振って、ダンジョンを広げていく――。」 かつて多くの少年を熱狂させた、あの「ダンジョンダイスモンスターズ(DDM)」風のゲームを、最新AIの Claude と一緒に作ってみました。

普段は Gemini をメインに使っているのですが、今回は趣向を変えて Claude をパートナーに指名。結論から言うと、**「AIにリードしてもらいながら作る」**という新しい開発体験が非常に心地よかったので、その過程をシェアします。


実際に動かせるゲームはこちら

以下は、今回開発したゲームのプロトタイプ(Phase 5)です。

遊び方: ダイスをロールし、クレストを消費して召喚やアクションを行います。フェーズ5の実装により、魔法や罠、防御といった特殊アクションも可能です! ※ PC ブラウザ推奨です。スマートフォン等で画面が切れる場合は、横にスワイプして操作してください。


なぜ今回は Claude だったのか?

Gemini も非常に優秀ですが、今回 Claude を使って感じた最大の違いは**「適宜質問して方向を整えてくれるプロアクティブさ」**です。

開発のスタート時、Claude からこんな逆質問がありました。

Claude: 「まず何から始めますか?設計ドキュメントを整理しましょうか?」 Claude: 「プロトタイプに必ず入れたい要素はどれですか?」

こちらがやりたいことを汲み取った上で、選択肢を提示してくれる。この「並走感」が、複雑なルールを持つボードゲーム開発には非常にマッチしていました。


開発フェーズ:0 からプレイ可能になるまで

【設計〜Phase 1】基盤構築:グリッドとダイス

まずは 13×13 のグリッドと、ターン管理、そして DDM の肝である「ダイスロール」と「クレストプール」を実装しました。

クレスト獲得の様子

【Phase 2】召喚とデバッグ

ここで一度壁にぶつかりました。「召喚ボタンが押せない」というバグです。 Claude にコードを投げた際のやり取りがこちら。

私: 「召喚ができないです。どのタイミングでクリックすればできますか?」 Claude: 「原因が分かりました。召喚ボタンの条件が厳しすぎます。本来は『振った後に召喚する』のが正しいフローなのに、コード上では『振る前(!isRolled)』に限定されていました。」

即座に原因を特定し、ロジックの矛盾を解消。これを修正し、モンスターの移動とステータス表示までが完成しました。

召喚のキャプチャ

【Phase 3〜4】バトルシステムと演出

攻撃クレストの消費、HP 減少による消滅、そして敵 AI の実装。 さらに「ゲームらしさ」を出すために演出を強化しました。

  • アニメーション: 召喚時のエフェクト、攻撃時のシェイク、ダメージ数値のポップアップ。

ゲーム風景

【Phase 5】特殊ルールの追加(現在地)

最新のアップデートでは、戦略の幅を広げる 3 つの機能を実装しました。モンスターごとにダイスの展開パターンが変わるなど、戦略性が一気に増しています。

私: 「モンスター毎に展開する形を変えてバリエーションつけることはできます?」 Claude: 「できます!スライムは十字型、ゴブリンはL字型、ドラゴンは横大十字など、各モンスターのイメージに合わせた展開パターンを割り当てましょう。Rキーで回転もできるようにします!」

機能内容効果
防御 (🛡)クレスト1消費次に受けるダメージを半減
魔法 (✨)クレスト2消費射程3マス、壁貫通、防御無視ダメージ
罠 (💣)クレスト1消費自陣に設置、踏んだ敵に固定20ダメージ

現状の課題と今後の展望

現在は Phase 5 まで完了していますが、まだまだやりたいことは山積みです。

  • レスポンシブ対応: スマホ画面では見切れてしまうため、UI の調整が必要。
  • クレスト処理の改善: クレストが持ち越せない際の自動削除ロジックの選択制。
  • NPC の強化: 生成 AI を活用したより賢い敵 AI の実装。
  • グラフィックの向上: モンスターやダイス展開のエフェクトをさらにリッチに。

まとめ:AI 開発のコツは「役割分担」

今回の開発を通して、設計やロジックの骨子は Claude に任せつつ、自分は「何が面白いか」「どこに矛盾があるか」を判断するディレクター兼デバッガーに徹することができました。

単一の HTML ファイルでここまで複雑なロジックを完結させられる Claude の生成能力には驚かされます。次はどんな特殊アビリティを実装しようか、夢が広がります。

技術スタック

  • Logic: JavaScript (Vanilla)
  • Styling: CSS (Animation, CSS Grid)
  • AI Pair: Claude 3.5 Sonnet / 4.6

フィードバックお待ちしております!

このゲームへの感想や「こんな機能を付けてほしい!」といったご要望がありましたら、ぜひ X (@sho10se) へのリプライやDM、またはお問い合わせフォームまでお寄せください。

皆さんのアイデアで、このダンジョンをさらに広げていければ嬉しいです!


あわせて読みたい記事:



Related Posts