3D製品モデルのファイルサイズ：スマホで表示できる重さ

3D製品モデルのファイルサイズが5MBを超えると、買い手がスマートフォンで開く商品ページにはもう重すぎます。ミドルレンジのAndroid端末と一般的なモバイル回線で耐えられる重さは2MB前後です。理由は好みではなく算数で、5Mbpsなら1MBにつき1.6秒待ってから、ようやくビューアが最初のフレームを描画できます。

この前提が変わると議論の性質も変わります。多くのサプライヤーは3Dモデルを販促素材として扱い、ファイルサイズを3Dスタジオ側の問題と考えます。しかし買い手にとっては、ページを開いた瞬間に最初にダウンロードされるものです。ここでは重量の予算表、バイト数が実際に消える4か所、そして見積メールに3Dリンクを貼る前に実行する6つの確認を整理します。

3D製品モデルのファイルサイズ早見表：スマホが最初にダウンロードするもの

ダウンロード時間は「ファイルサイズ × 8 ÷ 回線速度」で決まります。描画も回転も最初のフレームも、この式には入っていません。下表は回線が安定している前提で、TLSハンドシェイクや往復遅延は含めていません。実際のスマートフォンはもっと遅くなります。

モデルサイズ	10 Mbps	5 Mbps	1.6 Mbps	待っている間に買い手がすること
2 MB	1.6秒	3.2秒	10秒	モデルを回し、仕様を1行読む
5 MB	4秒	8秒	25秒	スクロールして離れる、または静止画をタップ
10 MB	8秒	16秒	50秒	ページが壊れていると判断する
20 MB	16秒	32秒	100秒	タブを閉じる
50 MB	40秒	80秒	250秒	モデルにたどり着かない

50MBの行をもう一度見てください。オフィスの良好な回線でも13秒、倉庫や展示場、ホテルの弱いモバイル回線では4分以上かかります。これだけ大きいモデルは販促素材ではなく、買い手が同意していないファイル転送です。

3D製品モデルは、買い手が製品全体をダウンロードし終えるまで、製品のどの部分も見られない唯一の商品素材です。 写真は上から順に表示でき、動画は数秒のバッファで再生が始まります。GLBは始まりません。

なぜモデル全体が先に届く必要があるのか

glTF 2.0の仕様は、これがストリーミング形式ではないと明記しています。バイナリデータ自体はストリーミング可能ですが、glTFはストリーミングの構造を定義していません。ビューアは資産を読み込み、解析し、それから描画します。「製品らしく見える途中の状態」は存在しません。

コンテナの選択も影響します。GLBはJSONのシーン記述とバイナリバッファを1ファイルにまとめ、base64の膨張もありません。1リクエストで効率的な代わりに、買い手はパッケージ全体を待ちます。.gltf と .bin、個別テクスチャに分ければ部分的に取得して早く描画を始められますが、リクエストが増え、壊れる箇所も増えます。単一SKUの製品カードならGLB1つが正解、60SKUのシリーズなら共通アセットを分割した方が総重量は小さくなることが多いです。

こうした事情はパフォーマンスレポートの画像欄には現れないため、見落とされます。商品ページのLCP要素は通常、メインビジュアルかテキストブロックで、WebGLキャンバスではありません。Googleの基準は75パーセンタイルでLCP 2.5秒以下です。ビューアのJavaScriptとモデルのダウンロードがメインビジュアルと帯域を奪い合えば、ページはこの基準を外れます。一方で3Dチームは「モデルは正常に描画されている」と報告します。

ページの残りはすでにどれだけ重いのか

Web Almanacが引用する2024年のHTTP Archiveデータでは、デスクトップページの中央値が2,312KB、モバイルページが2,037KBです。モバイルでは画像だけで中央値の約900KBを占めます。

モデルを並べてみます。

資産	一般的な重量	モバイルページ中央値（2,037KB）との比較
モバイルページ全体	約2MB	1倍
2MBのGLB	2MB	ページが2倍
5MBのGLB	5MB	ページ全体の2.5倍
20MBのGLB	20MB	ページ全体の10倍

これが予算の決め方です。3Dビューは、ギャラリー、仕様表、レビュー、計測スクリプト、テーマが同居するページの1要素にすぎません。モデル単体がページ中央値より大きければ、モデルがページそのものになり、買い手は秒単位で代金を払わされます。

天候、展示会場のWi-Fi、端末もこれを増幅します。3年前のミドルレンジ端末は、承認時に使ったノートPCより4096ピクセルのテクスチャ解釈が遅いです。スタジオのモニターではなく、スマートフォンで確認してください。

バイト数はどこに消えるか、どの圧縮がどこを直すか

3D製品モデルのファイルサイズは3か所に集中します。多い順にテクスチャ、ジオメトリ、その他（アニメーション、カメラ、不要なノード）です。意外に思われますが、ジオメトリが主因でないことも多いです。写真から生成したモデルに4096×4096のPNGテクスチャを1枚貼るだけで、包んでいるメッシュより重くなることがあります。

部分	何が膨らませるか	実際に減らす方法
テクスチャ	4096pxのPNG、使っていない法線・ラフネスマップ、埋め込まれたカラープロファイル	ビューアの表示サイズに合わせた小さい画像、JPEGまたはKTX2、マテリアルが使わないマップの削除
ジオメトリ	スキャンや細分化で数百万ポリゴンになったメッシュ、重複パーツ	見えるディテールまでの減面、重複パーツのインスタンス化、Dracoによるジオメトリ圧縮
その他	誰も再生しないアニメーション、非表示ノード、カメラ、ライト	ビューアに不要なものを削除。製品のターンテーブルに必要なカメラは1台

圧縮の中心はKhronosが批准した2つの拡張で、それぞれ別の問題を解きます。KHR_draco_mesh_compression は生の頂点データの代わりに圧縮したジオメトリを流します。KHR_texture_basisu はKTX2とBasis Universalの超圧縮でテクスチャを保存し、転送量とGPUメモリの両方を下げます。

どちらも拡張であり、glTFの基本機能ではありません。ビューアが対応している必要があり、非圧縮のフォールバックがない場合は extensionsRequired に宣言しなければなりません。送る前に、買い手が実際に使うビューアで開いてください。製品カード、自社サイト、マーケットプレイスの3D枠です。Blenderで開けることは、スマートフォンのブラウザで問題ない証明にはなりません。

3D製品ビューのリンクを送る前の6つの確認

順番に実行してください。最初の2つで多くの損害を防げ、残り4つでサポートメールになる失敗を防げます。

ファイルはWeb向けに書き出した単一の .glb で、テクスチャが散らばった .blend / .step / .obj ではない
その .glb が、買い手の実際の回線に対応する重量予算に収まっている
先に静止画を読み込み、買い手がタップするかスクロールして到達してからビューアを起動する
1本指で回転、ピンチでズームでき、モデルが跳ねたり端を越えて回り込んだりしない
シルエット、部品数、金物が製品と寸法図に一致したままである
WebGLが使えない、または企業ポリシーで制限された買い手にも写真と仕様表が届く

確認1：Web書き出しであり、作業ファイルではない

.blend や .step は制作ドキュメントで、履歴、カメラ、マテリアルを含み、時には誰かのノートPCのフォルダにあるテクスチャを参照します。WebのコンテナはGLBで、シーンには製品1つ、カメラ1台、ビューアが読めるマテリアルだけを入れます。書き出しダイアログで「モディファイアを適用」「非表示オブジェクトを含める」と聞かれたら、前者は「はい」、後者は「いいえ」です。

モデルの元写真も同じくらい重要です。角度や光の違う素材を混ぜて作ったモデルは、買い手が回した瞬間に継ぎ目が見えます。写真セットの不揃いが商品ページを壊すのと同じ理屈です。写真セットがまだ揃っていないなら、書き出しの前に3D製品ビューに必要な写真から始めてください。

確認2：重量は買い手の回線に合わせる

書き出したファイルを開き、MB単位の3D製品モデルのファイルサイズを読んで上の表と比べます。必ず書き出しファイルで確認し、元のプロジェクトは見ません。40MBの作業ファイルが3MBで書き出ることも、3MBの作業ファイルがテクスチャ同梱で30MBになることもあります。

予算超過なら最大の部分から直します。4096ピクセルのPNG4枚を1024ピクセルのJPEG1〜2枚に置き換える方が、ジオメトリを触るより効果が大きいのが普通です。DracoとKTX2はその後に使います。妥当な資産を小さくするのが役割で、不当に重い資産を許容範囲に変える道具ではありません。

確認3：最初のフレームはポスター画像で、空白のキャンバスではない

ビューアを遅延読み込みし、買い手が操作するまで静止画（できればモデルの初期角度と同じ構図）を表示します。3Dキャンバスがクリティカルパスから外れ、ページには本物のLCP候補が残ります。

次に失敗しやすいのがインタラクションです。GoogleのInteraction to Next Paintは75パーセンタイルで200ミリ秒以下が良好、500ミリ秒超が不良です。重いモデルに物理演算とシャドウパスが加わると、ページの読み込みが速くても、ミドルレンジ端末ではタップから回転までがこの線を超えます。

確認4：親指1本で回せる

片手でスマートフォンを持ち、親指でモデルを回します。2本指が必要、指を離すとモデルが勝手に流れる、ズームで回転中心がずれる——どれか起きれば、買い手は製品ではなくビューアと格闘します。

端も確認します。上面、底面、背面です。回転を±45度で止めるビューアは、買い手が最も見たい面、つまり撮影スタジオが決して撮らない面を隠しています。

確認5：形状が製品と一致している

モデルを実物と寸法図に対して回し、シルエット、金物、継ぎ目、板材の端の厚みを見ます。さらに買い手が確認する箇所、ヒンジ、脚、取っ手、モールディングの断面を見ます。

写真から3Dへの変換はプレゼンテーションの工程で、測定の工程ではありません。モデルは曲線を滑らかにしてよいですが、取っ手を新しく生やしたり、継ぎ目を消したり、図面に書かれた比率を変えたりしてはいけません。モデルと図面が食い違ったら図面が優先で、モデルを作り直します。

ここは2種類の成果物が互いに誠実でなければならない点でもあります。回転するモデルは形状と部品の接し方を伝え、寸法を入れた図は数字を伝えます。測った寸法を写真に固定し、同じ素材から回転モデルを生成するソフトウェアなら、この2つの見え方がずれません。寸法は注記の上に残り、買い手が読めます。レンダリングの中に埋もれて、誰も測れなくなることはありません。

確認6：見られない買い手にも逃げ道がある

企業のノートPCはWebGLを無効にし、ブラウザによっては既定でオフです。古い端末は大きなテクスチャでメモリ不足になります。どの場合でも、買い手は静止画、仕様表、問い合わせボタンに到達できるべきです。

フォールバックは計画ではなくページに書きます。WebGLが使えないときに回り続ける灰色の箱を出すのは、ビューアがないより悪いです。買い手は製品ページが壊れていると判断します。

3Dビューが証明できること、できないこと

3D製品ビューはプレゼンテーション資産です。形状、比率、部品の関係を伝えるもので、測定記録ではありません。画面上の見た目の大きさはカメラ、画角、買い手の画面で変わるため、買い手が寸法を読み取ることはできず、サプライヤーもできると示唆すべきではありません。

この一文はページに直接書く価値があります。「寸法は実測値、3Dビューは形状のみ」と明記すれば、この工程で最も高くつく誤解を防げます。買い手がモデルを寸法入り図面だと信じ、それに合わせて発注する事故です。

買い手の疑問	答えるもの	答えないもの
「幅はちょうど1200mm？」	写真に寸法を入れた仕様図	どれほど精細な3Dレンダリングでも不可
「背面はどうなっている？」	3Dビュー、または背面の写真セット	前面だけのギャラリー
「家のドアを通る？」	ドア幅と最小の梱包寸法	画面上で自由に拡大できるモデル
「脚はどう固定する？」	分解図、または脚を分離した3Dビュー	美しいイメージカット1枚

3Dがその重量に値しないとき

3Dはすべての買い手の疑問への既定の答えではありません。あらゆる形式を1ページに載せると、正しい1つだけを載せるより遅くなります。次の判断基準を使ってください。

買い手の本当の疑問	より軽くて足りる資産	3Dを使う条件
「横から見るとどう？」	360度の写真シーケンス、または4方向の写真セット	コマ送りではなく自由に回したい場合
「どのくらいの大きさ？」	写真に寸法を入れた仕様図	決して使わない。3Dでは答えられない
「どう分解する？」	引き出し番号付きの分解図	組立手順そのものが訴求点の場合
「仕上げは合っている？」	同じ照明で撮ったマクロ写真	決して使わない。テクスチャは色の証明ではない

「どの形式を送るか」だけが問題なら、実際の選択は3Dビューと写真シーケンスの間で、3Dか何も送らないかではありません。判断材料はファイル重量、インタラクション、買い手に必要な操作の自由度です。3D製品ビューアと360度写真の比較でこの区分を詳しく扱っています。

3Dが場所を得る価値があるなら、見える位置に置きます。寸法と並べて開く3D製品ビューを、買い手が社内に転送する製品カードに入れる方が、カタログの3クリック奥に隠れたビューアより役に立ちます。

よくある質問

ウェブサイトの3D製品モデルはどのくらいのサイズにすべきですか？

5MB以下、スマートフォンで開かれる可能性が高いなら2MB以下です。上限は好みではなく算数から来ます。5Mbpsでは5MBのモデルが最初のフレームまで8秒かかり、ビューアのJavaScriptの実行時間はまだ含まれていません。元のプロジェクトではなく、書き出したGLBで確認してください。

3Dモデルは商品ページを遅くしますか？

はい、通常2か所で遅くします。ダウンロードがメインビジュアルと帯域を奪い、Largest Contentful PaintをGoogleの2.5秒という良好ラインの先へ押し出します。さらにビューアのJavaScriptがメインスレッドを奪い、インタラクション遅延をINPの200ミリ秒の線へ近づけます。プレースホルダーではなく、モデルを実際に載せた状態でPageSpeed Insightsを計測してください。

GLBとglTFの違いは何ですか？

GLBはバイナリコンテナ、glTFは形式です。.gltf はJSONで、別の .bin と画像ファイルを参照します。.glb はJSONとバイナリバッファを1ファイルにまとめ、base64を使わないため、1リクエストで済み、同等のJSON埋め込みよりわずかに小さくなります。どちらもglTF 2.0で、準拠したビューアで読み込めます。

形状を崩さずに3Dモデルのファイルサイズを減らせますか？

はい、3手順です。マテリアルが使わないテクスチャを削除し、ビューアが実際に表示できるディテールまでジオメトリを減らし、ジオメトリにDraco、テクスチャにKTX2/Basisを適用します。各段階の後にシルエットと部品数を再確認してください。最も安価な改善はほぼ常にテクスチャで、最も高くつく誤りは曲面を削りすぎて図面と輪郭が合わなくなることです。

買い手は3Dビューから製品の寸法を測れますか？

いいえ。3Dビューは形状と比率を示しますが、寸法を保証できません。見た目の大きさはカメラ、画角、画面に依存します。数字が必要な買い手は、寸法を入れた仕様図や寸法図を見るべきです。寸法は製品に紐づけるもので、レンダリングから推測するものではありません。