xRDCC（xR Developers Community Conference）で発表したスライドです。 https://www.youtube.com/watch?v=b83xymLi8O4 https://vrtokyo.connpass.com/event/185043/

1. Unityで作ったVRMポーズ
をUE4でも使う！
COCOPStudioと
UE4エディタ拡張

2. 自己紹介
若草なずな
Technical Artist
●VRMポーズブックアプリ『COCOPStudio』制作中（まだ薄い！）
●VRのアプリ作ってます。UnityからUE4へ移行中『夢枕VR』
●Hololens 2を使ったアプリ制作しようとしてる『COCOPHoloStudio』
●漫画描いたりしてる、3Dモデル作ったりしてる
●ｹﾞｰﾑｴﾝｼﾞﾝ、OS、3DCGﾂｰﾙ、泣かされた回数は数知れず......
https://twitter.com/
NazzTea

3. ２０２０年に作ったゲーム
【GGJ】『 Re:pair 』（Unity + VRM + COCOPStudio）
https://globalgamejam.org/2020/games/repair-0
【Cluster GAMEJAM】『 ソシアルニュクス 』
https://cluster.mu/w/5cc99948-3df5-43e8-a736-2998e51bd1a6
【第14回UE4ぷちコン応募作品】『 箱庭アルケミー 』
（UE4 + VRM + Hololens 2 + COCOPStudio）
https://www.youtube.com/watch?v=74UQWaasvFU&t=2s

4. はじめに
うちの子 可愛いですよね･･･
（よそ様のうちの子も！）

5. はじめに
可愛い子には旅をさせよって 言いますよね

6. はじめに
旅 させませんか？

7. はじめに
Unreal Engine4

8. VRM4U
https://booth.pm/ja/items/1707224
はじめに

9. はじめに
UE4を使って 旅 させよう！

10. はじめに
いや、でもUE4触る機会ないし・・・

11. はじめに
手を動かしてUE4を学ぼうイベントあります。
https://historia.co.jp/ue4petitcon/

12. Hololens 2（UE4）＋VRM
第14回UE4ぷちコンに『箱庭アルケミー』を昨日提出しました。

13. Hololens 2（UE4）＋VRM
８割ぐらいUE4ぷちコンのおかげで、このスライドができました。

14. はじめに
UE4を使って 旅 させよう！

15. 今日話すこと
・UE4の使ってゲーム作る
・VRM4Uのセットアップ
・COCOPStudio（Unity）で作ったポーズをUE4で使う

16. 今日話すこと
・UE4の使ってゲーム作る
→猫でも分かる UE4を使ったゲーム開発 超初級編 #1～#8
https://www.youtube.com/watch?v=ztv4OPc_o6g
・VRM4Uのセットアップ
・COCOPStudio（Unity）で作ったポーズをUE4で使う

17. 今日話すこと
・UE4の使ってゲーム作る
→猫でも分かる UE4を使ったゲーム開発 超初級編 #1～#8
https://www.youtube.com/watch?v=ztv4OPc_o6g
・VRM4Uのセットアップ
→VRM4Uドキュメント
https://ruyo.github.io/VRM4U/01_quick-start/
・COCOPStudio（Unity）で作ったポーズをUE4で使う

18. 今日話すこと
・UE4の使ってゲーム作る
→猫でも分かる UE4を使ったゲーム開発 超初級編 #1～#8
https://www.youtube.com/watch?v=ztv4OPc_o6g
・VRM4Uのセットアップ
→VRM4Uドキュメント
https://ruyo.github.io/VRM4U/01_quick-start/
・COCOPStudio（Unity）で作ったポーズをUE4で使う

19. 今日話すこと
・COCOPStudio（Unity）で作ったポーズをUE4で使う
→COCOPStudioについて
→UnityとUE4の軸の話
→UnityからUE4へ
→COCOPStudioから
→UE4のエディタ拡張を使って

20. COCOPStudioとは？
COCOPStudio？

21. VRMポーズブックアプリ
COCOPStudio
(Unity製)

22. COCOPStudioとは？
現在AndroidとWindows向けに配信中

23. COCOPStudioとは？
iPad Pro版は愛用中で、もう少し頑張れれば公開
COCOPStudio
CLIP STUDIO PAINT

24. COCOPStudioとは？
大体いつも画面割って使ってます。
CLIP STUDIO PAINT
COCOPStudio

25. COCOPStudioとは？
衣装もiPadで（お布団の中で）作ってます

26. COCOPStudioとは？
ポーズを保存・読み込み

27. COCOPStudioとは？
ポーズを作成・修正

28. COCOPStudioとは？
透過PNG出力

29. COCOPStudioとは？
使い道は？

30. COCOPStudioの用途
画像出力して、ゲームや

31. COCOPStudioの用途
漫画などの制作に使えます

32. 余談：Hololens 2（Unity）
Hololens 2 でCOCOPStudioを動かしてみた

33. ポーズの集合サイトを作った！
ココポーズマニアックス
https://cocop.site
お手軽にポーズを手元の
COCOPStudioに入れれる
ようにしていきたい！

34. ことの始まり
UE4ぷちコンでVRMとHololens 2を使いたい

35. ことの始まり
VRMをUE4で使うには
ポーズを
また作らないといけない

36. ことの始まり
UE4のエディタで作るの？
Blenderで作るの？
PCの前に座って？

37. ことの始まり
めんどくさい！

38. ことの始まり
１度作ったポーズはもう作りたくない精神で
COCOPStudioを作っています

39. ことの始まり
COCOPStudio連携させればいいじゃないか！

40. ことの始まり
UnityのVRM と UE4のVRM
Humanoidは同じ！
ならボーンの回転を渡せばいいだけやん？

41. ことの始まり
ということで
UnityからUE4へポーズ渡す方法考えてみた

42. UnityからUE4へ
ここからちょっと難しい話に･･･

43. UnityからUE4へ
UnityからUE4へデータを渡すということで
受け渡しの形式を合わせないといけない

44. UnityからUE4へ
UnityからJSON形式で出力して、
JSON
[{No,名前,ポーズ情報},
{No,名前,ポーズ情報},
{No,名前,ポーズ情報},
・
・
・ ]

45. UnityからUE4へ
UE4の構造体で受け取る形を定義して
JSON
[{No,名前,ポーズ情報},
{No,名前,ポーズ情報},
{No,名前,ポーズ情報},
・
・
・ ]

46. UnityからUE4へ
UE4のデータテーブルで読み込む
JSON
[{No,名前,ポーズ情報},
{No,名前,ポーズ情報},
{No,名前,ポーズ情報},
・
・
・ ]

47. UnityからUE4へ
受け渡しは決まった！ 次は、ポーズデータ！

48. UnityからUE4へ
ポーズデータを渡すところで
問題になるのが

49. UnityとUE4の軸の話
UnityとUE4は軸が違う

50. UnityとUE4の軸の話
Unity UE4
左手系Yup 左手系Zup

51. UnityとUE4の軸の話
左手系？

52. UnityとUE4の軸の話
左手座標系

53. UnityとUE4の軸の話
プログラマーの方がよく自分の左手を
くるくるしてますよね

54. UnityとUE4の軸の話
これです

55. UnityとUE4の軸の話
さて、軸を変えればいいんでしょ～
（地獄への入り口）

56. UnityとUE4の軸の話
ここからやるのは回転情報の共通を作る
UE4 : Zup
Rotation
Unity : Yup
Rotation

57. UnityとUE4の軸の話
Neckに同じ値を入れているのですが
UE4側では、ジンバルロック現象
UE4 : Zup
Rotation
Unity : Yup
Rotation

58. UnityとUE4の軸の話
UnityのRotationって何･･･

59. UnityとUE4の軸の話
UnityのRotationのようなもの ジンバルロックは
話しをすると時間が足りないので省略します！

60. UnityとUE4の回転の話
手に持ってるカードをあつめた
Unity : Yup
Quaternion UE4 : Zup
Quaternion
UE4 : Zup
Rotation
Unity : Yup
Rotation
Unity : Yup
Rotation？

61. UnityとUE4の回転の話
Unityは内部ではQuaternionを使用しているらしい
Unity : Yup
Quaternion UE4 : Zup
Quaternion
UE4 : Zup
Rotation
Unity : Yup
Rotation
Unity : Yup
Rotation？

62. UnityとUE4の回転の話
人が扱いやすい3次元をやめて
Quaternionでやろう
Unity : Yup
Quaternion UE4 : Zup
Quaternion
UE4 : Zup
Rotation
Unity : Yup
Rotation
Unity : Yup
Rotation？

63. UnityとUE4の回転の話
Unity側でYupからZup変換
Unity : Yup
Quaternion
UE4 : Zup
Quaternion
UE4 : Zup
Rotation

64. UnityとUE4の回転の話
HumanoidのZupクォータニオンを全部文字列で保存
Unity : Yup
Quaternion
UE4 : Zup
Quaternion
UE4 : Zup
Rotation

65. UnityとUE4の回転の話
UE4で受け取った文字列をQuaternionに変換
Unity : Yup
Quaternion
UE4 : Zup
Quaternion
UE4 : Zup
Rotation

66. QuaternionをRotationに変換
UnityとUE4の回転の話
Unity : Yup
Quaternion
UE4 : Zup
Quaternion
UE4 : Zup
Rotation

67. UnityとUE4の回転の話
できた！

68. UnityとUE4の回転の話
やってやりました

69. UnityとUE4の回転の話
やってやりました

70. ここまでまとめると
Unity UE4エディタ拡張

71. ここから
よし！
COCOPStudioに組み込んで自動化

72. COCOPStudioに組込み
左下の”ポーズを全部UE4へ”
を押すの実装

73. COCOPStudio
COCOPStudio UE4エディタ拡張

74. UE4エディタ拡張（結果）

75. まずは、UE4でJson読み込みから
ポーズ作成までの流れ

76. UE4のエディタ拡張
COCOPStudioからJSONファイルがでるので
UE4のエディタにドラッグ＆ドロップ

77. UE4のエディタ拡張
この後自作するウィジェットを実行

78. UE4のエディタ拡張
UE4エディタに出現 実行する
1
2

79. UE4のエディタ拡張

80. 拡張したエディタの中身を見ていきましょう

81. UE4のエディタ拡張
よくある プレイ

82. UE4のエディタ拡張
プレイを押さないで エディタのみで完結したいですよね

83. UE4のエディタ拡張

84. UE4のエディタ拡張
テキストボックスやボタン等を良い感じに並べる

85. UE4のエディタ拡張

86. UE4のエディタ拡張
アニメーションBPから直接ボーンに値を入れれる

87. UE4のエディタ拡張
人型でわかりやすく！

88. UE4のエディタ拡張
人型に値を渡す変数に回転を格納！

89. UE4のエディタ拡張
このノードがエディタ上でアニメーションBPを動かしてくれるみたい

90. UE4のエディタ拡張
VRMプラグインのVRMBakeAnimを使ってアニメーションで保存する

91. UE4のエディタ拡張
VRMプラグインのVRMBakeAnimを使ってアニメーションで保存する

92. アニメーションのリターゲット
他のVRMモデルでも 今作ったポーズ使いたい

93. アニメーションのリターゲット
やりましょう アニメーションのリターゲット

94. アニメーションのリターゲット
まず全部のアニメーションを選択

95. アニメーションのリターゲット
Animアセットとリターゲットを複製するを選択

96. アニメーションのリターゲット
やってやりました
アニメーションを渡した
いモデルを選ぶ
押す

97. アニメーションのリターゲット

98. 最後に
いつ使えるの？

99. 最後に
9月中に使えるように何とか･･･
デスクトップ版で配布予定です

100. 余談
UE4でアニメーションを作る

101. 余談：UE4でアニメーションを作る

102. 余談：UE4でアニメーションを作る
ポーズを並べて、UE4に補完してもらう

103. ご清聴ありがとうございました！
UE4使おうぜ！

104. ＣＯＣＯＰＳｔｕｄｉｏを
よろしくお願いします！
FanboxやBoothでご支援の方もお
待ちしております！