glTFビューワー 2.0をリリース！

glTF（またはGraphics Language Transmission Format）は、2015年の登場以降にユビキタスな存在となりました。
高度なシェーディング技術のサポートにより、製品コンフィギュレーターやビジュアライザーのようなグラフィックスを多用するアプリケーションでは特に重要な存在となっています。 

現在、グラフィックデータをウェブ上で転送する際に、多くの企業がglTFに依存しているため、このフォーマットを扱う高品質なツールの提供は非常に重要です。
このような背景から、弊社は人気のあるglTFビューワーについて、v2.0を開発しました。

それでは、glTFビューワー 2.0の新機能を詳しく見ていきましょう。

glTF仕様のサポートを改善

glTFフォーマットは、Khronos Groupによって管理されており、基本仕様のほか多数の拡張機能が定義されています。

glTFビューワー 1.0は基本仕様を完全にサポートし、以下の拡張機能をサポートしています：

• KHR_draco_mesh_compression
• KHR_lights_punctual
• KHR_materials_clearcoat
• KHR_materials_unlit
• KHR_mesh_quantization
• KHR_texture_basisu
• KHR_texture_transform

本日リリースされた、新しいglTFビューワー 2.0では、以下へのサポートが追加されました：

• KHR_materials_emissive_strength
• KHR_materials_ior
• KHR_materials_sheen
• KHR_materials_specular
• KHR_materials_transmission
• KHR_materials_variants
• KHR_materials_volume

これらの拡張機能を使用して、開発者は斬新なグラフィック効果を実現できます。

以下では、このうち3つのグラフィック効果について詳細に説明します。

高度な屈折

Volume、Transmission、IORの各glTF拡張機能を使用すると、光が透明なマテリアルでどのように屈折するかをシミュレーションできます。

ここでは、PlayCanvasのgrab pass機能が使用され、バックバッファを「つかんで」サンプリングしています。

リアルなファブリックレンダリング

glTFの光沢拡張機能では、特定のファブリック外観を持つマテリアルを忠実に再現できるようになります。
この機能は、製品ビジュアライゼーションで非常に重要です。（家庭用家具、アパレル、自動車の内装など）

マテリアル変種

ほとんどの製品コンフィギュレーターでは、ユーザーが製品の外観を変更することができます。
たとえば、椅子に様々な色の生地が張られている場合があります。または、靴に多様なデザイン、柄、色が用意されている場合もあります。

新しいPlayCanvas ビューワーでは、読み込まれたシーン内のマテリアルのバリエーションを検出し、インターフェースで選択できるようになりました。

レンダリングを強化

新しいビューワーではレンダリングの忠実度について、いくつかの興味深い機能が導入されています。 

まず、「高品質レンダリング」モードです。（カメラコントロールパネルのトグルで切り替え可能） 

この機能では、ギザギザのエッジをポリゴンに沿って排除することを目的としたアンチエイリアスの一種である、スーパーサンプリングが有効になります。
カメラが停止したときにシーンを何度も再レンダリングし、わずかにオフセットして、以前のフレーム上にレンダリング画像が合成されます。

以下の動画でこれらを確認できます。効果を分かりやすくするため、意図的に解像度を下げています。

また、滑らかな反射面をよりシャープに反射させる機能も、新たに追加されました。
ビューワーは、エンジンの画像ベースのライティングパイプラインでフル解像度のskyboxキューブマップを使用するようになったため、鮮明ではるかにリアルな外観になりました。

インターフェースの再設計

これまで、ビューワーのすべての情報やコントロールは、左端のパネルに表示されていました。
ビューワー 2.0では、特定の機能エリアを効率的にグループ化するため、インターフェースが完全に再設計されました。

左端のパネルは残りますが、シーン情報や、読み込まれたシーン階層を示すツリービューのみが表示されます。

3Dビューの下部に、ビューワーの設定をコントロールするためのボタンが表示されるようになりました。

これらのボタンは、カメラ、ライティング、デバッグレンダリングのオプションを開きます。（全画面表示への切り替えも可能です）

アニメーションを含むシーンを読み込んだ場合には、自動的にアニメーションコントロールが表示されます：

このコントロールでは、アニメーションのスクラブ再生、再生速度の選択が可能で、さらに複数のアニメーションクリップが含まれる場合は、再生するクリップを選択することもできます。

最後に、3DビューのレンダリングPNGをダウンロードするボタンが右下に追加されました。

オープンソース

PlayCanvasはオープンソース化を全面的に推進しているため、glTFビューワーはGitHubで公開されています。
これは、PlayCanvas PCUIフロントエンドフレームワークとPlayCanvasエンジンランタイムをベースに構築されたTypeScriptアプリケーションです。

これらのオープンソースプロジェクトは、何年もかけて作られたもので、すばらしいOSSコミュニティなしには実現できませんでした。

ぜひ、PlayCanvasのGitHubの多様なリポジトリを参照いただき、ご自分のプロジェクトの公開をご検討いただけると幸いです。
また、機能リクエストやバグレポートもお気軽にお寄せください。お待ちしています！

改善された新しいglTFビューワーを、ぜひご活用ください。
数ヶ月後にさらにアップデートをお知らせしますので、どうぞお楽しみに！

Steven Yau