※この記事は[VCI AdventCalendar2021]の22日目の記事です。

　はじめに　

VCIどころかモデリングなどもまったくわからない私が「〇〇さんのグッズが欲しい！」と、
欲望のままに、なんとなくマグカップを作成した経験を記事にしています。

私と同じように「なんもわからんけど、こーいうものが作りたい！でも難しいことはできない！」と思っている人は、参考としていただけたら幸いです。

※モデリング及びVCIに精通されている方には未熟な記事であるかとは思います。何卒ご了承ください

　用意するソフト　

blender
Steam版でないものもありますが、私はSteam版をDLしました。
余談ですが、SteamのBlenderページ内にある【設定ボタン(歯車マーク) ＞一般】より、
「ゲーム中にSteamオーバーレイを有効にする」にチェックを入れることで
VキャスやVRCに入りながらの作業ができます。
GIMP
上部にあるDOWNLOADより[Download GIMP ** directly]をDLしましょう。
　　
Unity
　　
マグカップの柄にしたい絵とか写真
好きな子やキャラクターの写真、自作イラストなど！※著作権や肖像権には注意しようね！

さぁ、準備ができたところで、マグカップ作成に入りましょう！

マグカップを作成しよう

＜手順1　blenderでモデリング＞

①blenderを起動します。
※Edit　＞　Preferences　＞　Interface　＞　Translation　＞　Language　より、日本語選択可能

②マグカップのモデルを作成します。
既に正方形が画面に出ているので、オレンジで選択された状態で【Delete】を押して消します。

A）うつわ部分生成
追加　＞　メッシュ　＞　円柱　を選択します。

【Tab】を押すと、編集モード(右側に項目が増える)になるので、編集モードにします。
左上に[頂点選択/辺選択/面選択]が出てくるので、[面選択]を押します。
円柱の上部をクリックすると、上部だけがオレンジ色になります。

その状態から、キーボードの【S】を押すと、選択部分だけのスケールを変更できます。
決定はクリック。お好きなマグカップの厚さに調節してください。

続いて、【Alt】を押しながら【S】を押します。
法線に向かって面を押し出すことができるので、カップの深さを決めてください。

※右上の[3Dビューのシェーディング]を選択すると、設定しやすくなります。

うつわ部分完成！

B）取っ手部分生成
現在は編集モードなので、一度【Tab】を押してオブジェクトモードに戻します。
うつわの時と同様に、
追加　＞　メッシュ　＞　トーラス　を選択します。ドーナッツが出てきます。
今のままだと、重なって作業しづらいので、ドーナッツを横に移動させましょう。

左にある[移動]を押し、横に移動させましょう。
また、同じく左にある[回転]で取っ手の向きを、[スケール]で取っ手の大きさを調節しましょう。

さらに、ドーナッツを取っ手にするためには、ドーナッツの半分を消さなければいけません。
ドーナッツを選択したまま、【Tab】を押し、編集モードにします。

面を選択し【X】を押すことで削除メニューが出るため、[頂点]を選択していけば削除されます。
ただ、すべてを削除していくのは大変なので、
【Alt】を押しながら不要な部分との境界線をクリックしてください。
【Alt】を押すと、ぐるっと1周覆ってくれます。とても便利です。
下の写真のような感じになったら、【X】を押して、[頂点]をクリック。下も同様に境界を消そう。

境界の面が消えたら、あとは適当に範囲選択して【X】押して、ひたすら[頂点]を消しましょう。

取っ手部分完成！

オブジェクトモードに戻してから、完成したうつわと取っ手をいい感じにくっつけましょう。

　仕上げに、キーボードの【A】を押し、右クリック→[スムーズシェード]をクリックしてください。
　ツルツルになります。

マグカップのモデル完成！

③UV展開します。
柄をつけるために、作成したマグカップを平面へ展開します。

上記で作成したマグカップと取っ手を範囲指定などで両方選択した状態で、
上部の[UV Editing]タブを選択します。
左上にある[UVの選択を同期]を押してください。あわせて、その右側にある[辺選択]も押してください。

UV展開のポイントはどこを切ればきれいに展開されるかを意識するといいと思います。
今回はとりあえず小刻みに
　・外側
　・内側
　・ふち
　・取っ手
　・底
　・裏側
となるように分けようと思います。

マグカップの外側が選択されるように、【Alt】を押しながら、マグカップの上部をクリックします。

少し見づらいですが、ふちの外側が1周囲われました。
この状態で【Ctrl】+【E】を押し、[シームをマーク]をクリックしてください。
[シームをマーク]が「ここを切りますよ」という線になります。

切り込みが1か所だと複雑な展開になってしまうため、同じようにして、マークしていきます。
下記の部分にマークを入れてください。

入れ終えたら、キーボードの【A】を押し、すべてを選択します。
続いて、キーボードの【U】を押し、[展開]をクリックしてください。

きれいに展開されました。

※今回は変化ありませんが、
左上の[UV]　＞　[アイランドを梱包]を押すことで、よりきれいな展開図となります。

キーボードの【A】を押すと、アイテムが全選択されるので、
その状態で、左上の[UV]　＞　[UV配置をエクスポート]をクリックし、名前を付け、
任意の場所へ保存してください。

④モデルのエクスポート
最後に、作成したマグカップのモデルをFBXで出力して、unityで触れるようにします。
上部の[Layout]タブを選択します。

今のままだとモデルの位置と大きさが悪いため、
キーボードの【A】を押した後に、左側の[スケール]と[移動]で調節してください。
　
調節が完了したら、マグカップ全体が選択されていることを確認のうえ、
ファイル　＞　エクスポート　＞　FBX　をクリックしてください。

エクスポート画面が出てくるので、右側の部分を下記のように設定し、
名前[マグカップ]をつけて任意の場所へ[FBXをエクスポート]してください。

　・[選択したオブジェクト]にチェック
　・[前方]Zが前方
　・[上]Yが上

以上で、blenderでの作業は終了です。

＜手順2　GIMPでマグカップデザイン＞

GIMPで、好きな色もしくは、好きな写真、イラストなどで加工していきます。ここが一番楽しい。

①GIMPを起動し、blenderで作成した展開図をドラック＆ドロップします。

②レイヤーの追加と入れ替え
レイヤー　＞　新しいレイヤーの追加　を選択し、
[塗りつぶし色]がwhiteになっていることを確認のうえ[OK]を押してください。

画面が真っ白になりました。

右下の部分をドラック＆ドロップで上下入れ替えてください。展開図が出てきました。

③飾り付け

私の場合はこんな感じです。これがいわゆるTextureというやつですね。

④テクスチャーのエクスポート
右側の展開図部分の目マークを必ず外し、
ファイル　＞　名前を付けてエクスポート　から、名前を付けて任意の場所に保存してください。

以上で、GIMPの作業も終了です。残りはunityだけ！頑張りましょう！

＜手順3　unityでVCIアイテム作成＞

①unityを起動します。
初めてVCI作成される場合は下記バーチャルキャストのページを参照し、
「UniVCI」を[Assets]に入れるところまで完了させてください。

■バーチャルキャスト公式Wiki TOP » VCI TOP » VCIのUnityPackageを導入する
　https://virtualcast.jp/wiki/vci/unitypackage

②[Assets]へ下記2ファイルをドラッグ＆ドロップしてください。
　・blenderで作成した「マグカップ（FBXファイル）」
　・GIMPで作成した「Texture（PNGファイル）」

③[Assets]内の「マグカップ」を選択し、
[Inspector]　＞　Materials　＞　[Extract Materials...]をクリック
フォルダーの選択画面が出てくるので、何も選択せず、[フォルダーの選択]を押してください。

④[Assets]内の「マグカップ」を[Hierarchy]へドラッグ＆ドロップしてください。

⑤シェーダーを変更する。
[Hierarchy]の「マグカップ」を選択し、
左側の▼を押して、中にある[Cylinder]もしくは[トーラス]を押し
下の方にある[Shader]がStandardになっているので、VRM　＞　MToonを選択。
　
また、[Color]項目のTexture欄の左側にある□に、[Assets]内に入れたTextureを入れてください。

[Scene]を見ると見た目は完成しています。

⑥[VCIObject]を設定。
[Hierarchy]内の何もないところで、右クリック→[Create Empty]を選択。
[GameObject]というアイテムが出てくるので、
そのアイテムを右クリックし[Rename]を選択、適当に名前を付けます。
ここでは「マグカップVCI」としておきます。

[Hierarchy]の「マグカップVCI」を選択した状態で、[Inspector]の「Add Component」をクリック。
「VCI」と検索し、「VCIObject」を追加します。

「VCIObject」の[Information]にある、[Title][Version][Author（作者）]に情報を入れます。

⑦[VCI Sub Item]を設定。
[Hierarchy]の「マグカップ」を選択し、[Inspector]の「Add Component」をクリック。
「VCI」と検索し、「VCISubItem」を追加します。

また、「Add Component」をクリックし
「Collider」と検索。「Box Collider」も追加します。

なお、下記項目にはすべてチェックを入れてください。
※下記以外の項目はチェックが入らないように。
　
　・「VCISubItem（Script）」項目
　　　[Grabbable]　つかめる
　　　[Scalable]　大きさを変えれる
　　　[Uniform Scaling]　縦横比が固定される
　　　[Attractable]　引き寄せられる
　
　・「Rigidbody」項目　
　　　[Is Kinematic]　物理衝突に影響を受けない

　・「Box Collider」項目
　　　[Is Trigger]　衝突判定をしない
　
⑧「Box Collider」のサイズを調節する。
マグカップをちょうど覆うように
「Box Collider」のSize部分を調節します。

⑨VCIとしてエクスポートする
[Hierarchy]の「マグカップVCI」を選択している状態で
[VCI]　＞　[UniVCI-**]　＞　[Export VCI]をクリックし、名前を付け、任意の場所へ保存する。
　

保存したファイルをThe Seed Onlineにアップロードして、完成です！

お疲れさまでした！

さいごに

つたない文章やわかりづらい部分があったかと思いますが、
ここまでお付き合いいただきまして、ありがとうございました。

それでは、よいバーチャルライフをお過ごしください！