add-feature
既存のブラウザゲームのアーキテクチャパターンに沿って、新しいゲームプレイ機能を追加します。「機能を追加して」「二段ジャンプを追加して」「パワーアップを追加して」「リーダーボードを追加して」など、特定のゲームメカニクスの実装を求められた際に使用します。見た目のみの変更(design-game を使用)や図形をスプライトに置き換える場合(add-assets を使用)には使用しません。
description の原文を見る
Add a new gameplay feature to an existing browser game following its architecture patterns. Use when the user says "add a feature", "add double-jump", "add a power-up", "add a leaderboard", or describes a specific game mechanic to implement. Do NOT use for visual-only changes (use design-game) or replacing shapes with sprites (use add-assets).
SKILL.md 本文
Performance Notes
- 時間をかけて丁寧に進める
- スピードより品質を重視
- 検証ステップをスキップしない
フィーチャーの追加
ゲームに新しい機能を追加します。追加したい内容をプレーンな日本語で説明するだけで(例:「ダブルジャンプのパワーアップを追加」「ハイスコアのリーダーボードを追加」)、ゲームの既存パターンに従って機能が構築されます。
手順
ユーザーが追加したいのは: $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: 機能を計画する
コードを書く前に、計画をプレーンな日本語で説明してください:
- 何をするのか: プレイヤーの視点から機能を説明
- どのように機能するか: 作成される新しいファイル、イベント、設定をリストアップ
- 何に影響するか: 機能を配線するために小さな変更が必要な既存ファイルをリストアップ
その後、技術的に必要なものを決定します:
- 新しいモジュールファイルとディレクトリ構造内の場所
- EventBus の Events enum に追加する新しいイベント
- Constants.js に追加する新しい定数
- GameState.js に追加する新しい状態
- Game オーケストレーターに配線する方法
ステップ 3: 実装する
以下のルールを厳密に従ってください:
- 正しい
src/サブディレクトリに新しいモジュールを作成 - すべての新しいイベントを
EventBus.jsの Events enum に追加 - すべての設定値を
Constants.jsに追加(ハードコーディングされた値はゼロ) - 新しい状態ドメインを
GameState.jsに追加 - 新しいシステムを
Game.jsに配線(インポート、インスタンス化、ループ内での更新) - すべての他のシステムとの通信に EventBus を使用
- プロジェクト内の既存のコードスタイルとパターンに従う
ステップ 4: 検証する
npm run buildを実行してエラーがないか確認- 機能が既存のシステムを破壊することなく統合されたか確認
- 循環依存が導入されていないか確認
- イベントリスナーが適切にクリーンアップされているか確認(必要に応じて)
- 追加されたものをプレーンな日本語で要約
トラブルシューティング
機能追加後にゲームが動かなくなった
原因: 新しいコードが既存の EventBus イベントまたは GameState フィールドと競合している。 修正: EventBus.js でイベント名の衝突をチェック。GameState.reset() で新しい状態フィールドがデフォルト値を持つことを確認。
機能は動くが既存のゲームプレイが壊れた
原因: 共有定数またはコリジョングループを変更した。 修正: 既存の定数を変更するのではなく、新しい定数を追加。変更後に元のゲームプレイをテスト。
出力
ユーザーに以下を伝えてください:
- 機能が何をするか(プレイヤーの視点から)
- 作成または変更されたファイル
- テスト方法 — 「
npm run devを実行して [特定のアクション] を試してください」
使用例
パワーアップを追加する
/add-feature ランダムにスポーンするスピードブーストパワーアップを追加
結果: src/entities/PowerUp.js を作成、EventBus に POWER_UP イベントを追加、Constants.js にスポーンタイミングと持続時間を追加、Game.js に配線。プレイヤーがパワーアップを取得 → 8秒間スピードが2倍になる。
スコアリング機構を追加する
/add-feature 素早くスコアしたときにスコアが増加するコンボマルチプライヤーを追加
結果: comboMultiplier と comboTimer を GameState に追加、スコアリングシステムにコンボロジックを作成、UI更新用に COMBO_CHANGED イベントを追加。
ヒント
このコマンドは何度でも実行して、機能を追加し続けることができます。各機能は前の機能に基づいて構築されます。
ゲームプレイに満足したら、ビジュアルをポーランド仕上げするには
/game-creator:design-game、音楽とサウンドエフェクトを追加するには/game-creator:add-audio、完全な品質チェックを行うには/game-creator:review-gameを実行してください。
ライセンス: MIT(寛容ライセンスのため全文を引用しています) · 原本リポジトリ
詳細情報
- 作者
- opusgamelabs
- ライセンス
- MIT
- 最終更新
- 不明
Source: https://github.com/opusgamelabs/game-creator / ライセンス: MIT
関連スキル
nano-banana-2
inference.sh CLIを通じてGoogle Gemini 3.1 Flash Image Preview(Nano Banana 2)で画像を生成します。テキストから画像を生成する機能、画像編集、最大14枚の複数画像入力、Google Searchグラウンディング機能に対応しています。トリガーワード:「nano banana 2」「nanobanana 2」「gemini 3.1 flash image」「gemini 3 1 flash image preview」「google image generation」
octocode-slides
洗練されたマルチファイル形式のHTMLプレゼンテーションを生成します。6段階のフロー(概要 → リサーチ → アウトライン → デザイン → 実装 → レビュー)で構成されています。各スライドは独立したHTMLファイルとなり、iframeで読み込まれます。「スライドを作成してほしい」「プレゼンテーションを作ってほしい」「HTMLスライドを生成してほしい」「デックを構築してほしい」といった依頼や、ノート・ドキュメント・コードを洗練されたプレゼンテーションに変換する際に使用できます。
gpt-image2-ppt
OpenAIのgpt-image-2を使用して、視覚的に優れたPPTスライドを生成します。Spatial Glass、Tech Blue、Editorial Monoなど10種類のキュレーション済みスタイルに対応し、ユーザーが提供したPPTXファイルを模倣するテンプレートクローンモードも搭載しています。HTMLビューアと16:9形式のPPTXファイルを出力します。プレゼンテーション、スライド、ピッチデック、投資家向けPPT、雑誌風PPTの作成依頼などで活用してください。
nano-banana
Nano Banana PRO(Gemini 3 Pro Image)およびNano Banana(Gemini 2.5 Flash Image)を使用したAI画像生成機能です。以下の場合に活用できます:(1)テキストプロンプトからの画像生成、(2)既存画像の編集、(3)インフォグラフィックス、ロゴ、商品写真、ステッカーなどのプロフェッショナルなビジュアルアセット制作、(4)複数画像での人物キャラクターの一貫性保持、(5)正確なテキスト描画を含む画像生成、(6)AI生成ビジュアルが必要なあらゆるタスク。「画像を生成」「画像を作成」「写真を作る」「ロゴをデザイン」「インフォグラフィックスを作成」「AI画像」「nano banana」またはその他の画像生成リクエストをトリガーとして機能します。
oiloil-ui-ux-guide
モダンでクリーンなUI/UXガイダンス・レビュースキルです。新機能や既存システム(Webアプリ)に対して、実行可能なUI/UX改善提案、デザイン原則、デザインレビューチェックリストが必要な場合に活用できます。CRAP(コントラスト・反復・配置・近接)をベースに、タスクファーストなUX、情報設計、フィードバック・システムステータス、一貫性、affordances、エラー防止・復旧、認知負荷を重視します。モダンミニマルスタイル(クリーン・余白・タイポグラフィ主導)を強制し、不要なテキストを削減、アイコンとしての絵文字を禁止し、統一されたアイコンセットから直感的で洗練されたアイコンを推奨します。
axiom-hig-ref
Apple Human Interface Guidelines リファレンス — 色(セマンティックカラー、カスタムカラー、パターン)、背景(マテリアル階層、ダイナミック背景)、タイポグラフィ(標準スタイル、カスタムフォント、Dynamic Type)、SF Symbols(レンダリングモード、色、多言語対応)、ダークモード、アクセシビリティ、プラットフォーム固有の考慮事項を網羅したガイドラインです。