!!!ShadeからUnityに形状を渡す Shade 13.2.3で、スマートフォンの形状を自由曲面で作ってUnityにfbxとして渡すまでの流れを説明します。 なお、可能でしたらポリゴンメッシュとして一から作るという手段もあります。 得意なほうで試してみてください。 '''Unityに出すときは、最終的にポリゴンメッシュに変換した状態でエクスポートするようにしてください。''' Unityではポリゴンの面は自動的に三角形分割されますが、三角形分割後の見た目はShade上で確認して同じ感じになるように近づけるのが近道です。 !!サイズは合わせる たとえば、スマートフォンの形を作りたいのなら縦横高さのサイズはきっちりあわせるようにしましょう。 そうしないと、机の上にスマートフォンを置くとテーブルよりも大きかった、なんてことになりかねません。 Shadeの場合はシーンの単位はミリメートルです。 Unityの場合はシーンの単位はメートルですが、ShadeのFBXエクスポータでこの単位変換は自動で行ってくれます。 具体的には、ShadeからのFBX出力時にシーンの単位をセンチメートルとして出力すると、 Unityは自動的にメートル換算で単位変換して読み込んでくれる。 !!「一点に収束」は使わない 自由曲面のフタとなる部分(スマートフォン言えば、スクリーンのある表部分と裏側)は、「一点に収束」でバッテンで閉じる、というのが昔からの手法としてありますが、 ポリゴンメッシュに変換する場合は中央に三角形の角が集中しますのでお勧めしません。 {{ref_image shade_smartphone_001.png}} どうすればよいかというと、 パート 閉じた線形状 (*A) 自由曲面パート 閉じた線形状 (*A) <== 上フタと同じ形 閉じた線形状 閉じた線形状 閉じた線形状 (*B) <== 下フタと同じ形 閉じた線形状 (*B) のように、上フタと下フタ部分をコピーして自由曲面の外に出してしまいます(オリジナルの閉じた線形状は消さないようにしてください)。 これの「パート」を選択して「ポリゴンメッシュに変換」します。 {{ref_image shade_smartphone_002.png}} 上フタ、下フタ部分がきれいになりました。 !!面の向きを確認 この段階で、面が正しい向きを向いているか確認します。 透視図の右上のアイコンをクリックして出るメニューより「表示オプション」-「法線の表示」を選択。 赤いヒゲを出します。透視図上でぐるっと見ていくと裏面が裏返ってるのが分かります。 {{ref_image shade_smartphone_002_2.png}} 裏面を面選択モードで選択し、ツールボックスより「編集」-「メッシュ」-「面反転」を選択して面の向きを裏返します。 まだ多角形の面がある状態ですので、三角形に分割してみます。 !!三角形分割 形状編集モードで、面選択モードにします。 そして、ポリゴンメッシュの上フタ部分と下フタ部分を選択します。 ツールボックスより「編集」-「メッシュ」-「分割」で「三角分割」を選びます。 {{ref_image shade_smartphone_003.png}} 以下のように分割されました。 {{ref_image shade_smartphone_004.png}} スマートフォンの側面部分など、四角形が残ったままですがそのままでOKです。 凸角形状態の面はUnityに渡す際にいい感じに分割してくれます。心配でしたら、側面も同じ要領で面選択して、三角形分割してあげてください。 とりあえず、形状(ジオメトリ)はこんなところで次にUVを割り当てます。 !!UV割り当て !上フタのUVを割り当てる 形状編集モードで頂点選択モードに移行し、正面図をズームして上フタに属する頂点をボックス選択でドラッグして選びます。 {{ref_image shade_smartphone_005.png}} この後、面選択モードに切り替えると、頂点を囲む面が選択されます。つまり、上フタに属する面が選択された状態になります。 正面図をUV画面に切り替えます。 デフォルトのUVが割り当てられたままですので、UV画面上の十字が寝転がったアイコンをクリックして出るメニューで「UVの削除」を選択して一度クリアします。 {{ref_image shade_smartphone_006.png}} 同じくメニューで「UVの作成」を選択。 表示されるウィンドウの左上の「投影」ボタンを押し、投影面を「上面図」にして、「UV作成」ボタンを押します。 {{ref_image shade_smartphone_007.png}} すると、上面図に選択された状態のものがUVに割り当てられます。 {{ref_image shade_smartphone_008.png}} このように、ShadeのUV編集機能では選択された面を投影の形でUV生成していきます。 UV画面のマニピュレータを調整し、テクスチャ上の配置にあうようにサイズ変更や位置変更します。 裏面も配置したいので左端に配置しました。 !裏面の下フタのUVを割り当てる 同じように、下のフタになる面もUVに展開し配置します。 やり方は同上。以下のように配置しました。 {{ref_image shade_smartphone_009.png}} !側面のUVを割り当てる 側面部のUVも割り当てておきます。 UV画面ですべての面を選択してから、ツールボックスの「編集」-「メッシュ」-「選択状態を反転」を選択。側面部の面だけ選択された状態になります。 {{ref_image shade_smartphone_010.png}} UVの作成で、投影で右面図を投影面にするなど。うまいことUVが割り当てられない場合は、 一度すでにUV割り当てが完了した面を選択して、一度ポリゴンメッシュから切り離し(メッシュ編集機能の「形状複製」などを使用)して側面だけにしてUV割り当て作業してもよいかもしれません。 {{ref_image shade_smartphone_012.png}} !!マテリアル(表面材質)の指定 !テクスチャを描く UV画面で「UVを画像ファイル出力」を選択してテクスチャのワイヤーフレームを画像として出力します。これを元にPhotoShopなどのペイントソフトでテクスチャを描いていきます。 '''テクスチャサイズは2の累乗になるのがよいです。''' デフォルトは512x512 pixelになっています。 !表面材質の拡散反射マッピング指定 ポリゴンメッシュの表面材質を作成し、拡散反射マッピングに作成したテクスチャ画像を割り当てます。 {{ref_image shade_smartphone_013.png}} なお、Unityではマテリアル名で個々のマテリアルを判断しますので、 できるだけShadeでは直接表面材質としてマテリアル指定するのではなく、 '''マスターサーフェスとして名前を付けて登録'''しておくほうがよいです。 Shadeのマスターサーフェスが、Unityに渡すfbxではマテリアル名とイコールになって出力されます。 !!Unityへのエクスポート ShadeのFBXエクスポータ機能でUnityが呼び出せるfbx形式で出力します。 この際に'''ブラウザで表示されている形状名は全部英語'''にしてください。 そうしないとUnityに読み込んだ際に文字化けします。 「ファイル」-「エクスポート」-「FBX」でFBXとして出力。 この際に「シーンの単位情報を使用」のチェックボックスはOffに、 「イメージをFBXファイルに埋め込み」のチェックボックスはOnになっているのを確認します。 これで、fbxとしてはセンチメートルの単位で出力(Unityはメートルに自動的に変換してくれます)、マテリアルも埋め込まれた形でUnityに渡すことができます。 {{ref_image shade_smartphone_014.png}} 後は、Specularを与えたりマテリアルを入れ替えたりはUnity側で自由にできます。 Shadeは、形状(ジオメトリ)の作成とUVの割り当て、を主にお膳立てするものとして利用するのがよいかと思います。