©2015 INNOVERSE LLC.

WebGLを用いた3D画像の Web配信技術について

～ネット住宅展示場などの事例を用いて～

©2015 INNOVERSE LLC.

■ テレビせとうちでは、昨年７月にネット住宅展示場

「ななちゃんLAND」をオープン

■ 「ななちゃんLAND」ではWebGLの仕組みを利用して

住宅の３次元CGでモデリングしたデータを配信

■ 建物の中に入って自由に見ることができ、

様々な角度から骨組みを見ることも可能

©2015 INNOVERSE LLC.

３D・ＣＧネット住宅展示場「ななちゃんＬＡＮＤ」

©2015 INNOVERSE LLC.

見えてきた課題■ 表示できるブラウザが限定される

⇒Internet ExplorerはVer.11からWebGLに対応しかし、表示できない建物もでてきたり、動きがぎこちなかったりと問題が多いため、早くからWebGLに対応しているGoogle Chromeを推奨

■ スマホ・タブレットでは表示できない⇒処理能力不足・・・代わりに動画を表示

■ ３Dデータが大きく、配信に時間がかかる⇒表示されるまでに時間かかり　ユーザにとっては不快

■ ３Dデータは、ユーザの端末にデータが残る⇒製作者の著作権を保護できない

©2015 INNOVERSE LLC.

■ 設立　２０１４年７月

■ ３Dを基軸とした各種 デジタルテクノロジーと アイデアを掛け合わせた 新しいビジネスを創出 することを目的とする 岡山のITベンチャー

■ SE / 建築士 / プランナーという

異色のユニット

INNOVERSE LLC.合同会社イノバース

©2015 INNOVERSE LLC.

各種提供サービスの基本的な仕組み

３Dモデルの制作

Webブラウザ表示

©2015 INNOVERSE LLC.

一般的な３Ｄモデル制作方法

３ＤＣＧソフト

３Dスキャナー

フォトグラメトリー

©2015 INNOVERSE LLC.

対象物の全周囲を写真撮影し、ソフトに写真データを 読み込みます。

フォトグラメトリーによる３Ｄモデル制作

©2015 INNOVERSE LLC.

ソフトで撮影位置を解析後、モデルを作成します。また他のソフトへデータを渡し、高解像度化・リファインなどを行ってデータの完成です。

フォトグラメトリーによる３Ｄモデル制作

©2015 INNOVERSE LLC.

３ＤモデルのWEBブラウザ表示３ＤモデルデータをWEBブラウザの3DCG表示仕様である「WebGL」を用いて、ブラウザ上で３Ｄ表示します。

サーバー

WEB AP3Dモデルファイル

クライアント

ブラウザWebGLダウンロード

GPU

OS

OpenGL / OpenGL ES

アクセス

©2015 INNOVERSE LLC.

３ＤモデルのWEBブラウザ表示３ＤモデルデータをWEBブラウザの3DCG表示仕様である「WebGL」を用いて、ブラウザ上で３Ｄ表示します。

©2015 INNOVERSE LLC.

PC環境

OS（Windows） Vista、 7、 8、 8.1

OS（Macintosh） Mac OS X 10.9

ブラウザ Internet Explorer 11、Chrome、Firefox、Safari 6、7（Macのみ）

CPU Intel Core2 Duo E6600以上

メモリ 2GB以上（グラフィックメモリ512MB以上）

スマホ・タブレット環境OS iOS 8、 Android4.0　以上対応機種例 iPhone 4S、GALAXY S II　以上ブラウザ Google Chrome for Android、Firefox for Mobile、Safari 8（iOS8向け）

動作環境

ISEE3での非対応環境への対応方法

　ブラウザのバージョンが非対応の場合　　水平方向３６０°の写真画像表示形式に切り替え表示をすることで対応している。

©2015 INNOVERSE LLC.

1. 3Dモデルデータはサイズ（ポリゴン）が⼤大きく、   　 　  Web配信および表⽰示処理理で負荷が⾼高いため、   　 　  パフォーマンスが悪い。

2. 3Dモデルはクライアント側（テンポラリ）に   　 　 　ダウンロードされ、データが残ってしまうため、   　 　 　セキュリティー上の懸念念がある。

現状の問題点

©2015 INNOVERSE LLC.

3Dソフト（ZBrush等）の機能により、  低ポリゴン化処理理（デシメーション）をしている。

問題点「１」への現状の対応と課題

ただ、WEB配信での快適性を維持するまで  低ポリゴン化（１万ポリゴン程度度）すると、  

画質が⼤大きく低下する。

※約１００万ポリゴンを５万ポリゴン程度まで縮減 ファイルサイズは約５MB程度

©2015 INNOVERSE LLC.

■ 暗号化ファイルのデータ配信（現⾏行行）

サーバー

暗号化済み ファイル

クライアント

テンポラリ領域暗号化済みファイル

ダウンロードファイルの中身

ダウンロードのみで サーバ負荷は低い

暗号化による セキュリティ確保

テンポラリ領域に保存されてしまう

復号化処理が ボトルネック

問題点「２」への現状の対応と課題

©2015 INNOVERSE LLC.

サーバー

ファイル

ファイルの中身

クライアント

テンポラリ領域REST結果 ファイルの中身

■ ＲＥＳＴによるデータ配信（対応案）

問題点「２」への現状の対応と課題

テンポラリには 保存されない

複合化処理が 不要

隠蔽性が低い

サーバーに 負荷が集中

©2015 INNOVERSE LLC.

■ 新たな低ポリゴン化処理理の確⽴立立

■ REST形式のセキュリティを確保する⽅方式の確⽴立立

今後の研究課題

⾒見見た⽬目の画質を保ったまま、  3Dモデルデータをコンパクト化するとともに、 セキュリティー性⾼高く、レスポンスを改善する。

■ ファイルオープンの負荷軽減・分散⽅方法の確⽴立立

©2015 INNOVERSE LLC.

Thank youご静聴ありがとうございました。