プログラミング不要！2時間以内でAI駆動の3Dゲームを作成する方法を学ぶ

コードスニペットの全体的なプロセス（コード生成のプロンプトとして使用可能）：

1. プレイヤーの移動ロジックとUI生成

  1. GameLogicはゲームのコア管理コンポーネントを表します。ゲーム内のすべてのイベントを受け取り、適切なサブシステムに分配することで、コードの結合度を効果的に低減します。
  2. プレイヤーがBoxColliderを含むフレームに近づくと、それにアタッチされたTransponderコンポーネントが自動的にインタラクションを検出し、プレイヤーが近づいたイベントをGameLogicコンポーネントに渡します。これに応答して、UIFactoryはユーザー入力用のUIパネルをインスタンス化します。
  3. このUIパネルにはInputDialogコンポーネントが含まれており、プレイヤーのキーボード入力をリッスンします。プレイヤーが初めてEnterを押すと、入力ボックスがアクティブになり、キーボードフォーカスをキャプチャします。プレイヤーが入力し終えて再度Enterを押すと、入力はイベントとしてGameLogicに送信されます。
  4. プレイヤーがBoxColliderを含むフレームから離れると、UIパネルは即座に破棄されます。

2. モデル生成とスケルトンマッピング（TripoSDKが提供）

  1. GameLogicコンポーネントがプレイヤーからのプロンプト入力を受け取ると、そのプロンプトをTripoClientコンポーネントに渡します（注意：有効なTripoAPIKeyが事前に提供されている必要があります）。
  2. TripoClientはTripoAPIコンポーネントを呼び出してプロンプトをTripoサーバーに送信します。このプロセス中、TripoAPIはリクエストを組み立てて送信し、定期的にサーバーをポーリングして更新を確認します。成功すると、プレイヤーはTripoサーバーから生成されたモデルのTaskIDを受け取ります。このTaskIDはスケルトン生成のリクエストに使用されます。
  3. リギングプロセスが完了すると、TripoAPIはモデルのダウンロードURLをTripoClientに返します。TripoClientはglTFfastプラグインを介してGLB形式のモデルをロードおよび解析します。
  4. 次に、RuntimeHumanoidAvatarBuilderコンポーネントがモデルにマウントされます。このコンポーネントはGLBモデルのスケルトンをUnityのHumanoid Avatarシステムにマッピングし、アニメーションのリターゲットを可能にします。
  5. 最後に、TripoClientはシーンにモデルをインスタンス化します。この時点で、開発者は既存のヒューマノイドアニメーションリソースを使用して、新しく生成されたモデルを動かすことができます。

3. コントロールの切り替え

  1. GameLogicコンポーネントはプレイヤーのキーボード入力をリッスンし、プレイヤーと生成されたモデルの間でコントロールを動的に切り替えます。具体的には、カメラの優先順位を調整し、ThirdPersonControllerの制御ターゲットを再割り当てします。
  2. プレイヤーがFキーを押すと、コントロールがプレイヤーキャラクターからモデルに切り替わり、プレイヤーはそれを操作できます。Fキーを再度押すと、コントロールはプレイヤーに戻ります。
  3. 生成されるモデルによっては、そのサイズが大きく異なる場合があります。非常に大きいものから非常に小さいものまであり、ユニークなゲームプレイインタラクションを可能にし、プレイヤーが異なる障害物を通過できるようにします。
  4. さらに、モデルの外観は簡単に交換でき、ゲーム内で低コストのキャラクターカスタマイズおよびスキンシステムを効果的にサポートします。

全体的なコードロジック：

メインGameObject

具体的な実装手順：

Unityバージョン：2022.3.55

ソースコードとシーンのパス： Assets-LowPoly Environment Pack - Demo - Demo1

1. プロジェクトのセットアップとリソースのインポート：

  1. 新しいプロジェクトの作成
    1. Unityを開き、「New Project」をクリックします。
    2. URP (Universal Render Pipeline)テンプレートを選択します。
    3. プロジェクト名をTripoRuntimeTutorialとし、「create」をクリックします。
  2. 必要なリソースパックのインポート

ブラウザを開き、Unity Asset Storeにアクセスしてください。以下の無料パッケージを検索してダウンロードします（提供されているプロジェクトファイルにも含まれています）。

「My Resourcesに追加」をクリックし、その後のポップアップで「Open in Unity」をクリックしてダウンロードします。

各パッケージをダウンロードした後、Unityメニュー上部の「Unity > Assets > Import Package > Custom Package」に移動し、1つずつインポートします。各プロンプトで「Import」をクリックします。

  1. マテリアルをURPに変換

一部のインポートされたマテリアルがピンク色に表示される場合があります（シェーダーの問題を示します）。変換するには：

  • シーン内でピンク色になっている、または奇妙に見えるすべてのモデルをフィルターまたは選択します。
  • 次に、Editor > Rendering > Materials に移動し、それらをUPR互換のマテリアルに変換します。
  1. glTFast依存関係のインストール（GLBモデルのロード用）

オプション1：Git経由でインストール（ローカルGit環境が必要です）

  • Window > Package Manager に移動し、「+」ボタンをクリック > 「Add package from Git URL」を選択します。
  • URL: https://github.com/atteneder/glTFast.git を入力し、「Add」をクリックして glTFast プラグインがインポートされるのを待ちます。

オプション2：Tripo公式サイトからダウンロード、glTFastプラグインも含まれています。

  • Tripoのホームページにアクセスし、Resourcesセクションに移動します。
  • Unity Pluginをダウンロードします。これにはすでにglTFastの依存関係が含まれています。
  • パッケージに含まれているチュートリアルビデオに従ってインストール手順を確認します。
  1. デモシーンを開く
  • Unityプロジェクトウィンドウで、Assets > LowPoly Environment Pack > Demo > Demo1 に移動します。
  • Demo1をダブルクリックして開きます。

カスタム環境を設定するには：

  • Assets > ithappy フォルダーから、戦車、岩、木などのアセットをシーンにドラッグします。
  • これでプレイヤーを環境内で自由に移動させることができます。
  1. プレイヤー関連のプレハブを追加

Assets > StarterAsset > ThirdPersonController > Prefabs に移動します。

以下の3つのプレハブをHierarchyパネルにドラッグします。

  • MainCamera
  • PlayerFollowCamera
  • PlayerArmature
  1. カメラパラメータの設定
  • シーン内のPlayerFollowCameraを選択します。
  • プロパティパネル（Inspector）で、CinemachineVirtualCameraコンポーネントを見つけます。
  • FollowとLook Atの両方をPlayerCameraRootに設定します（注意：PlayerArmatureの子コンポーネントの下で見つけることができます）。

上記のセットアップでは、Unityが提供するサードパーソンコントローラースクリプトを使用しています。この時点で、UnityツールバーのPlayボタンをクリックすると、WASDキーを使用してキャラクターの動きを制御できます。キャラクターとカメラが適切に移動し、調整されるはずです！

プレイヤーの接近時にプロンプトパネルを表示する

プレイヤーが特定のオブジェクトに近づくと、UI入力パネルが表示されるようにします。プレイヤーが離れると、パネルは消えます。

  1. トリガーエリアの作成
  • Assets > ithappy > Military FREE > Perfab ディレクトリでモデル（例：戦車）を選択します。
  • モデルを右クリックし、「Create Empty Child」を選択し、名前を「Trigger」に変更します。
  • Triggerオブジェクトを選択し、Inspectorで「Add Component」をクリックし、Box Colliderを追加します。
  • 「Is Trigger」オプションをチェックします。
  • 「Edit Collider」をクリックし、シーンビューでハンドルを調整して、コライダーをモデルの2倍のサイズに拡大し、その周辺エリアをカバーします。
  1. トリガーイベントスクリプトの作成
  • Projectパネルで、Assetsフォルダーを右クリック > Create > C# Script を選択し、名前を Transponder にして、Cursorでスクリプトを開きます。
  • このスクリプトは、"player"タグを持つGameObjectがコライダーに入場または退出したときに検出するようにし、メッセージをGameLogicコンポーネントに送信します。Cursorでモデルを選択し、参照プロンプトを入力します。

タグが "player" のGameObjectがコライダーに入ったときに OnPlayerEnter を、プレイヤーが退出したときに OnPlayerExit をトリガーする Unity C# スクリプトを Transponder という名前で生成してください。

  • スクリプトを保存し、TransponderコンポーネントをシーンのTriggerオブジェクトにドラッグします。
  1. ゲームロジック管理

シーンを右クリック > Create Empty、名前をGameLogicManagerに変更します（ロジックコンテナとして機能します）。

  • GameLogicManagerの下に別の空の子を作成し、名前をGameManagerにします。
  • 新しいスクリプトを GameManager という名前で作成します。これはシーンのコアロジックを処理します。

Transponderコンポーネントを引用し、プレイヤーが入場または退出したときのイベントをリッスンします。参照プロンプトは次のとおりです。

TransponderインスタンスからのOnPlayerEnterおよびOnPlayerExitイベントをリッスンするUnity C#スクリプトをGameManagerという名前で生成してください。 OnPlayerEnter時に、UIFactoryスクリプトを使用してUIプロンプトプレハブをインスタンス化してください。 OnPlayerExit時に、このUIプレハブを破棄してください。

スクリプトを保存した後、GameManagerスクリプトをGameManagerオブジェクトにドラッグし、TransponderコンポーネントをTransponderフィールドにドラッグします。これにより、プレイヤーの入場および退出イベントのリッスンが完了します。

  1. UIパネルプレハブの作成

Hierarchyで右クリック > UI > Panel を選択し、新しいパネルを作成します。

  • パネルの下に2つのコンポーネントを追加します。
    • Text（プロンプトの指示を表示するため）
    • InputField（プレイヤーの入力を受け取るため）
  • Gameビューをプレビューとして使用し、レイアウトと位置を調整します。
  • 完了したら、パネルオブジェクト全体をAssetsフォルダーにドラッグしてプレハブを作成します。
    • 名前をInputDialogPrefabとします。

注意：TextMeshProを使用している場合は、テキスト内の四角い文字を避けるために、NotoSansSC SDFなど、中国語に対応したフォントを割り当てるようにしてください。

  1. InputDialogスクリプトの作成：入力ロジックの処理
  • InputDialogというUnity C#スクリプトを作成します。

参照プロンプト：

  • TMPベースのUIダイアログボックスを管理するInputDialogというUnity C#スクリプトを生成してください。
  • プロンプト用のTMP_Textと入力用のTMP_InputFieldを含める必要があります。
  • 最初のEnterキー押下時：入力ボックスをアクティブにし、プレイヤーの移動コントローラー（例：ThirdPersonController）を無効にします。
  • 2回目のEnterキー押下時：入力を送信し、移動を再度有効にし、ダイアログボックスを破棄します。
  • 有効な入力がされるまで入力フォーカスを維持してください。

InputDialogコンポーネントをInputDialogPrefabにマウントします。対応するTextオブジェクトとInputFieldオブジェクトを、コンポーネント（Dependencies）のそれぞれのフィールドにドラッグします。

  1. UIFactoryスクリプトの作成：UIパネルのインスタンス化

UIFactoryという名前の新しいC#スクリプトを作成します。

参照プロンプト：

  • ファクトリーパターンに従ってUIダイアログボックスをインスタンス化するUnity C#スクリプトをUIFactoryという名前で生成してください。
  • UIプレハブ、位置、回転を与えられた場合、指定されたTransformにプレハブをインスタンス化し、そのInputDialogコンポーネントを返してください。

このコンポーネントは、UI作成ロジックをゲームイベント処理から分離するための中間役として機能します。

  1. 関連コンポーネントの依存関係

すべてのコンポーネントの依存関係が正しく割り当てられているか、再度確認してください。

  • シーン内のPlayerArmatureオブジェクトには、Tagが「Player」に設定されている必要があります。

GameManagerオブジェクトで、以下を割り当てます。

  • TransponderフィールドにTriggerオブジェクトのTransponderスクリプトを割り当てます。
  • UIFactoryフィールドにGameLogicManagerオブジェクトのUIFactoryコンポーネントを割り当てます。

テスト：UnityでPlayをクリックします。

  • トリガーのあるオブジェクトに近づくと、入力パネルが表示されるはずです。
  • 離れると、パネルは自動的に消えるはずです。

注意：提供されているソースファイルでは、パネルが生成される位置が固定されています。選択したTriggerのTransformプロパティに合わせてこの値を変更してください。または、UIプレハブのCanvas > RenderModeをScreenSpace - Overlayに設定すると、UIがスクリーン空間データでレンダリングされ、ワールド空間に入りません。

プロンプトをTripoAPIに送信する

この段階では、Tripoサーバーにプロンプトをリアルタイムで送信することはまだできません。しかし、プロンプト送信、ネットワークリクエスト、モデル生成、スケルトンリギング、マッピング、アダプター、アニメーションリターゲットに必要なコードはすでに準備されています。これらのスクリプトは、今後のアップデートでTripo for Unityプラグインに完全に統合される予定です。（注意：続行する前に、シーンにUIEventシステムが存在することを確認してください。そうでない場合、UIは応答しません！）

  1. Tripoプラグインスクリプトのインポート

Unity Projectパネル（通常は左側）で、ダウンロードしたフォルダーからソースファイルTripoClient.cs、TripoAPI.cs、RuntimeHumanoidAvatarBuilder.csを見つけます。

  • それらをAssets/Scriptsフォルダーにドラッグします。

各スクリプトの機能は次のとおりです。

  • TripoClient.csとTripoAPI.cs：Tripoサーバーとのプロンプト送信とネットワーク通信を処理します。
  • RuntimeHumanoidAvatarBuilder.cs：GLTFastプラグインを使用して、モデルのスケルトンをUnityのヒューマノイドリグにマッピングします。

TripoClient.csとTripoAPI.csは、リギング機能を持つTripo For Unityプラグインの軽量バージョンを表しています。今後のリリースで、このプロセスを更新し、合理化していく予定です。

  1. Tripo Clientコンポーネントを作成
  • GameLogicManagerの下に空のコンポーネントを作成し、名前をTripoClientとします。
  • TripoClient.csとTripoAPI.csをこの新しいオブジェクトにドラッグしてスクリプトをアタッチします。
  • Inspectorで、TripoClientコンポーネントのAPI Keyフィールドを見つけます。Tripo APIキーを貼り付けます（Tripo公式サイトでアカウントを登録すると、毎月600ポイントを無料で受け取ることができます）。
  1. プロンプト入力とコールバックロジック

プレイヤー入力システムをアップグレードしたため、GameManager内のプロンプト送信ロジックを更新する必要があります。デフォルトでは、GameManagerスクリプトはすでにOnPlayerEnterおよびOnPlayerExitイベントをリッスンしているはずです。AI生成コードや複数のコンポーネント間でロジックを連結している場合は、以前に生成されたコードをコンテキストとして貼り付けると役立ちます。

提供されたスクリプトでは、GameManagerがUIFactoryにインスタンスコールを発行した際のコールバック関数がすでに定義されています。もちろん、他の解決策もありますが、この部分のロジックを完成させるために使用できるプロンプトは次のようになります。

更新された動作：GameManagerスクリプト内

  • OnPlayerEnterがトリガーされると、UIFactoryが入力ダイアログ（InputDialogプレハブ）をインスタンス化します。
  • OnPlayerExitがトリガーされると、入力ダイアログが破棄されます。

プレイヤーがプロンプトの入力を終えると、tripoClient.TextToModel(prompt, pos); の呼び出し例でTripoClientスクリプトに渡されます。関連するスクリプトを修正します。

GameManager.csを修正：

  • GameManager.csスクリプトを開きます。
  • OnPromptConfirmedメソッド（プロンプト入力の確認を処理します）を見つけます。
  • 内部コードを完成させ、tripoClientフィールドがGameManagerコンポーネントで正しく割り当てられていることを確認します。
  1. モデルコンテナの作成
  • シーン階層で、空のコンポーネントを子として作成し、名前をModelContainerとします。
  • これを動的に生成されるすべてのモデルの親ノードとして使用します。

設定をテストする

  1. UnityでPlayボタンを押します。
  2. パネルにプロンプトを入力します。
  3. プロンプトがTripoサーバーに正常にアップロードされたことを確認できるはずです。
  4. 生成の進行状況はUnity ConsoleとTripo APIコンポーネントの「Input/Progress」フィールドに表示されます。

これで、Unityで独自のAIモデルを生成する準備ができました。ビルドを楽しんでください！

アニメーションリターゲット

モデルが生成されたら、次のステップは既存のアニメーションリソースをモデルのスケルトンにマッピングすることです。RuntimeHumanoidAvatarBuilderスクリプトがプロジェクトに追加されていることを確認してください。このスクリプトは、ヒューマノイドGLBスケルトンからUnityのAvatarへのマッピングを処理し、TripoClientスクリプトはそれを生成されたモデルに自動的にマウントします。

まず、プロジェクトの構造と依存関係を整理しましょう。ゲーム開始前は、環境オブジェクトを除いて、カスタムGameObjectは次の状態になっているはずです。各スクリプトコンポーネントを展開し、すべてのフィールドが正しく割り当てられていることを確認してください。問題が発生した場合は、ソースファイルと比較して、コンポーネントの割り当てが間違っていないか確認してください。

そうでなければ、私たちのデモでは、モデルは戦闘メカであるため、そのTransform > Scaleプロパティは10倍に拡大されています。これはそのコントローラー関連のプロパティにも当てはまります。

  1. モデル制御コンポーネントを追加

ModelContainerコンポーネントを選択し、以下のコンポーネントを順次追加します（すべてStarter Assetsパッケージによって提供されます）。

  • Character Controller
  • Player Input
  • Third Person Controller

Third Person Controllerコンポーネントで、CameraフィールドをシーンのMainCameraに設定します。

  1. モデル移動のためのカメラを設定

空の子コンポーネントを作成し、ModelCameraと名前を付け、それにCinemachineFreeLookコンポーネントを追加します（Cinemachineプラグインをインポートする必要があります。これはStarter Assetsパッケージに含まれています）。

次に、ModelContainerの下に子コンポーネントを作成し、CameraRootと名前を付け、そのY座標を5（モデルの腰の高さ）に調整します。ModelCameraのFollowフィールドとLookAtフィールドの両方をCameraRootに割り当てます。これでカメラはモデルの動きに追従するようになります。

  1. キャラクターの移動を有効にする：

この時点では、トランスフォーマーはアイドルアニメーションを再生するはずですが、まだ制御できません。

CharacterController、PlayerInput、ThirdPersonController、BasicRigidBody、StarterAssetsInputsといったコンポーネントはUnityのStarterAssetsによって提供され、プレイヤー入力を処理します。Animatorコンポーネントはアニメーションを制御し、RuntimeHumanoidAvatarBuilderによって生成されたAvatarも自動的にAnimatorのAvatarフィールドに割り当てられます。

テストするには：

  • PlayerArmatureコンポーネントとそのカメラを無効にします。
  • Tripoで生成されたGLBモデル（リギング済み）を、ModelContainerの子コンポーネントとしてシーンにドラッグします。
  • 新しいモデルにRuntimeHumanoidAvatarBuilderコンポーネントを追加します。

これで実行中にトランスフォーマーを制御できるようになります。最後のステップは、コントロール切り替えのロジックを実装することです。

  1. コントロール切り替えの実装

GameLogicスクリプトのUpdate関数で以下のロジックを更新します。

  • isLoadはモデルが生成されたかどうかを示します。falseの場合、プロセスをスキップします。
  • isInModelはプレイヤーが現在トランスフォーマーを制御しているか、プレイヤーを制御しているかを示します。

トランスフォーマーに乗るとき：

  • プレイヤーとプレイヤーのカメラを無効にします。
  • Cinemachineプラグインが自動的にカメラビューを新しく作成したModelCameraに切り替えます。
  • ModelContainerをリセットして、移動ロジックがトランスフォーマーに有効になるようにします。

トランスフォーマーから降りるとき：

  • トランスフォーマーはその場に留めます。
  • プレイヤーキャラクターをトランスフォーマーの現在の位置に表示します。
  • 同時に、コントロールとカメラをプレイヤーに戻します。

上記のロジックが完了すると、Fキーを押すことでプレイヤーはトランスフォーマーに乗って制御できます。Fキーをもう一度押すとコントロールはプレイヤーに戻り、トランスフォーマーはその場に留まりますが、プレイヤーはトランスフォーマーの正確な位置に再び現れます。

最終調整

この時点で、デモは機能的に完成しています。体験をより洗練させたい場合は、以下のことができます。

  • プレイヤーがトランスフォーマーに近づいたときにUIプロンプト（例：「Fキーを押してモデルを操作」）を表示する。
  • 複数のトランスフォーマーが生成されたときに、そのうちの1つを選択できるようにする。

おめでとうございます！

お疲れ様でした！これでデモ全体が完成しました。自分のアイデアやアセットを使って、トランスフォーマーモデルを自由に生成し、操作できるようになりました。

ヘルプが必要ですか？

TripoGameで何か問題が発生したり、フィードバックがある場合は、公式メールアドレスまでお気軽にご連絡ください！tripogame@vastai3d.com。皆様からのご連絡をお待ちしております！

ヒント：

  1. このチュートリアルは、Tripo APIがリアルタイムゲームプレイでどのように使用できるかを示すために設計されています。ゲームデザイン自体は参照用です。開発者が遭遇する可能性のある問題を事前に解決したいと考えています。
  2. 現在、デモはリギング要件のため、ヒューマノイドモデルの生成のみをサポートしています。不安定なAI生成スケルトンウェイトのためにアニメーションが異常に見える場合は、Avatar Maskを使用して問題のある体の部分のアニメーションをブロックしてください。例えば、ソースファイルではNoArmPerson Controllerで手の動きが無効になっています。
  3. より高速な生成のために、TripoV2/TripoV1Turboを使用できます。TripoAPIスクリプト内のmodel_version番号「v2.5-20250123」を以下に置き換えるだけです。
    • v2.0-20240919
    • Turbo-v1.0-20250506 .
  4. FBXとGLBモデルでは向きが異なるため、インポート時に依存関係の問題が発生する可能性があります。FBXをインポートする必要がある場合は、TriLibなどのプラグインを使用してモデルをロードし、それに応じて調整を処理してください。
記事をシェア

3Dであらゆるものを生成

下のボタンをクリックして、数百万の3Dクリエイターに加わりましょう。超高精細なモデル生成と業界トップクラスのPBRテクスチャをお試しください。