UE5でキャラの立ち絵を作る

# UE5でキャラの立ち絵を作る
UE5でキャラの立ち絵を作る手順をまとめておきます。

<img width="400" alt="キャプチャ.PNG" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/26034/cfc50fa0-3460-0b14-360f-7d96513b5acf.png">

<img width="400" alt="キャプチャ2.PNG" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/26034/2aaf6df0-9001-66df-00bc-22fc5da16ac5.png">

UE5にはスクリーンショットを取る機能があります。カスタム深度マスクを使うことでバックグラウンドからオブジェクトを抜き出した画像を作ることができるのですが、、

https://docs.unrealengine.com/4.27/ja/WorkingWithMedia/CapturingMedia/TakingScreenshots/#%E3%82%AB%E3%82%B9%E3%82%BF%E3%83%A0%E6%B7%B1%E5%BA%A6%E3%83%9E%E3%82%B9%E3%82%AF

<img width="400" alt="キャプチャ3.PNG" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/26034/e5a117d0-15af-b1c2-d49e-cbccc10485f0.png">

<img width="400" alt="キャプチャ4.PNG" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/26034/49346ece-1fdf-80d8-8df1-7c41c2d78d06.png">

＼(^o^)／**めっちゃジャギってる！**

というわけで別の方法をとります。アルファチャンネル用の画像とカラー画像を別々に作成し、それらを合成して立ち絵の画像を作る流れになります。
![キャプチャ5.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/26034/b3f3be43-6821-be15-34ad-00b08b5b816a.png)
TextureRenderTarget2Dを追加します。
![キャプチャ6.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/26034/09994d0a-9347-bd6a-1121-53828d67a183.png)
追加したTextureRenderTarget2DのSizeXとSizeYを好きな値に変更します（2のべき乗である必要があります）。Render Target FormatはRTF RGBA8を選択します。
![キャプチャ7.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/26034/6b6dcce4-e50d-3162-9bde-7ded164fbc53.png)
Scene Capture 2Dを追加します。
![キャプチャ8.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/26034/b1970ca8-bb56-73b0-5c5b-b7b913e56f24.png)
追加したScene Capture 2Dの「Texture Target」に先ほど追加したTextureRenderTarget2Dをセットします。また、「Capture Scene」が「SceneColor (HDR) in RGB. Inv Opacity in A」になっていることを確認します。
![キャプチャ9.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/26034/41502ddb-d7d7-cfcf-64df-f37cd305dca9.png)
Scene Capture 2Dの位置をいい感じの位置に調整します。
![キャプチャ10.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/26034/e9639f76-6a95-51be-ddac-456ad55dad13.png)
TextureRenerTarget2Dを右クリックしてコンテキストメニューを出し「スタティックテクスチャを作成」を選びます。
![キャプチャ11.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/26034/480e76eb-2d28-9f15-8d19-066b92bae985.png)
テクスチャが生成されます。
![キャプチャ12.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/26034/65d57aa6-1252-0da6-a288-7cf1b6c50050.png)
テクスチャを右クリックしてコンテキストメニューを出し「アセットアクション」→「エクスポート」を選びます。
![キャプチャ13.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/26034/00abf31d-db76-286d-7eff-503e2fb250f9.png)
適当に名前を付けてTGA形式で保存します。これがアルファチャンネル用の画像になります。
次にカラー画像を作ります。
![キャプチャ14.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/26034/17407bdd-53db-6b5f-c479-9c9df026fa47.png)
Scene Capture 2Dのシーンキャプチャの「Capture Source」を「Final Color (LDR) in RGB」に変更します。
![キャプチャ15.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/26034/a2ab0bcc-197f-37e3-0547-d9c31f01c887.png)
TextureRenderTarget2Dの「テクスチャレンダーターゲット」の「Target Gamma」を2.2に変更します。
![キャプチャ16.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/26034/a8aea151-53fe-cd92-44bf-ef1e9f063595.png)
TextureRenerTarget2Dを右クリックしてコンテキストメニューを出し「スタティックテクスチャを作成」を選びます。
![キャプチャ17.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/26034/52061d8a-71db-7f8d-41ad-4baab9b8d553.png)
テクスチャが生成されます。
![キャプチャ18.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/26034/ef1d29d2-ee41-2c1f-ab6e-698ab1a88c07.png)
テクスチャを右クリックしてコンテキストメニューを出し「アセットアクション」→「エクスポート」を選びます。適当に名前を付けて保存します。これがカラー画像になります。
![キャプチャ19.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/26034/444bce91-d0da-a16f-5437-848dd98f6d51.png)
保存した二枚の画像をGIMPで読ませます。
![キャプチャ20.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/26034/01861ada-dc87-5dfe-f809-3ba1375ae014.png)
アルファチャンネル用の画像を選択した状態で、メニューから「色」→「色要素」→「チャンネル分解」を選びます。
![キャプチャ21.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/26034/1cfadcc4-167d-dbfd-5186-e12997a967d0.png)
「色モデル」に「アルファ」を選んでOKを押します。
![キャプチャ22.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/26034/7f95aed0-d989-3720-6190-1a9e75932fb8.png)
アルファチャンネルが取り出されました（以下アルファ画像と呼びます）。
![キャプチャ23.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/26034/cc53101f-4c35-e263-f3d4-9c4eb4c490b2.png)
アルファ画像を選択した状態で、メニューから「色」→「階調の反転」を選びます。
![キャプチャ24.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/26034/7e195081-de25-3ee1-7220-5e9253c0fe10.png)
カラー画像を選択した状態で、メニューから「レイヤー」→「レイヤーマスク」→「レイヤーマスクの追加」を選択します。
![キャプチャ26.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/26034/9aca6f0f-4a4c-408f-10dd-fbac2e9399c5.png)
「レイヤーのアルファチャンネル」を選択し「追加」を押します。
![キャプチャ25.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/26034/bdc59bdc-be34-e6d0-ddb0-d969ce0f18ad.png)
アルファ画像を選択した状態で、Ctrl＋A、Ctrl＋Cで全選択＆コピーします。
![キャプチャ27.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/26034/906c4a8c-da93-d322-5480-cbbdf6cc99ee.png)
カラー画像を選択した状態で、Ctrl+Vで貼り付けます。これでカラー画像とアルファ画像を合成することができます。
![NewTextureRenderTarget2D_Tex1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/26034/6dff4bd9-230f-3ce5-0904-cdec999e8476.png)
できあがりです。

# 参考にさせていただいたサイト
https://historia.co.jp/archives/13380/

https://historia.co.jp/archives/16883/

# GIMPの処理を自動化（2023/09/10追記）
GIMPの処理を自動化しました。カラー画像とアルファ画像用の画像をGIMPに読ませたら、メニューの「フィルター」→「Python-Fu」→「コンソール」を押して以下のコードを張り付けて実行してください。（カラー画像を画像名を「TextureRenderTarget2D_Tex」、アルファ画像用の画像の画像名を「TextureRenderTarget2D_alpha_Tex」、出力画像を「E:\\output.png」としています）
```
images = gimp.image_list()
alpha_images = [img for img in images if '[TextureRenderTarget2D_alpha_Tex] (インポートされた画像)' == img.name]
alpha_image = alpha_images[0]
alpha_drawable = pdb.gimp_image_active_drawable(alpha_image)
decomposed_images = pdb.plug_in_decompose(alpha_image, alpha_drawable, "Alpha", False)
decomposed_image = decomposed_images[0]
decomposed_drawable = pdb.gimp_image_active_drawable(decomposed_image)
pdb.gimp_drawable_invert(decomposed_drawable, True)
gimp.Display(decomposed_image)

rgb_images = [img for img in images if '[TextureRenderTarget2D_Tex] (インポートされた画像)' == img.name]
rgb_image = rgb_images[0]
rgb_layer = pdb.gimp_image_get_active_layer(rgb_image)
rgb_mask = pdb.gimp_layer_create_mask(rgb_layer, 2)
pdb.gimp_layer_add_mask(rgb_layer, rgb_mask)

pdb.gimp_selection_all(decomposed_image)
pdb.gimp_edit_copy_visible(decomposed_image)
rgb_drawable = pdb.gimp_image_active_drawable(rgb_image)
pdb.gimp_edit_paste(rgb_drawable, True)
pdb.gimp_image_scale(rgb_image, 1024, 1024)

merged_layer = pdb.gimp_image_merge_visible_layers(rgb_image, 1)
pdb.file_png_save_defaults(rgb_image, merged_layer, "E:\\output.png", "E:\\output.png")
```
![キャプチャ.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/26034/919a2ac1-5533-079e-812f-9ce679bcfe83.png)