はじめに
Blenderで制作したアニメーション付きのモデルをGLB形式で書き出し、他のビュワー(Webや他のアプリケーション)上で再生する際に、モデルが意図しない表示やメッシュの破綻を起こすことがあります。
この記事では、「アニメーションが再生されるが、表示が崩れている」といった場合に考えられる原因の1つと、その対処方法について解説します。
なおアニメーション自体そもそも再生されない場合は、書き出し時に問題があるかもしれません。
その場合、以下のGLB書き出しについての記事が参考になるかもしれません。
アニメーションは再生されるものの、その表示がおかしい場合はそのまま以下をご覧ください。
原因
アニメーションの再生における問題は「フレームレートの差」によって発生する場合があります。
Blenderで設定したフレームレートと、再生するビュワーのフレームレートが異なると、アニメーションが意図した通りに再生されず、メッシュが破綻する原因となります。
特に、Blenderで低いフレームレート(例: 30fps)で作成したアニメーションが、60fpsや120fpsといった高フレームレート環境で再生されると、この現象が発生しやすくなります。
さらにこの現象が起こりやすいのは、アニメーションが1フレーム単位で大きく変化する場合です。
例えば、15フレームのアニメーションがあったとして、途中でオブジェクトを非表示にしたいなどと行った理由で7フレーム目まではスケールが(1,1,1)だけれども、8フレーム目から突然スケールを(0,0,0)にするといった、急激な変化があると、この現象が起こり得る可能性が高くなります。
フレームレート差がもたらす挙動の詳細
ではなぜこのようなことが起こるかと言うと、フレームレートが異なる環境でアニメーションを再生すると、フレームとフレームの「中間部分」が再生されることがあります。
例えば、Blenderで30fpsの環境で作成した場合、1フレーム間での変化に過ぎないものが、60fpsや120fpsの環境ではその変化を細かく再現しようとし、中間フレームが生成されます。

このアニメーションとして意図していない部分を再生しようと計算が行われた結果、意図しない表現になってしまったり、メッシュが破綻して表示されることがありえます。

ただ一部のソフトウェアでは、異なるフレームレートで再生しても意図通りの動作をする仕組みが組み込まれています。例えばUnityでは、30fpsで作成されたアニメーションは、60fpsでプレビューしても30fpsの動きを再現し、中間フレームが発生しません。
しかし、Web上のGLBビュワーなど、フレームレート調整の仕組みがないビュワーでは、30fpsで作成されたアニメーションを120fpsなど高いフレームレートで再生してしまいます。同じ1秒だとしても描画される回数が異なってしまうことから、こうした現象が発生する可能性があります。
対処方法
この問題への対処方法は以下の2つです。
- 高フレームレートでアニメーションを作成する
30fpsではなく、60fpsなど高フレームレートでアニメーションを作成することで、中間フレームの生成を抑えられます。
ただし、この方法は作業量とデータ量が増加するため、制作環境や用途に余裕がある場合に限られます。 - キーフレームのベイクと補間の設定
すべてのキーフレームを「ベイク」して、補間をステップ(一定)にする方法です。
この設定により、次のキーフレームまでアニメーションの値が変化しないため、中間フレームが生成されず、意図した動作を再現しやすくなります。ただし、非常に高フレームレートの環境では、アニメーションがカクつく場合もあるため、その場合は60fpsでのアニメーション制作を検討するのも良いでしょう。
GLB形式でなければならない環境で、ここまで高フレームレートが必要になるケースは少ないと考えられますが、特定の環境で問題が生じた場合には有効な対策です。
おわりに
GLB形式のアニメーションを他の環境で再生する際、フレームレートの差異がメッシュの破綻を引き起こす原因となり得ます。ここで紹介した方法で対処すれば、再生環境による表示崩れを防げる可能性が高まります。該当する問題がある場合は、ぜひお試しください。
コメント