電通総研 テックブログ

電通総研が運営する技術ブログ

フォトグラメトリ×Mesh to Metahumanで人物そっくりな3Dキャラクターを作成してみた(後編)

みなさんこんにちは! 電通総研 金融ソリューション事業部の松崎です。
前回の記事では、Mesh to Metahumanの元となるメッシュを作成する手順を紹介しました。
この記事は後編になりまして、前編で準備したメッシュを用いてMetahumanを作成していく手順を紹介します。
もしまだご覧になっていない方は、是非前編からご覧ください!

目次

  • 使用機材紹介
  • 撮影方法
  • 1.頭部メッシュ&テクスチャ作成(フォトグラメトリ)
  • 2.頭部メッシュのリトポロジー(3Dメッシュ編集)
  • 3.Metahumanの作成と編集(Mesh to Metahuman)
  • 4.Metahumanにフォトグラメトリテクスチャを合成(3Dテクスチャマッピング

後編では3,4章をご紹介します。

3.Metahumanの作成と編集(Mesh to Metahuman)

2.にて作成したメッシュを用いて、Metahumanの作成を行います。

Metahumanの作成には、UnrealEngine5(以下、UE5)を使用します。
もしまだUE5をインストールしていない場合は、こちらのサイトの案内に沿ってインストールしましょう。

UE5のインストールが完了しましたら、UE5にMetahumanプラグインをインストールします。
Epic Games Launcherを開き、マーケットプライスタブで「Metahuman」と検索すると出てきますので、そちらをインストールしましょう。

UE5にて、インストールしたMetahumanプラグインを有効化します。
UE5を起動し、適当なBlankプロジェクトを作成します。

UE5プロジェクトが開きましたら、「編集 → プラグイン」でプラグインブラウザタブを開きます。

Metahumanプラグインを選択し、チェックを入れて有効化します。
UEの再起動を求められた場合は、指示通りに再起動しましょう。

続いて、Quixel Bridgeにサインインします。
Quixel Brigeは、作成したMetahumanをUE5へインポートする際に使用するサービスです。また、Metahuman以外でもMegascansのアセット等をインポートする際に用いるサービスです。
「ウィンドウ → Quixel Bridge」からQuixel Brigeを起動します。

サインインが求められますので、UE5にログインしているアカウントでQuixel Brigeにもサインインします。

事前準備が完了しましたので、Metahumanを作成していきます。
コンテンツブラウザの「追加 → 新規フォルダ」を選択し、コンテンツ配下にフォルダを作成します。

作成したフォルダに、2.で出力したメッシュ(OBJ形式)とテクスチャをドラッグ&ドロップします。

インポート時の設定にて「Combine Static Meshes」のチェックを外します。
これはメッシュを一塊でインポートする為です。

インポートが完了したら、このメッシュ用のマテリアルを追加します。
コンテンツブラウザの「追加 → マテリアル」から追加します。

追加したマテリアルをダブルクリックして編集画面を開き、テクスチャをドラッグ&ドロップします。

テクスチャのRGBノードをマテリアルのベースカラーに結合し、保存します。

インポートしたメッシュをダブルクリックして編集画面を開き、マテリアルスロットに先ほど追加したマテリアルを設定して保存します。

試しにメッシュをフィールドへドラッグ&ドロップすると、メッシュにテクスチャが貼られていることを確認できます。

メッシュとテクスチャのインポートが完了したので、Metahuman identityでMetahumanを作成します。
「追加 → Metahuman Animator → Metahuman Identity」でMetahuman Identityを追加します。

追加したMetahuman Identityをダブルクリックして編集画面を開き、「Create Components → From Mesh」でインポートしたメッシュを選択します。

コンポーネント(フレーム0)が作成されましたら、ライティングを「ライティングなし」にします。

「Track Markers」を押下すると、選択しているフレームにおける顔の主要部位をトラッキングしてくれます。

無事にトラッキングされたら、「Metahuman Identityの解決」を押下してMetahumanを作成します。

「B」を押すと作成されたMetahumanを確認できます。

画面左にある「ボディ」から、Metahumanの胴体部分の調整を行うことができます。

必要に応じて、Metahumanの微調整を行っていきます。
再度フレーム0を選択し、画面右上部の「表示(visible)」「使用(used)」を押下して全て有効化します。

目や耳、眉などのトラッキング状態を調整します。
各々の輪郭に沿うように、緑色の丸と線を移動させます。
※修正は、軽い位置移動に留めましょう。線の長さを変えるような大きな修正は控えます。

再度「Metahuman Identityの解決」を押下してMetahumanを作成します。

もう一つMetahumanの調整方法を紹介します。
上記のフレーム0でトラッキングする際、正面からのトラッキングになるため耳の形状を正確に捉えることができません。
そこで、耳のトラッキング用に別のフレームを追加します。
「フレームのプロモート」を押下し、フレーム1(右耳用)を追加しました。
フレーム1では、右耳だけが使われるように「耳(R)」だけ「使用(used)」チェックを入れます。

フレーム0にて、耳が使われないように「耳(R)」「耳(L)」の「使用(used)」チェックを外します。

フレーム1と同様に、フレーム2(左耳用)を追加します。

「Metahuman Identityの解決」を押下して調整内容をMetahumanに反映します。

「Mesh to Metahuman → Auto-rig Identity(Skeltal Mesh + Full Metahuman)」を押下して作成完了です。

メッシュからMetahumanの作成が完成しましたら、Metahuman Creatorを使ってテクスチャ・体形等の調整を行います。
Metahuman Creatorは、ヘアスタイル・顔の特徴・身長・ボディプロポーション・衣服などを編集できるツールです。
Metahuman Creatorはブラウザ上で使用します。こちらのリンクからアクセスし、上記を編集していきます。

自分が使用しているUEのバージョンを選択し、「Metahuman Creatorを起動」を押下します。

先ほどMetahuman Identityで作成したMetahumanを選択し、「選択したものを編集」を押下します。

肌のスキンを編集します。
後にフォトグラメトリで作成したテクスチャと合成しますので、最低限だけ編集します。
「テクスチャ」は数値を上げるとシワが増え老けているように見えますので、0に設定しました。
「カラー」や「ラフネス」はお好みで設定しましょう。

目を編集します。
虹彩サイズ」や「虹彩彩度」は見た目の印象に大きく影響しますので、モデルの写真を見ながら調整しました。
また、「ベースカラー」「詳細カラー」も、モデルの写真を見ながら軽く調整しました。

髪の毛はお好みで設定します。
今回は元の写真と比較しやすいように、短髪に設定しています。

眉毛は「なし」に設定します。
これは、後にフォトグラメトリで作成したテクスチャから眉毛を持ってくるためです。

まつげもお好みで設定します。

体の調整もお好みで行います。
今回はモデルの方と近くなるよう、以下のように体型や頭の大きさを設定しました。
「上半身」「下半身」「靴」では身に着ける衣服を変更できます。

Metahuman Creatorでのテクスチャ設定が完了しましたら、UE5に戻ります。
※Metahuman Creatorでは常に自動保存がされていますので、「保存」ボタンなどを押す必要はありません。
「ウィンドウ → Quixcel Bridge」でQuixcel Bridgeを開きます。

「MetaHumans → My MetaHumans」から先ほど編集したMetahumanを選択し、「Download」を押下します。

20分ほど待つとダウンロードが完了しますので、「Add」を押下します。

コンテンツブラウザのMetaHumansフォルダ配下に、Metahumanが追加されていることを確認できます。
「BP_(Metahuman名)」のファイルをドラッグ&ドロップし、画面上に配置します。

Metahuman Creatorで設定したままのMetahumanを配置できました。

モデル写真との比較になります。
「全く似ていない」というわけではないですが、目や肌の質感で違いを感じてしまいます。

4.Metahumanにフォトグラメトリテクスチャを合成(3Dテクスチャマッピング

Metahumanの顔をよりモデルに似せるために、フォトグラメトリで作成したテクスチャを合成します。

まず初めに、MetahumanのメッシュとテクスチャをUE5からエクスポートします。
Metahumanが格納されているフォルダ内で「facemesh」と検索します。

フェイスメッシュを右クリックし、「アセットアクション → エクスポート」を押下します。

以下のように設定し、エクスポートを実行します。

フェイスメッシュと同様に、「FaceColor_MAIN」と検索してテクスチャをエクスポートします。

次に、Blenderを用いてフェイスメッシュの余分な部位を取り除きます。
Blenderで新規ファイルを開き、デフォルトで配置されるオブジェクトを全て削除します。

「ファイル → インポート → FBX」を押下します。

先ほどUE5からエクスポートしたフェイスメッシュを選択し、「FBXをインポート」を押下します。

フェイスメッシュがインポートされました。

画面右のフェイスメッシュ内訳を開き、「root」の右にある目玉を押下してメッシュモデルだけを表示します。

画面上でメッシュモデルを選択後、「オブジェクトモード → 編集モード」を選択します。

一度メッシュモデルの外側を押下して選択状態を解除した後、モデルの頭頂部を押下します。
その後キーボードのLキーを押下すると、下記のように頭部メッシュが選択されます。

キーボードのHキーを押下して頭部メッシュを非表示にすると、目と歯のメッシュが残ります。

Aキーで残ったメッシュを全選択し、Xキーを押下後に「頂点」を選択し、これらのメッシュを削除します。

Alt + Hキーで頭部メッシュを再表示します。これにて余分なメッシュを取り除くことができました。

「ファイル → エクスポート → Wavefront(.obj)」を押下し、上記をOBJファイルとして出力します。

次に、Wrapを用いてフォトグラメトリで作成したテクスチャをMetahuman用に転写します。
Wrapの新規ファイルを開き、2.の最後に出力した(3.にてUE5にインポートした)メッシュ(OBJ形式)とテクスチャをドラッグ&ドロップでインポートします。

インポートしたメッシュとテクスチャのノードを結合します。

先ほどBlenderでエクスポートしたフェイスメッシュと、UE5からエクスポートしたFaceColor_MAINのテクスチャをインポートします。

インポートしたフェイスメッシュとテクスチャのノードを結合します。
※フェイスメッシュは非常に小さくインポートされますので、見えやすいように「Scale」を調整しましょう。

インポートした2つのメッシュを両方とも表示します。
表示と非表示はメッシュノードの電球マークを押下して制御できます。

2.でのWrap手順と同様に、「RigidAlignment」「SelectPointPairs」を用いて2つのメッシュに対して位置合わせを行います。
右クリックから「RigidAlignment」「SelectPointPairs」ノードを追加し、以下のように結合します。

「SelectPointPairs」ノードを選択した状態でVisualEditorエリアを表示し、「Sync Views」をチェックした上で以下のように位置合わせの基準点を追加しました。

Viewport3Dエリアに戻り、「RigidAlignment」ノードを選択して「Fit Scale」にチェックを入れます。
これにて位置合わせが完了しました。

「Wrapping」ノードを追加し、以下のように結合して「Compute」を実行します。

Wrappingが完了しました。

ベースメッシュの表示をオフにすると、綺麗にWrappingされていることが確認できます。

「TransferTexture」「ExtrapolateImage」ノードを用いてフォトグラメトリで作成したテクスチャをMetahumanのメッシュに転写し、「SaveImage」で保存します。
「TransferTexture」ノードは特定のジオメトリ(メッシュ)から別のジオメトリへテクスチャを転写する機能です。
また、「ExtrapolateImage」ノードはテクスチャの色がある部分から外挿してテクスチャの透明な部分を塗りつぶしてくれる機能です。
以下のようにノードを結合します。

「ExtrapolateImage」ノードを選択してViewport2Dエリアを表示すると、処理されたテクスチャが現れます。
テクスチャ内の透明だった部分がいい感じに埋められていることを確認できます。

「SaveImage」ノードで出力先を指定し、「Compute Curent Frame」からテクスチャを出力します。
これにて、フォトグラメトリで作成したテクスチャをMetahumanで使えるように転写することができました。

最後に、PhotoShpopを用いて「MetahumanのFaceColor_MAINテクスチャ」と「Wrapからで出力した転写テクスチャ」を合成していきます。これは、フォトグラメトリで作成したテクスチャを違和感なくMetahumanに馴染ませるためです。
合成は以下のようなイメージで行います。

Photoshopを起動し、「ファイル → スクリプト → ファイルをレイヤーとして読み込み」を押下します。

先ほどWrapしたテクスチャ(フォトグラメトリで作成したテクスチャを転写したテクスチャ)と、UE5から出力したMetahumanのFaceColor_MAINテクスチャを選択します。
※Wrapにて出力する際に4096×4096で出力しましたが、FaceColor_MAINテクスチャのサイズが2048×2048であった為、こちらも2048×2048にサイズダウンしたものを選択しています。

選択したファイルがインポート対象一覧に表示されていることを確認し、「OK」でインポートします。

2つのテクスチャがレイヤーとしてインポートされたら、それぞれを分かりやすい名前に変更します。
今回は、Wrapで出力したテクスチャは「Photogrametry」、UE5から出力したテクスチャは「Metahuman」と命名しました。

インポートが完了したので、合成作業に入っていきます。
左端のツール一覧から「スポイトツール」を選択しましょう。
このツールを使用して、それぞれのテクスチャにおける肌の色をサンプリングします。
サンプル範囲は「5ピクセル四方の平均」とします。

「Metahuman」レイヤーを選択し、顔の眉間あたりを左クリックして肌色をサンプリングします。

サンプリングが完了したら、画面右下の「レイヤー」から新規レイヤーを作成します。
このレイヤーは、2つのテクスチャの肌色を比較する用途で利用します。
レイヤー名は「色比較」としました。
※下記画像では、「Photogrametry」「Metahuman」レイヤーを非表示にしています。表示/非表示はレイヤー一覧左の「目のマーク」を押下して制御できます。

左端のツール一覧から「ブラシツール」を選択し、ブラシの種類・直径・不透明度・流量・滑らかさを設定します。
今回は下記のように設定しました。

「色比較」レイヤーを選択し、ドラッグ&ドロップでレイヤー一覧の最上段に移動させます。
すべてのレイヤーを表示状態にした上で再度「色比較」レイヤーを選択し、画像左上部分にブラシで色を塗ります。
この時、先ほどサンプリングした「Metahuman」レイヤーの肌色で色が塗られます。

「Photogrametry」レイヤーを選択し、上記同様にスポイトツールで肌の色をサンプリングします。

「色比較」レイヤーを選択し、画像右上部分にブラシで色を塗ります。

左端のツール一覧で「スポイトツール」を右クリックし、「カラーサンプラーツール」を選択します。

先ほどブラシツールで塗った色の部分を、「左 → 右」の順で選択します。
これにより、それぞれの肌色のRGB値をサンプリングできました。
(「Metahuman」レイヤーの肌色が#1、「Photogrametry」レイヤーの肌色が#2となっていれば問題ありません)

「Photogrametry」レイヤーを選択した状態で、左端のツール一覧から「なげなわツール」を選択します。
なげなわツールにて、下記画像のように顔の周辺を囲います。

画面右下の「追加」を左クリックし、「トーンカーブ」を選択します。

トーンカーブ1」レイヤーが作成されたら、その中の白黒レイヤーマスクではない、レイヤー本体部分を選択します。
下記画像の赤い部分になります。

画面右中央部の手指マークを押下し、Ctrl+Shiftを押しながら「Photogrametry」レイヤーの肌色(#2)を選択します。

トーンカーブ設定の「RGB」を「レッド」に変更します。
入力・出力ともに#2のR値となっていることが確認できましたら、出力を#1のR値に変更します。
今回の場合は、「187(#2のR値)→ 220(#1のR値)」と変更しました。

「グリーン」、「ブルー」に対しても同様に出力を変更します。
グリーンではG値、ブルーではB値を使います。

すべてのRGB出力値を変更したら、Ctrlを押しながら「トーンカーブ1」レイヤーの白黒レイヤーマスクを選択します。

「Photogrametry」レイヤーを選択し、画面右下の「レイヤーマスク」を押下します。

「Photogrametry」レイヤーの白黒レイヤーマスクが作成されました。
顔の肌色と外側の肌色を比較し、おおよそ色が近くなっていることを確認します。

トーンカーブ1」レイヤーと「Photogrametry」レイヤーだけを表示状態にし、Ctrl+Shift+Alt+Eを押します。
これにより、表示レイヤーだけを結合した新しいレイヤーが作成されます。
このレイヤーは「肌調整後」レイヤーとしました。

「Photogrametry」レイヤーの白黒レイヤーマスクを、ドラッグ&ドロップで「肌調整後」レイヤーへ移動させます。
その後、「肌調整後」レイヤーと「Metahuman」レイヤーだけを表示状態にします。

「肌調整後」レイヤーの白黒レイヤーマスクを選択した状態で、「ブラシツール」を選択します。
黒色の「ソフト円ブラシ」を用いて、頭や髪の毛の黒い部分、肌の境界部分を慣らします。

全体的に慣らし、下記のような仕上がりになりました。

ブラシの直径を短くした上で、同様に口と鼻も慣らします。

目の上部を修正する際は、「肌調整後」レイヤーのレイヤー本体を選択した状態で、「コピースタンプツール」を使用します。
コピースタンプツールは、Alt+左クリックで画像の特定位置をコピーし、他の場所にコピーした位置周辺の色を反映させることができる機能です。
目の上部で色が崩壊していない部分をコピーし、その色を用いて他部分の修正を行いましょう。

以下のように修正できました。

最後に、目を修正しましょう。
再度「肌調整後」レイヤーの白黒レイヤーマスクを選択した状態で、「ブラシツール」を選択します。
鼻や口を修正したときと同様に、黒色「ソフト円ブラシ」を用いて慣らします。

以下のように修正できました。

テクスチャ全体を確認してみます。

髪の毛の黒色が少し目立っていたので、再度レイヤーマスクを慣らして調整しました。
これにてテクスチャの合成が完了です。

完成したテクスチャをPNG形式で出力します。
「ファイル → 書き出し → 書き出し形式」を選択します。

ファイル形式を「PNG」に設定して出力します。

UE5に戻り、Photoshopで出力した合成テクスチャをMetahumanに適応しましょう。
コンテンツブラウザの「コンテンツ」フォルダを右クリックし、「新規フォルダ」を押下します。

新規フォルダに移り、先ほど出力した合成テクスチャをドラッグ&ドロップします。

「Metahumans」フォルダにて「MI_HeadSynthesized_Baked」とファイル検索を行い、該当ファイルをダブルクリックします。

編集画面が開いたら、先ほどドラッグ&ドロップした合成テクスチャを選択します。
右上のパラメータ検索欄で「base」と検索し、「BaseColor」にある「←」ボタンを押下して合成テクスチャを適用させましょう。

残りのテクスチャにも適用させます。

画面左上から保存して編集画面を閉じると、合成テクスチャが反映されたMetahumanを見ることができます。

元のモデル写真との比較になります。
目や眉毛、肌の質感を含めモデルとかなり似ているMetahumanを作成することができました。

おわりに

前後編を通し、フォトグラメトリで作成したメッシュ・テクスチャを用いてMetahumanを作成する手法を紹介してきました。使用する機材・ソフトウェアがなかなか多くなりましたが、その分かなりモデルと似ているMetahumanを作成できました。
今後、様々なメタバース領域のサービスでMetahumanが利用されていくと思いますが、今回作成したように「本人そっくりな」Metahumanを活かしたサービスが増えていくことが楽しみです。
記事をご覧いただきまして、ありがとうございました!

現在、電通総研はweb3領域のグループ横断組織を立ち上げ、Web3およびメタバース領域のR&Dを行っております(カテゴリー「3DCG」の記事はこちら)。 もし本領域にご興味のある方や、一緒にチャレンジしていきたい方は、ぜひお気軽にご連絡ください!
私たちと同じチームで働いてくれる仲間を、是非お待ちしております!
電通総研採用ページ

参考文献

回転台とグリーンバックによる本格フォトグラメトリ撮影(Adobe Photoshop × RealityCapture)
フォトグラメトリによる3Dモデル作成ワークフロー(前編)
フォトグラメトリによる3Dモデル作成ワークフロー(後編)
初歩からのフォトグラメトリ~人物フォトグラメトリを活用してUnreal EngineでMetahumanを作成する方法〜【写真からゲームで使える3Dキャラを作ってみよう! vol.11】
初歩からのフォトグラメトリ~Wrapの使いかた(初級編)RealityCaptureで作ったモデルを綺麗にリトポロジーしよう!~【写真からゲームで使える3Dキャラを作ってみよう! vol.8】
Pushing the MetaHuman Likeness Limits via Scan-based Textures | Unreal Fest 2022(YouTube)
Easy Trick To Match SKIN TONES in Photoshop Fast!(YouTube)
UNREAL ENGINE download
RealityCapture
Wrap
MetaHuman Creator
顔の周りのテクスチャを馴染ませる(YouTube)
目のまわりを調整(YouTube)

執筆:@matsuzaki.shota、レビュー:@sato.taichi
Shodoで執筆されました