# チュートリアル：グラフィックコース#2 – 2Dボーンベースのキャラクター
**URL:** https://guild.rpgmakerofficial.com/t/topic/55
**Category:** チュートリアル
**Tags:** tutorial, english
**Created:** [2025 年 6 月 5 日午前 11:08 UTC](https://guild.rpgmakerofficial.com/t/topic/55 "2025-06-05T11:08:31Z")
**Posts on this page:** 3
**Page:** 1
### Author:  [@GGG-Administrator](https://guild.rpgmakerofficial.com/u/GGG-Administrator)
#### Post date: [2025 年 6 月 5 日午前 11:08 UTC](https://guild.rpgmakerofficial.com/t/topic/55/1 "2025-06-05T11:08:31Z")
このコースでは、サンプルとして含まれている **プレイヤーオブジェクト** の修正方法について学びます。
ここでは、 **2D ボーンリグキャラクター** の基本的な操作に焦点を当てます。
以前のコースと同様に、このチュートリアルでは最初のレッスンで使用した **同じチュートリアルプロジェクト** を使用します。
まずはプロジェクトを開いて準備を整えてください。
---
### Author:  [@GGG-Administrator](https://guild.rpgmakerofficial.com/u/GGG-Administrator)
#### Post date: [2025 年 6 月 5 日午前 11:10 UTC](https://guild.rpgmakerofficial.com/t/topic/55/2 "2025-06-05T11:10:27Z")
## **ステップ 1: スキンを置き換えましょう**
* * *
### 1. 添付された画像をダウンロードします：
* * *
### 2. `P_01_stickman_skin.png` をプロジェクトの **ファイルシステム** 内の任意の場所にドラッグ＆ドロップしてインポートします。
* * *
### 3. **Player シーン** (`Object_Sampleplayer.tscn`) を開きます。
* * *
### 4. シーンツリーで、以下へ移動します：
`BoneAnimationRoot > Polygon`
次に、 **Mantle\_down** から **Hand\_R** までのすべてのノードを選択します。
* * *
### 5. **インスペクター** で、`P_01_stickman_skin.png` を **テクスチャ** フィールドにドラッグ＆ドロップします。
* * *
### 6. プレイヤーキャラクターが **黒い棒人間** として表示されるようになります。
* * *
### 7. **F5 キー** を押すか、▶ ボタンをクリックしてテスト再生します。
動く棒人間のキャラクターが表示されるはずです。
* * *
### 8. 元の外観に戻すには：
`ファイルシステム > templates > objects > characters > P_01 > P_01_mat_000.png` に移動し、
手順 4〜5 を繰り返して元のテクスチャを再適用します。
* * *
## **解説**
### 🔧 **ノードの概要**
| ノード | 説明 |
| --- | --- |
| **BoneAnimationRoot2D** | ACTION GAME MAKER がフィルターやモーショントレイルなどのエフェクトのために 2D ボーンキャラクターを認識するために必要な特殊なノードです。すべての `Skeleton2D` と `Polygon2D` ノードはこのノードの下に配置する必要があります。 |
| **Skeleton2D** | 2D ボーンを定義する Godot ノードです。このノードの変換（位置、回転）は、リンクされた `Polygon2D` テクスチャに影響を与えます。 |
| **Polygon2D** | （Mantle\_down ~ Hand\_R）これらのノードは、ポリゴンメッシュと UV マッピングを使用してキャラクターの視覚的な部分を定義し、スキンの表示を行います。 |
* * *
### 🎨 **Polygon2D とテクスチャについて**
各 `Polygon2D` ノードは、UV システムを使用して **共有画像の一部を切り取る** ために使用されます。
見てみましょう：
1. `ArmL` ノードを選択します。
2. 上部ツールバーの **UV** ボタンをクリックします。
3. UV エディタが表示されます。
多角形形状の選択範囲は、`ArmL` に使用されるテクスチャの領域を示しています。 
4. UV 座標は変更されないため、カスタム画像で **同じレイアウトと寸法** を維持することで、新しいスキンを簡単に作成して適用できます。
* * *
## 🖌 **カスタムスキンのガイド**
以下は、参考用のデフォルトスキンのレイアウトです：
**P\_01\_mat\_000.png（男性キャラクター）：**
**P\_02\_mat\_000.png（女性キャラクター）：**
独自のスキンを作成する際は、上記と同じレイアウトに従ってください。
これらをガイドとして使用して、ベーススキンのテクスチャを変更または設計できます。
---
### Author:  [@GGG-Administrator](https://guild.rpgmakerofficial.com/u/GGG-Administrator)
#### Post date: [2025 年 6 月 5 日午前 11:11 UTC](https://guild.rpgmakerofficial.com/t/topic/55/3 "2025-06-05T11:11:15Z")
## **ステップ 2: アニメーションを追加しましょう**
* * *
### 1. **シーンウィンドウ** で、`AnimationPlayer` ノードを選択します。
下部パネルが自動的に **Animation** ビューに切り替わります。
* * *
### 2. アニメーションパネルの左上にある ▶ **再生** ボタンを押します。
キャラクターが少し動くはずです—これは `001_Idle` アニメーションが再生されているためです。
* * *
### 3. アニメーション名 `001_Idle` をクリックします。
47 個のプリ登録されたアニメーションがあります。異なるものを試してみましょう！
キャラクターが白と黄色の骨に基づいて動くのが見えるはずです—これらの骨の動きは、以下に示す **トラック** を使用して制御されます。
* * *
### 4. 新しいアニメーションを作成しましょう。
パネル上部の **Animation** ドロップダウンをクリックし、 **New** を選択します。
* * *
### 5. ダイアログが表示されるので、アニメーションの名前を入力し、 **OK** をクリックします。
* * *
### 6. 新しいアニメーションが作成されましたが、まだ空です—トラックはまだありません。
トラックを追加するには：
- `BoneAnimationRoot2D \u003e Skeleton` 配下にある **B\_Hip** から **B\_Chain** までのすべての `Bone2D` ノードを選択します。
- その後、ツールバーにある 🗝 **キーを挿入** アイコンをクリックします。
* * *
### 7. プロンプトが表示されます：「42 の新しいトラックを作成しますか？」— **Create** をクリックします。
21 本の骨それぞれに、 **位置と回転** のトラックが追加されます。
* * *
### 8. アニメーションの編集を始めましょう。
青い垂直線が現在の時間マーカーを示しています。
それを **0.6 秒付近** までドラッグします。
* * *
### 9. 次に、右腕をアニメーションさせましょう。
シーンウィンドウで **B\_Arm\_R** を選択します—これは右上腕の骨です。
* * *
### 10. **インスペクター** で、`Node2D \u003e Transform \u003e Rotation` の値を調整します。
腕が回転するのを見るはずです。
* * *
### 11. 角度が決まったら、再び 🗝 **キーを挿入** アイコンをクリックします。
何も起こったように見えないかもしれませんが、現在の回転が 0.6 秒の位置で保存されました。
* * *
### 12. ▶ **再生** を押します。
腕がデフォルトの位置から新しい回転位置まで滑らかに動くはずです。
この動きはキーフレーム間で自動的に補間されます。
アクションフィギュアをポーズさせるのと同じです—ポーズを設定し、キーを挿入すれば、それがアニメーションになります！
* * *
### ➡ グラフィックスコースをこちらで続ける：
> [@Tutorial: Graphics Course #3 – 2D Sprite-Based Characters](https://guild.rpgmakerofficial.com/t/topic/56?u=ggg-administrator):
>
> In this course, you’ll learn how to create a new 2D sprite character from scratch. It covers the basic operations of 2D sprite animation. As with the previous courses, this one also uses the tutoria…
* * *
## 🔍 **追加説明**
### ⏱ **アニメーションの長さとループ設定**
- **⏰ 時計アイコン** （右上）を使用して、アニメーションの長さを変更できます。
- その隣には **ループ設定** があります：
- 1 回クリック： **ループ**
- 2 回クリック： **ピンポン（往復）**
- 3 回クリック： **ループなし**
* * *
### 🧩 **ビジュアルスクリプトで新しいアニメーションを使用する**
新しいアニメーションをビジュアルスクリプトで使用するには、 **GameObject ノードのアニメーションセット** に登録する必要があります。
1. シーンウィンドウで `Player` ノードを選択します。
2. インスペクターにある **Auto-Register Animations** ボタンをクリックします。
1. これでアニメーションが登録され、ビジュアルスクリプトで使用可能になりました。
すべての登録されたアニメーションを表示するには、 **Animation Set** セクションを展開します。
* * *
### 🦴 **2D ボーンアニメーションの拡張**
このチュートリアルでは、最も基本的な操作のみを扱っています。
Godot の `AnimationPlayer` は非常に強力であり、 **逆運動学（IK）** などの機能も備えています。
高度な機能については、公式の Godot ドキュメントを参照してください：
📘 [https://docs.godotengine.org/en/4.x/tutorials/animation/cutout\_animation.html](https://docs.godotengine.org/en/4.x/tutorials/animation/cutout_animation.html)