前置き

Siv3DにFBXモデルのアニメーション機能を実装する記事です。

2025年10月～11月に掛けて開催された、バンダイナムコスタジオさん主催のSiv3Dゲームジャムに参加しました。

Siv3Dには2D方面の表現方法として様々な機能が実装されていますが、3DモデルはWavefront.obj形式にのみ対応しています。そのため基本機能としてのアニメーション機能が実装されていません。
そこで今回のゲームジャムを機に、FBX形式への対応に加えアニメーション機能の実装を行いました。

準備

Assimpの入手
自前ビルドの用意
FBXモデルの用意

Assimpの入手

FBX形式の読み込みライブラリにはFBX SDKとAssimpが存在しますが、今回はAssimpを使用します。そのため事前にAssimpのインストールとパスを通しておきましょう。
Assimpを使用するためには自前でビルドする方法もありますが、今回は開発者の方が配布しているビルド済みのバイナリを使用します。

インストールを終えたらパスを通しておきましょう。今回は以下のように行いました。

自前ビルドの用意

Siv3D本体の改造が必須なため自前ビルドを用意しましょう。Siv3D開発者の方の記事を参考に行えば問題なく行えるでしょう。

FBXモデルの用意

使用したいFBXモデルを用意しましょう。例としてMixamoから入手したものを使用します。
https://www.mixamo.com/
今回入手するものは以下のモデルになります。

Capoeira
Taunt
Praying
Mutant Idole
Mutant Swiping

今回の実装ではテクスチャの埋め込みに対応しているため、Blenderなどで制作したモデルを使用したい場合はテクスチャの埋め込みを指定してから出力してください。

アニメーション時にはアニメーションを行わせたいモデルに対し、アニメーションを直接指定して行わせます。
よって読み込み時には、アニメーションを行わせたいモデル（以下バインドモデル）、バインドモデルとボーンを共通にしたアニメーションを持つモデル（以下アニムモデル）を用意します。この際、アニムモデルは複数あっても問題なく、アニムモデル自体が複数のアニメーションを所持していても問題ありません。

用意したモデルはプロジェクト内の任意のフォルダに置いておきましょう。今回はSiv3Dのサンプルでよく使用される、exampleフォルダ下にfbxフォルダを新たに作成し、その中に配置します。テクスチャを埋め込んでいる場合、読み込み時にモデルと同じフォルダ内にテクスチャファイルが作成されます。

Siv3Dの変更

元の構造を活かすため、いくつかのスクリプトを追加した後、アニメーションに対応するように適宜変更を加えます。
その前に、入手したAssimpのパスを自前モデルに通します。
自前モデルのソリューションを開くと"Siv3D"と"Siv3D-Test"の二つのプロジェクトがあるので、それぞれのプロパティを開き、以下のようにパスを通します。

Siv3D
C/C++
追加のインクルードディレクトリ：$(ASSIMP)\include;

Siv3D-Test
C/C++
追加のインクルードディレクトリ：$(ASSIMP)\include;
リンカー
追加のライブラリディレクトリ：$(ASSIMP)\lib;

なお自前モデルでビルドしたライブラリを新規・既存のプロジェクトで使用する際にはそのプロジェクト先でもパスを通す必要があります。

スクリプトの追加

では変更を加えていきましょう。以下のスクリプト群を追加します。
Githubリンク

AnimationHelper.cpp
AnimationHelper.h
AssimpHelper.h
MeshWrapper.cpp
MeshWapper.h
Skeleton.cpp
Skeleton.h
SkinnedVertex.h
stb_image_write.h

これらのスクリプト群は、自前ビルドの用意の際に入手したソースコードに配置します。
配置する箇所は"OpenSiv3D\Siv3D\include\Siv3D"です。
"OpenSiv3D\Siv3D\include\Siv3D"下にGithubのaddScriptsフォルダ毎移動してください。移動したスクリプト群は、ソリューションエクスプローラーのSiv3Dプロジェクトで“追加→既存の項目”からプロジェクトに追加してください。

この部分のボーン変形による頂点計算などは以下のことれいさんの記事を参考に、一部変更を加えました。

スクリプトの変更

Siv3Dの既存スクリプトの一部に変更を加えます。

変更を加えるのは以下のスクリプトです。
Githubリンク

include\Siv3D\MeshData.hpp
include\Siv3D\Model.hpp
include\Siv3D\ModelMeshPart.hpp

src\Siv3D\Model\CModel.cpp
src\Siv3D\Model\CModel.hpp
src\Siv3D\Model\IModel.hpp
src\Siv3D\Model\ModelData.cpp
src\Siv3D\Model\ModelData.hpp
src\Siv3D\Model\SivModel.cpp

src\Siv3D\ModelObject\SivModelObject.cpp

基本的にはMeshからDynamicMeshへの変更と、それに伴う変数の型変更からなるアクセス部分の変更、加えてモデルにアニメーション機能を追加するための新たな関数の追加が主になります。
変更後のスクリプトはGitHubに上げているので、該当部分を確認、変更してください。

テスト

これで恐らくアニメーション機能の対応が完了しました。自前ビルドのSiv3D-TestプロジェクトのMain.cppでテストしてみましょう。

Main.cpp


# include <Siv3D.hpp>
# include "Siv3D/AddScripts/AssimpHelper.h"

void Main()
{
	Window::Resize(1280, 720);
	const ColorF backgroundColor = ColorF{ 0.4, 0.6, 0.8 }.removeSRGBCurve();

	const Mesh groundPlane{ MeshData::OneSidedPlane(2000, { 400, 400 }) };
	const Texture groundTexture{ U"example/texture/ground.jpg", TextureDesc::MippedSRGB };

	RoundRect m_randButton{ Arg::center(1100, 50), 60, 60, 8 };

	// モデルデータをロード
	const Model blacksmithModel{ U"example/obj/blacksmith.obj" };
	const Model millModel{ U"example/obj/mill.obj" };
	const Model treeModel{ U"example/obj/tree.obj" };
	const Model pineModel{ U"example/obj/pine.obj" };
	const Model siv3dkunModel{ U"example/obj/siv3d-kun.obj" };

	const Model fbxModel{ U"example/fbx/Capoeira.fbx", ColorOption::Default, 0.01f };
	const Model animModel1{ U"example/fbx/Taunt.fbx", ColorOption::Default, 0.01f,true };
	const Model animModel2{ U"example/fbx/Praying.fbx", ColorOption::Default, 0.01f,true };
	const Model mutantModel{ U"example/fbx/Mutant Idle.fbx", ColorOption::Default, 0.01f };
	const Model mutAnimModel{ U"example/fbx/Mutant Swiping.fbx", ColorOption::Default, 0.01f,true };

	// モデルに付随するテクスチャをアセット管理に登録
	Model::RegisterDiffuseTextures(treeModel, TextureDesc::MippedSRGB);
	Model::RegisterDiffuseTextures(pineModel, TextureDesc::MippedSRGB);
	Model::RegisterDiffuseTextures(siv3dkunModel, TextureDesc::MippedSRGB);
	Model::RegisterDiffuseTextures(fbxModel, TextureDesc::MippedSRGB);
	Model::RegisterDiffuseTextures(mutantModel, TextureDesc::MippedSRGB);

	const MSRenderTexture renderTexture{ Scene::Size(), TextureFormat::R8G8B8A8_Unorm_SRGB, HasDepth::Yes };
	DebugCamera3D camera{ Graphics3D::GetRenderTargetSize(), 40_deg, Vec3{ 0, 3, -16 } };

	float curTime = 0;
	int animIdx = 0;

    // アニメーションを取得する。インデックスで指定。
	aiAnimation* anim1 = animModel1.getAnim(0);
	aiAnimation* anim2 = animModel2.getAnim(0);
	aiAnimation* mutIdleAnim = mutantModel.getAnim(0);
	aiAnimation* mutAnim = mutAnimModel.getAnim(0);

	while (System::Update())
	{
		camera.update(4.0);
		Graphics3D::SetCameraTransform(camera);

		// [3D シーンの描画]
		{
			const ScopedRenderTarget3D target{ renderTexture.clear(backgroundColor) };

			// [モデルの描画]
			{
				// 地面の描画
				groundPlane.draw(groundTexture);

				// 球の描画
				Sphere{ { 0, 1, 0 }, 1 }.draw(ColorF{ 0.75 }.removeSRGBCurve());

				// 鍛冶屋の描画
				blacksmithModel.draw(Vec3{ 8, 0, 4 });

				// 風車の描画
				millModel.draw(Vec3{ -8, 0, 4 });

				// 木の描画
				{
					const ScopedRenderStates3D renderStates{ BlendState::OpaqueAlphaToCoverage, RasterizerState::SolidCullNone };
					treeModel.draw(Vec3{ 16, 0, 4 });
					pineModel.draw(Vec3{ 16, 0, 0 });
				}

				// Siv3D くんの描画
				siv3dkunModel.draw(Vec3{ 2, 0, -2 }, Quaternion::RotateY(180_deg));
				fbxModel.draw(Vec3{ 5, 0, -2 });
				mutantModel.draw(Vec3{ -1, 0, -2 });
				curTime += Scene::DeltaTime();

				if (m_randButton.leftClicked())
				{
					//fbxModel.setAnim(anim1);
					//fbxModel.setBindPose(anim1);
					//fbxModel.setAnimIdx(0);
					fbxModel.setLoopAnim(anim1);
					//mutantModel.setOneShotAnim(mutAnim);
					mutantModel.setOneShotAnim(mutAnim, mutIdleAnim);
				}
				fbxModel.updateFbx(Scene::DeltaTime());
				mutantModel.updateFbx(Scene::DeltaTime());
			}
		}

		// [RenderTexture を 2D シーンに描画]
		{
			Graphics3D::Flush();
			renderTexture.resolve();
			Shader::LinearToScreen(renderTexture);
		}

		const Vec2 cursor = Cursor::PosF();
		m_randButton.draw(ColorF{ 1.0, 0.8 }).drawFrame(2);


	}
}

上記のスクリプトはSiv3D開発者の方のサンプルスクリプトを基にしています。obj形式とfbx形式が共存出来ている事が分かると思います。
画面の右上のボタンを押すとfbxモデルへのアニメーションが指定され、デフォルトと異なるアニメーションを行います。

新規、既存プロジェクトに使用する

自前モデルの変更をプロジェクトに適用するには「自前モデルの準備」で紹介した開発者の方の説明にあるように、SDKファイルを自前モデルのものに上書きしてください。
またinclude、srcフォルダに変更を加えている為、その部分も自前モデルのものに上書きしてください。

ゲームを他の人に遊んでもらう

ゲームジャムの際に指摘頂き気付けましたが、制作したゲームを他の方に遊んでもらう際、Assimpのdllが必要になるようです。

Discussion