3D モデルビューアとは?

3Dモデルビューアは、GLB、GLTF、FBX、OBJ、STL、PLY、3MF ファイルをお使いのデバイスで直接開けます。回転、ズーム、パンであらゆる角度からモデルを確認できます。テクスチャ・ワイヤーフレーム・クレイ・法線・X線の各表示を切り替え、全画面に広げ、ライティングの調整や背景色の変更も可能です。アップロードは一切不要です。

ビューアは Three.js と OrbitControls で動きます。ドラッグでカメラがオービット、2 本指ドラッグでパン、ホイールでズーム。モデルを読み込むと頂点数・三角形数・面数・ドローコール数・マテリアル数が表示されます。表示モードのボタンで、テクスチャ、ワイヤーフレーム(トポロジー確認)、クレイ(テクスチャなしのグレーで形状を確認)、法線(面の向きを確認)、X線(半透明で内部の隠れた形状を確認)を切り替え、ビューを全画面に広げて近くで確認し、ディレクショナルライトの強度を調整し、背景を濃いグレーや任意の HEX に変更してレビュー用のスクリーンショットが撮れます。

使い方

  1. ドラッグするかブラウズして 3D モデルファイル(.glb、.gltf、.fbx、.obj、.stl、.ply、.3mf)をアップロードします
  2. マウスまたはタッチでモデルを回転、ズーム、パンします
  3. テクスチャ・ワイヤーフレーム・クレイ・法線・X線の表示モードを切り替えたり、全画面に広げたり、ライティングを調整したり、背景色を変更したりして確認します

使用するタイミング

  • 3D アーティストがテクスチャリングに何時間も使う前に GLB/GLTF を確認する。
  • Blender からエクスポートした OBJ の形状が想定通りか手早くチェックする。
  • クライアントに Blender や Maya、Unity を入れさせずにスマホでアセットを見せる。

結果

デザイナーから製品プロトタイプのGLBファイルが届いてレビューする必要がある場合。ファイルをアップロードし、モデルを回転させてすべての角度を確認して、ワイヤーフレームに切り替えてジオメトリを検査し、フィードバックを共有するためのスクリーンショットを撮ります。

よくある質問

対応している 3D ファイル形式は?
GLB と GLTF、FBX、OBJ、STL、PLY、3MF です。GLB・GLTF・FBX は素材、テクスチャ、アニメーションを 1 つにまとめます。OBJ はジオメトリ専用で、MTL が付属していても色やテクスチャはここでは読み込みません。STL と PLY(3D スキャナーやプリンターでよく使われます)はジオメトリのみのため、テクスチャなしのグレーで表示されます。PLY に頂点カラーがあれば保持します。
モデルが真っ黒、または見えないのはなぜ?
スケールがカメラのフラスタムから大きく外れているか、モデルにライトが入っていないかです。「カメラをリセット」で再フィットさせ、ライト強度のスライダーを上げてください。全て真っ黒のときはテクスチャ参照が見つかっていないケースが多いです。
頂点数と面数の数字は何を意味しますか?
頂点はメッシュの角、面(=三角形)はそれらを結ぶポリゴンで、ドローコール数はおおよそ別々のメッシュの数に相当します。少ないほど描画は軽くなります。ゲーム用の小物はだいたい 5 万トライアングル以下、キャラクターは 20 万以下です。小物が百万単位なら、まずデシメート前のハイポリ彫刻です。
スケルタルアニメーションがあれば再生してくれますか?
はい。GLTF や GLB に埋め込まれたアニメーションクリップは再生パネルに自動で読み込まれ、最初のクリップが自動で再生されます。プルダウンから歩行・アイドル・アーティストが書き出したどのクリップにも切り替えでき、一時停止や再開もすぐにできます。静止モデルの場合はパネルが非表示になり、画面がすっきり保たれます。
現在の表示をスナップショットとして保存できますか?
できます。「スクリーンショット」ボタンが現在のカメラ角度をキャンバス解像度の PNG で書き出します。先に背景・照明・回転を整えてからクリックすれば、クライアントが見るのと同じ画像が出てくるので、そのままレビュー用メールに添付できます。

関連ツール