gltf

こんにちは、カシカの奥です。 今回は、3Dコンテンツ配信における新しい業界標準として注目されている glTF（GL Transmission Format について詳しく解説します。WebGLを使った3Dアプリケーション開発や、AR/VRコンテンツ制作において、glTFの理解は必須となっています。 目次 glTFとは glTFの特徴 ファイル構造 JSONメタデータ バイナリデータ テクスチャファイル glTF 2.0の改良点 実装例 Three.js での読み込み Babylon.js での読み込み 拡張機能（Extensions） さらに高度な物理ベースレンダリングパラメータの対応 物理エンジンへの対応 3D Gaussian Splatsとの統合 まとめ glTFとは glTF（GL Transmission Format） は、Khronos Groupによって開発された3Dシーンとモデルの伝送フォーマットです。「3DのJPEG」とも呼ばれ、効率的な3Dコンテンツの配信を目的として設計されています。 2015年にバージョン1.0がリリースされ、現在はglTF 2.0が標準として広く採用されています。 主な設計目標 コンパクトなファイルサイズ: ネットワーク転送に最適化 高速な読み込み: 最小限の処理でGPUに送信可能 相互運用性: 異なるプラットフォーム間での一貫した表示 拡張性: 新機能を追加できる柔軟な仕組み glTFの特徴 1. 効率的なデータ構造 glTFは、従来のFBXやOBJといったフォーマットと比較して、以下の点で優位性を持ちます： ファイルサイズの削減： FBXフォーマットは独自のバイナリ形式で、メタデータが冗長になりがち OBJフォーマットは可読性は高いが、同じデータが重複して記述されることが多い glTFは階層的な参照システムにより重複データを排除し、同じメッシュを複数の場所で使用する場合でもデータは一度だけ保存 読み込み速度の向上： 従来フォーマットでは読み込み後にGPU用フォーマットへの変換処理が必要 glTFは頂点データがGPUバッファに直接コピー可能な形式で格納され、CPU処理時間を大幅に短縮 メモリ効率： 頂点データが配列形式で連続的に格納され、メモリ断片化を回避

こんにちは、エンジニアの有吉です。 今回は、弊社サービスであるカタチスペースと、今やすっかり子供たち間で定番の遊び場となったロブロックスを組み合わせれば、現実世界の物品を簡単に仮想空間に表示できる、という技術デモをご紹介します。 目次 ロブロックスとは カタチスペースとは セットアップ Roblox Studio のチュートリアル Roblox Studio のスクリプト Lua を動かしてみる モデルのインポート カタチスペース側の準備 Roblox × カタチスペース 結び ロブロックスとは ロブロックスは、今や世界中の子どもや若者にとって「遊ぶ場所」であり「作る場所」でもあるオンラインプラットフォームです。 ユーザーは自分でアバターを作り、他のユーザーが作ったワールド（ゲーム空間）を訪れたり、自分自身でオリジナルの体験を公開することもできます。 2020年代以降、特に10代を中心に急速にユーザー数が増え、日本でも小学生〜中高生の間で話題になる機会が増えてきました。 ゲームとして遊ぶだけでなく、アバターを着せ替えて友達と交流したり、写真を撮って共有したりと、SNS的な要素も含む使われ方が広がりつつあります。 カタチスペースとは カタチスペースは、現実の物品をそのまま3D・ARで再現できるサービスです。 たとえば「このソファはオフィスに収まるだろうか？」「この家電はキッチンに置ける？」といった不安を、説明書や写真ではなく、目の前に置いたかのような体験で解消することができます。 ユーザーは、スマートフォンなどを使って商品の3Dモデルをその場に表示し、サイズ感や質感を直感的に確認可能。 企業にとっては、ARを通じて購入前の確信を高める新しい接客手段として活用できます。 カタチスペースを活用し、３次元空間のロブロックスに商品を配置することができます。 セットアップ 実際にやってみます。まずは環境を整えます。 カタチスペースを App Store からインストールします（iOS環境）。 ロブロックスの開発環境である Roblox Studio をインストールします。 こちらはアカウント登録が必要です。 Roblox Studio のチュートリアル インストールして起動するとチュートリアルの案内があり、承諾すると簡単なチュートリアル用のシーンが作成されました。 内容は、3D オブジェクトの配置方法、移動、回転、拡大縮小、といったお馴染みのもの。 筆者は Unity を常用していることもあり、すんなり理解できました。 Unity でいうところの Hierarchy はエクスプローラーで、シーン上のオブジェクトはすべてここから参照できるようです エクスプローラーの下部にはプロパティウィンドウがあり、こちらは、Unity の Inspector に対応するものとなっています 試しにスケールを変更してみました モデルの用意さえできれば、ゲーム内に表示できそうです。 Roblox Studio のスクリプト Roblox では、ゲーム内のインタラクションやロジックを記述するために Lua（ルア） という軽量スクリプト言語が使われています。 lua は Unity にも組み込み可能なので、使ったことのある Unity エンジニアの方もいらっしゃるのではないでしょうか。