2d-games について
スプライト、タイルマップ、物理、カメラ、ジャンルごとの定番パターンを扱う 2D ゲーム開発ガイドです。ゲームシステムの設計に役立ち、衝突判定やカメラ設計の選択肢も示します。
主な機能
- 01スプライトアトラスとアニメーション
- 02タイルマップのレイヤー設計
- 03衝突形状と物理設定
- 04カメラ追従と画面揺れ
- 05プラットフォーマーとトップダウンのパターン
活用シーン
- 01キャラクターのスプライトアニメーション設計
- 02歩行可能な地形とシーンレイヤーの設計
- 03衝突判定と物理の時間刻みの選択
- 04プラットフォーマーのジャンプとカメラ動作の設定
インストール
コマンドをコピーしてターミナルで実行します。
$
npx skills add https:/ / github.com/ vudovn/ ag-kit --skill 2d-gamesインストール後、Claude Code で/2d-gamesを入力して読み込まれたか確認します。
詳細
2D ゲーム開発
2D ゲームシステムの原則。
1. スプライトシステム
スプライトの整理
| コンポーネント | 目的 |
|---|---|
| アトラス | テクスチャをまとめ、ドローコールを削減する |
| アニメーション | フレームシーケンス |
| ピボット | 回転・スケールの原点 |
| レイヤー | Z 順序の制御 |
アニメーションの原則
- フレームレート:一般的には 8~24 FPS
- インパクトを表現するためのスクワッシュ&ストレッチ
- アクションの前に予備動作を入れる
- アクションの後にフォロースルーを入れる
2. タイルマップの設計
タイルの考慮事項
| 要素 | 推奨事項 |
|---|---|
| サイズ | 16x16、32x32、64x64 |
| オートタイル | 地形に使用する |
| コリジョン | 単純化した形状 |
レイヤー
| レイヤー | 内容 |
|---|---|
| 背景 | インタラクションのない風景 |
| 地形 | 歩行可能な地面 |
| 小道具 | インタラクティブなオブジェクト |
| 前景 | パララックスオーバーレイ |
3. 2D 物理
コリジョン形状
| 形状 | 用途 |
|---|---|
| ボックス | 長方形のオブジェクト |
| 円 | ボール、丸みのあるオブジェクト |
| カプセル | キャラクター |
| ポリゴン | 複雑な形状 |
物理の考慮事項
- ピクセルパーフェクトと物理ベースのどちらにするか
- 一貫性を保つために固定タイムステップを使用する
- フィルタリングにレイヤーを使用する
4. カメラシステム
カメラの種類
| 種類 | 用途 |
|---|---|
| 追従 | プレイヤーを追う |
| 先読み | 動きを先読みする |
| マルチターゲット | 2 人プレイ |
| ルームベース | メトロイドヴァニア |
画面の揺れ
- 短い時間(50~200ms)
- 強度を徐々に弱める
- 控えめに使用する
5. ジャンル別パターン
プラットフォーマー
- コヨーテタイム(端を過ぎた後の猶予)
- ジャンプバッファリング
- ジャンプの高さを可変にする
トップダウン
- 8 方向または自由移動
- エイムベースまたはオートエイム
- 回転を取り入れるかどうかを検討する
6. アンチパターン
| ❌ 避けること | ✅ 推奨すること |
|---|---|
| テクスチャを分ける | アトラスを使用する |
| 複雑なコリジョン形状 | コリジョンを単純化する |
| ガタつくカメラ | 滑らかに追従させる |
| 物理でピクセルパーフェクトにする | どちらか一方の方式を選ぶ |
覚えておきましょう: 2D では明瞭さが重要です。すべてのピクセルに意味を持たせましょう。
コメント
Markdown 対応