VRM 0.x 実装

[yushimatenjin]

VRM 0.x 実装

このIssueはPlayCanvasにおけるVRM 0.xサポートの実装についてまとめます。

1 #2 の議論をもとに作成をしてみます。

実装項目

• [ ] GLBパース
  • [x] 基本的な.vrmファイルの読み込み（AssetRegistry.loadFromUrlで動作確認済み）
  • [x] GLB構造からVRM固有の拡張を抽出
• [x] シェーダー実装
  • [-] Unlitシェーダー
  • [-] MToon 0.xシェーダー
• [ ] Humanoidボーンマッピング
  • [ ] VRMからPlayCanvasへのボーンマッピングシステムの実装
• [ ] モーフ（ブレンドシェイプ）サポート
  • [ ] PlayCanvasの既存のモーフ機能（MorphInstance）の活用
• [ ] 一人称視点設定
• [ ] スプリングボーン
  • [ ] Verlet積分ベースの物理演算の実装
• [ ] モデル情報
  • [ ] VRM固有のメタデータ
• [ ] 座標系の調整
  • [ ] VRM 0.xモデルをPlayCanvasの座標系に合わせるための180度回転の実装

考慮事項

• VRM 1.0への対応は切り分けて作成
• PlayCanvasへの組み込み方法についても含めてVRM0.xの実装を元に作成をする

[yushimatenjin]

まだこちら作業中となりますが、MToonの実装についてPlayCanvasのアウトラインの実装について調査と実装を進めさせていただきました。今週末あたりにまとめて別のリポジトリにPushさせていただければと思います！

ビューワー: https://playcanvas-vrm-viewer-eta.vercel.app/viewer

---

マテリアルの実装について

マテリアルの実装ですが、Materialを拡張することで作成する事ができそうです。 下記のようにマテリアルを作成して利用ができそうです。

import MToonMaterial from "./mtoon-material";

const material = new MToonMaterial();
material.color = new Color(1, 0, 0, 1); // 赤色
material.shadeColor = new Color(0, 1, 0, 1); 

this.entity.render.material = material; // マテリアルをエンティティに設定

Particle Materialの実装を参考にすることができそうです。

シェーダーの実装について

three-vrm-materials-mtoonのリポジトリを参考にシェーダーの実装を進めることができそうです。

実装URL

MToonマテリアル: https://playcanvas-vrm-viewer-eta.vercel.app/feature-test

マテリアルごとのアウトラインの実装について

マテリアルごとに個別にアウトラインを生成をする場合には、MeshInstancesを作成時にアウトライン用のメッシュとアウトライン用のマテリアルを持つ、MeshInstanceを渡すことができそうです。

アウトライン: https://playcanvas-vrm-viewer-eta.vercel.app/outline