add-feature について
add-featureは、自然言語の要望をゲーム既存のコードパターンに沿った変更へ導くゲーム開発スキルです。Three.jsまたはPhaserのプロジェクトで、計画から実装、ビルド確認まで支援します。
主な機能
- 01ゲーム構成と既存パターンの調査
- 02モジュール、イベント、状態変更の計画
- 03機能の実装とゲームへの接続
- 04ビルドと統合の確認
活用シーン
- 01ゲームにパワーアップを追加
- 02スコアの仕組みを導入
- 03既存システムのパターンでゲームプレイを拡張
インストール
コマンドをコピーしてターミナルで実行します。
npx skills add https:/ / github.com/ playableintelligence/ game-creator --skill add-featureインストール後、Claude Code で/add-featureを入力して読み込まれたか確認します。
詳細
パフォーマンスに関する注意事項
- 時間をかけて、丁寧に作業してください
- 速度よりも品質を重視してください
- 検証手順を省略しないでください
機能の追加
ゲームに新しい機能を追加します。追加したい内容を平易な英語で説明してください。たとえば、「二段ジャンプのパワーアップを追加する」や「ハイスコアランキングを追加する」のように指定すると、ゲームの既存のパターンに沿って機能が実装されます。
手順
ユーザーが追加したい内容:$ARGUMENTS
ステップ 1:コードベースを把握する
package.jsonを読み、使用しているエンジン(Three.js または Phaser)を確認する- 既存の設定を確認するため、
src/core/Constants.jsを読む - 既存のイベントを確認するため、
src/core/EventBus.jsを読む - 既存の状態を確認するため、
src/core/GameState.jsを読む - 既存のシステム構成を確認するため、
src/core/Game.js(またはGameConfig.js)を読む - 既存のシーンやゲームプレイ関連ファイルを読み、すでに実装されている内容を把握する
ステップ 2:機能を計画する
コードを書く前に、平易な英語で計画を説明してください。
- 機能の内容:プレイヤーの視点から機能を説明する
- 仕組み:新しく作成するファイル、イベント、設定を列挙する
- 変更箇所:機能を組み込むために少し変更する必要がある既存ファイルを列挙する
次に、技術的に必要なものを特定してください。
- 新しいモジュールファイルと、ディレクトリ構成内での配置場所
- Events 列挙型に追加する新しいイベント
- Constants.js に追加する新しい定数
- GameState.js に追加する新しい状態
- Game オーケストレーターへの組み込み方法
ステップ 3:実装する
以下のルールを厳守してください。
- 正しい
src/サブディレクトリに新しいモジュールを作成する - 新しいイベントをすべて EventBus.js の Events 列挙型に追加する
- 設定値をすべて Constants.js に追加する(ハードコードされた値はゼロにする)
- 新しい状態ドメインがあれば、GameState.js に追加する
- 新しいシステムを Game.js に組み込む(インポート、インスタンス化、ループ内での更新)
- 他のシステムとの通信には、すべて EventBus を使用する
- プロジェクト内の既存のコードスタイルとパターンに従う
ステップ 4:検証する
npm run buildを実行し、エラーがないことを確認する- 既存のシステムを壊さずに機能が統合されていることを確認する
- 循環依存が発生していないことを確認する
- 該当する場合は、イベントリスナーが適切にクリーンアップされることを確認する
- 追加した内容を平易な英語で要約する
トラブルシューティング
機能を追加した後にゲームが動かなくなる
原因: 新しいコードが既存の EventBus イベントまたは GameState フィールドと競合しています。
解決方法: EventBus.js でイベント名が重複していないか確認します。新しい状態フィールドに GameState.reset() でデフォルト値が設定されていることを確認します。
機能は動作するが、既存のゲームプレイに支障が出る
原因: 共有定数または衝突グループを変更しています。
解決方法: 既存の定数を変更するのではなく、新しい定数を追加します。変更後に元のゲームプレイをテストします。
出力
ユーザーに以下を伝えてください。
- 機能の内容(プレイヤーの視点から)
- 作成または変更したファイル
- テスト方法 — 「
npm run devを実行して、[具体的な操作] を試してください」
使用例
パワーアップを追加する
/add-feature add a speed boost power-up that spawns randomly
結果:src/entities/PowerUp.js を作成し、EventBus に POWER_UP イベントを追加して、Constants.js に出現タイミングと持続時間を追加し、Game.js に組み込みます。プレイヤーがパワーアップを取得すると、8 秒間スピードが 2 倍になります。
スコアシステムを追加する
/add-feature add combo multiplier that increases when you score quickly
結果:GameState に comboMultiplier と comboTimer を追加し、スコアシステムにコンボ処理を作成して、UI 更新用の COMBO_CHANGED イベントを追加します。
ヒント
このコマンドは、機能を追加するために何度でも実行できます。追加するたびに、前の機能を土台として実装されます。
ゲームプレイが完成したら、ビジュアルを仕上げるには
/game-creator:design-gameを、音楽や効果音を追加するには/game-creator:add-audioを、全体的な品質を確認するには/game-creator:review-gameを実行してください。