みつまめ杏仁

アンリアルエンジン(UE4)でGUIを作るためにゴニョゴニョしてます。UIデザイナーの皆様の助けになれば幸いです。

3DメッシュでつくるUI ー カーブ利用編

 日が落ちるのが早くなってきましたね。帰宅中に夜道を歩いていると、ふいに稲の枯れた匂いが漂ってきたので、見ると田んぼの稲がすっかり刈られていました。昼間はまだ暑いので意識していなかったんですが、なんだか急に夏の終わりを感じて寂しく思うと同時に、美味しい食べ物がいろいろ出てくる季節なのでワクワクもしています。

 さてさて、この頃はゲームエンジンが身近になって、3Dを利用するためのハードルがものすごく下がった、もはや無いのではないかとさえ思います。2Dアセットを扱うことが圧倒的に多いUIデザイナーとしては、周りのモデラーさんと比べてしまったり、手を付けるとしても今一つ成果物のイメージがUIと結びつきにくいとか、習得するのも時間がかかりそうだとか、サブスクやライセンス料が高いDCCツールだと家でコッソリというのも難しかったり、いろいろと心理的ハードルが高く、キビシさを感じておられる方も多いのではと思います。

 そこでぼくは、あくまでも 2DUI の延長線上で、部分的に3Dに置き換えていくという作り方を提案したいなと思った次第。

 イラレや手書きじゃなくて、リアル質感のあるUIを作りたいから3Dを勉強したい、というのは残念ながらぼくでは力不足なので、技術書か他のサイトをあたってもらうしかないですね。ゲーム画面の中で、リアルタイムレンダリングで、無理なく表現できる少しリッチなUI表現を実装するために というコンセプトで書いていきます。

 

 

今回サンプルとして用意したのはモーダルウィンドウです。

画面に対してかなり大きな面積を占めるうえに、常駐させることが多く、何度も目にするのであまりテクスチャの解像度を低くすることもできないので、メッシュで作るのにちょうどいいからです。

f:id:hiyokosabrey:20211011233210j:plain

 このウィンドウベース(下敷き)を3Dメッシュで作ることで、テクスチャの解像度を稼ぎつつ、効率のよいテクスチャアトラスを作ろうぜ、というのが目的です。
中央の単色ベタの部分を有効利用したいなと。

 

 スプライトやImageで複数のパーツに分割するとテクスチャの容量を節約できるけど、いくつかのパーツに分けてくっつけて表示するというのも、ちょっと組み合わせるのが手間なうえに、圧縮によるピクセルの荒れを回避する必要があったり、アニメーション時に隙間やズレが出たり、フェード時に重なりが見えてしまったり、というのを心配してしまうのだけれど、最近あまりそういった悩みを聞かなくなった。容量の心配しなくていいほど余裕があるのか、9スケールグリッドみたいなデザインを選択して回避しているのかもしれない。

f:id:hiyokosabrey:20211013231519p:plain

 デザインでグリッドに縛られすぎるのも、ゲームの雰囲気によってはお行儀が良すぎて絵的に面白くないし、容量の負担を大きくせずに大胆な形状を採用できるのはメッシュが向いていると思うのです。

 

 スプライト等の2Dでは矩形でしか描画できないのに比べて、ポリゴンのあるとこしか描画しないので、不要なピクセルの半透明ブレンドの計算を減らすことができます。また9スケールグリッドのような部分的にテクスチャを伸ばすことも楽勝なので、柔軟なデザインに対応できます。どんなに複雑な形状でもOneオブジェクトとして扱える。

 テクスチャの容量が節約できると、テクスチャのロード時間が減るし、常駐量が少なくなれば、メモリ管理に余裕ができるし、もっと他にリッチな表現が欲しいときの貯金としてやり繰りできます。

 

 さすがにメリットばかりじゃなくて、レイアウトがカメラ基準だったり、色味の調整に悩んだり、メッシュ内のポリゴン順で悩んだり、扱うツールが増えたりするので「なにがなんでもは3Dメッシュじゃい!」とは言わないですが、3Dメッシュによって表現の幅やできることが広がるのは自信を持って言うことができます。タイトル名は書けないのですが自分のかかわったタイトルでは結構な頻度で3DでUI作ってます。

 3DでUI作ってるというと、ほぼ例外なく立体的な見た目を想像されるのですが、ぼくは テクスチャ容量節約描画負荷削減 のために使うことが多いです。なので、3Dであることを気づかれないのは寂しくもあるけど、ある意味自慢です。最近は頂点アニメーションもやりやすくなったので楽しいですね。そのうちUVアニメーションの楽しさとかも記事にしていきたいと思ってます。

 

 

 というわけで、今回作ったテクスチャはスカスカですが、下図の斜線部分も余すことなく使っていきたいのです。

f:id:hiyokosabrey:20211013234945p:plain

 

 

 

f:id:hiyokosabrey:20211016010033p:plain

メッシュの作成は Blender を使用します。ver 2.92 を使って記事を書いていますが、ver2.93でも問題なく進められます。

今回作るものに必要な操作は書いていますが、インストール方法や基本操作については省かせていただきます。

 

 

まず、カーブを使ってみるところから。

カーブを使わなくても問題ないのですが、いろいろ便利に使える手法なので、記事にしておきます。

 

 

ObjectModeで Add > Curve > お好きなカーブタイプ

f:id:hiyokosabrey:20211007233309p:plain

カーブを選ぶとビューポートにオブジェクトが配置されます。

カーブは、厚みなどのボリュームがないので、作成時のカメラの角度によっては追加されたことが分かりにくいことがあります。
テンキーの [ 1 ]、[ 3 ]、[ 7 ]、を押して探します。

f:id:hiyokosabrey:20211007234654p:plain

f:id:hiyokosabrey:20211007234702p:plain

f:id:hiyokosabrey:20211007234709p:plain

これでも見えない場合はカメラが離れすぎているかもしれないのでピリオド [ . ] キーを押してみると見つかることもあります。サイズが大きくないので、スケールで大きくするのもありです。

 

パースペクティブビュー(奥行きのある視点)で作業すると歪みが出やすいので、

平行投影にします。切り替えは テンキーの [ 5 ]

f:id:hiyokosabrey:20211007235929g:plain

 

向きは後から回せるので、とりあえずXY面で作業していくことにします。

 

[ Tab ]キーを押して、ObjectMode から EditModeに切り替えます。

f:id:hiyokosabrey:20211008002303p:plain

カーブの両端に方向線が出てきます。(ベジェ曲線を選択した場合)

 

 

カーブを伸ばす

カーブを伸ばしたいどちらか一方のアンカーポイントを選んで [ E ] キーを押す。

f:id:hiyokosabrey:20211009091758p:plain

 

そしてすぐにドラッグすると新たなアンカーポイントが増えます。

f:id:hiyokosabrey:20211008002618p:plain

 

カーブを閉じる

閉じるには両端のアンカーポイントを選択して、[ Alt ] キー押しながら [ C ]キー

f:id:hiyokosabrey:20211009004530p:plain

 

無事閉じたら、形を整えていきます。

アンカーポイントと方向線の端の点が選択できるので、[ G ]キーを押していい感じの位置に移動させていきます。

f:id:hiyokosabrey:20211008004341p:plain

アンカーポイントや方向線を選んだ状態で、[ R ]キーを押すと、方向線を回転、[ S ]キーで長さを調整してカーブの流れを整えていきます。

 

マウスで対象を直接ドラッグする方法に慣れてると、結構戸惑うと思います。

Blenderの場合、

  1. 対象を選ぶ
  2. アクション(何をするか)を決める
  3. 操作する(アクションによっては追加で設定や調整までできるものがある)

という3段構えで触ることが多いです。

対象の種類や状態によってできることとできないことの差が大きくて、状況依存としてコンテキストから選ぶほうがユーザーにとっては選びやすかろうという配慮だと思います。

 

 

アンカーポイントの追加

アンカーポイントを後から増やすには、セグメントの分割という操作になります。

2点を選んで

f:id:hiyokosabrey:20211010111611p:plain

ヘッダーメニューから Segments > Subdivide

f:id:hiyokosabrey:20211010111740p:plain

f:id:hiyokosabrey:20211010111906p:plain

 

 

アンカーポイントの削除

削除したいアンカーポイントを選択した状態で

f:id:hiyokosabrey:20211010114454p:plain

 [ X ]キーを押すとポップアップが出ます

f:id:hiyokosabrey:20211010114129p:plain

Vertices を選ぶと消えます。

f:id:hiyokosabrey:20211010114328p:plain

 

アンカーポイントを2点選んでこの操作を行うと、間のセグメントを削除できます。

f:id:hiyokosabrey:20211010115044p:plain

f:id:hiyokosabrey:20211010115053p:plain

ショートカットキーを使いましたが、ヘッダーメニューからも同じ操作が可能です。


 

 

大体カーブの扱い方がわかってきたところで、

画面デザインからテクスチャを作って、Blenderに持ってきます。

 

まずテクスチャはこんな具合に入れました。

f:id:hiyokosabrey:20211011235142p:plain

1920x1080の画面サイズを想定しているので、テクスチャのサイズは 2048x1024 と巨大です。画面デザインからダイレクトに移植しました。

作業しやすいように、背景は真っ黒です。
PSDで書き出したらBlenderのウィンドウに直接ドロップします。

f:id:hiyokosabrey:20211011234456p:plain

f:id:hiyokosabrey:20211012230240p:plain

ObjectModeじゃないとドロップできないので注意

あと、作業するビューにドロップしないと、カメラの向きを変えると回転してしまいます。

f:id:hiyokosabrey:20211011235958p:plain

色が濃すぎるので、半透明にします。

ドロップした画像オブジェクトを選択した状態で設定パネルから調整できます。

f:id:hiyokosabrey:20211011235739p:plain

f:id:hiyokosabrey:20211012000009p:plain

実はこれ、テクスチャではなく、下絵として使います。

 

ここにカーブを追加したら、この絵を下敷きにして形を整えていきます。

f:id:hiyokosabrey:20211012001110p:plain

少し外側を通る感じ。

f:id:hiyokosabrey:20211012001329p:plain



 



 

この「カーブ」は「メッシュ」にしないとゲーム画面で描画できません。

アウトラインフォントがすでに実装できているので、いずれはそのままアセットとしてレンダリングできる時代が来るとは思いますが、いましばらくはメッシュと仲良くするしかないようです。

 

さて、モードを ObjectMode に切り替えます。

f:id:hiyokosabrey:20211012000950p:plain

 

カーブからメッシュに変換する方法は2つ

一つは ヘッダーメニューから Object > Convert to > Mesh

f:id:hiyokosabrey:20211009000703p:plain

 

もう一つは、カーブの上で右クリック > Convert to Mesh

f:id:hiyokosabrey:20211009001326p:plain

 

この操作をした直後に、オプション設定のポップアップが画面左下に出るので、

その中にある Keep Original を有効にすると、カーブをバックアップできます。

f:id:hiyokosabrey:20211009003004p:plain

f:id:hiyokosabrey:20211009003320p:plain

 

コンバートしても見た目に変化しないので、EditModeに切り替えます。

f:id:hiyokosabrey:20211012002447p:plain

 ↓頂点をすべて選んだ状態。

f:id:hiyokosabrey:20211012002302p:plain

頂点の数が結構多い印象だけど、後で減らすのでひとまずこれで進めます。

画像がちょっと分かりにくいので下敷きはいったん非表示で説明していきます。

f:id:hiyokosabrey:20211012010406p:plain

 

まだ、頂点とエッジ(頂点同士を結ぶ線)しかないので、面を張ります。

 

頂点すべてを選択した状態でヘッダーメニュー Face > Fill

f:id:hiyokosabrey:20211009004219p:plain

Fill のショートカットは [ Alt ] + [ F ]

f:id:hiyokosabrey:20211012004831p:plain

たくさんの三角形ポリゴンで面を構成されています。

おそらく計算やデータの順番やらいろいろな処理の効率が最大になるよう考慮して三角形分割されてると思うので、人間が手で分割するよりは無駄がない、はず。

 

ここまでくると頂点を減らすモディファイアが使えるようになります。

f:id:hiyokosabrey:20211009102746p:plain

モディファイアは、例えるならPhotoshopのレイヤー効果みたいな位置付けのものです。元のオブジェクトを非破壊なまま、さまざまな形状、状態に変化させてくれるという大変ありがたい存在。パラメータ調整で最終結果をいつでも確認できるので重宝します。

今回使うモディファイアは、Decimate

f:id:hiyokosabrey:20211009094707p:plain

 

f:id:hiyokosabrey:20211009102219p:plain

ObjectModeで確認しながら減らすことができます。

上図の設定パネルから Ratioを調整します。Ratioのところにある棒グラフの先端付近をマウスで左右にドラッグするとリアルタイムに頂点数が変化します。

f:id:hiyokosabrey:20211012005211p:plain

Convert to Mesh したときの 96頂点 から 34頂点 に減らしてみました。

下絵を表示してみます。

f:id:hiyokosabrey:20211012005331p:plain

大丈夫そうです。ここでハミ出していてもあとから簡単に調整できます。

 

さて、このポリゴンに対して、縁取りをつくります。

次に進む前に、モディファイアを適用する必要があります。

f:id:hiyokosabrey:20211009104231p:plain

これで形状をFIXできます。

 

ちなみに上図の の右にある × ボタンをクリックすると、モディファイアを破棄して、なかったことにできます。「レイヤースタイルの破棄」みたいなものです。

f:id:hiyokosabrey:20211009105116p:plain

これで後戻りはUndoのみ。

 

EditModeで頂点すべてを選択した状態でヘッダーメニュー Face > Inset Faces

f:id:hiyokosabrey:20211009004219p:plain

Inset Faces を選択したら、クリックしないようにマウスを移動(ドラッグしない)させて幅を検討します。

f:id:hiyokosabrey:20211009105748g:plain

このとき、なんだか幅が均等じゃないな思ったら、カーブが歪んでいた可能性があります。

f:id:hiyokosabrey:20211009144156p:plain

真横から見てまっすぐになっていない場合に、縁取りが不均一になります。

ObjectModeで、スケールを 0 (上図の場合青い軸線方向につぶすので Z軸を 0)にしてつぶしてからヘッダーメニュー Object > Apply > Scale

 

これでOK、となったらクリックしてFIX。

適当にクリックしても、直後であれば詳細設定のポップアップが出ているので、そこで微調整できます。

f:id:hiyokosabrey:20211009125738p:plain

Thicknessが縁取りの太さです。フォームの上でマウスでドラッグが便利。

Select Outer にチェックをつけるとハイライトされているポリゴンが反転します。

f:id:hiyokosabrey:20211009130432p:plain

ポップアップ以外をクリックすると完全にFIXします。それまでは自由に調整できます。

f:id:hiyokosabrey:20211012010103p:plain



 

縁取りのポリゴンを選択した状態で『UV展開』します。

こういった 『ぺらい』メッシュだと、UV展開という言葉がしっくりこないのですが、各頂点ごとの、テクスチャUV座標を決める操作のことを指して言う言葉だと、覚えておくといいですよ。

 

トップメニューにある UV Editing ボタンをクリックして、ビューポートのレイアウトをUV編集レイアウトに切り替えます。

f:id:hiyokosabrey:20211009132243p:plain

右側のビューポートが、デフォルトな感じに戻された場合は、テンキー[ 7 ] を押して、[ 5 ]キーで平行投影にしたり、ワイヤーフレーム表示にしたりして、見た目を整えます。

 

ポリゴンの選択が外れてしまったときは、

f:id:hiyokosabrey:20211009134001p:plain

編集対象をポリゴンにして、

f:id:hiyokosabrey:20211009134308p:plain

ひとつだけ選択します

f:id:hiyokosabrey:20211009134350p:plain

ヘッダーメニューの Select > Select All by Trait > Faces by Sides

f:id:hiyokosabrey:20211009142714p:plain

f:id:hiyokosabrey:20211009143153p:plain

全部のポリゴンを選択していても特に問題はないのですが、この操作を覚えておくと後でラクができます。

 

ヘッダーメニューから UV Unwrap

f:id:hiyokosabrey:20211009141644p:plain

UVエディタが下のようになります。

f:id:hiyokosabrey:20211009145629p:plain

まだ、何もテクスチャを読み込んでいないので、デフォルトの正方形のイメージが表示されています。

90度回った状態になるのですが一旦置いておいて、テクスチャを読み込みます。

テクスチャを読み込んでから、Unwrap する方が手間が減っていいのですが、UV座標の特性を説明したくてこのような流れにしています。

 

UVエディターのヘッダーメニューにある +New ボタンの左側にあるプルダウンからテクスチャ画像を選択。下絵としてドロップした画像がリストアップされているはずです。

f:id:hiyokosabrey:20211012232037p:plain

プルダウンリストの中に見つけられなければ、Open ボタンから探して読み込みます。

 

f:id:hiyokosabrey:20211012232608p:plain

アスペクト比が変わったので変形してしまいました。

これがUV座標空間の特徴です。

最初に Unwrap した際に展開したUV座標から何も変わっていないのです。

UV座標は、座標と言いつつもテクスチャの形状に関係なく、端から端までを0~1.0 で扱います。

f:id:hiyokosabrey:20211012234001p:plain

※環境によっては、左下が 0原点で扱われることがあります

 

このため、テクスチャのアスペクト比が変わると、変形してしまうのです。

メッシュの形には影響しませんが、テクスチャ作成がちょっと面倒なことになります。

 

余談ですが

この特性を利用すると、プラットフォーム等による解像度の変更作業がとても簡単になります。

例えば 2Kで作ってきたところで、あとから4K対応することになった場合。

テクスチャの解像度を変えるだけで対応完了です。スプライトのようにピクセル座標で管理していると、大変な手間になります。

※エディタ上ではピクセル座標は整数で扱いつつも、内部のデータではUV座標という開発環境もあると思われるので確認は必須

いくらUV座標が効率的とはいえ、小数を扱うので、苦手な人は辛いかもしれません。

 

 

さて、変形した比率を正常なアスペクト比にします。

UVエディターで作業します。

ここで頂点をすべて選択して [ S ]キーを押すか、

Scaleボタンをクリックするとスケール調整モードになります。

f:id:hiyokosabrey:20211013000913p:plain

[ S ]キーを押した場合はマウスを動かすだけでとサイズが変更できます。操作パネルからスケール調整モードにした場合は、マニュピレーターをドラッグします。

ここはアナログな調整ではなく、数値でサクッとリサイズします。

スケールを少し触ってクリック(マニュピレータの場合はマウスボタンから指を離す)すると、UVエディタのビューポート左下に Resize のポップアップが出るので、そこで数値を入力します。

f:id:hiyokosabrey:20211010000357p:plain

Scale X を 0.5 にして YとZ は 1.0 にします

f:id:hiyokosabrey:20211009234931p:plain

f:id:hiyokosabrey:20211013000607p:plain

 

 

つぎに [ R ] キーを押すか、Rotateボタンを押して回転モードにします。

f:id:hiyokosabrey:20211013001317p:plain

これもスケール同様にして操作すると Rotate のポップアップが出ます。

-90 と入力すると元の向きになります。

f:id:hiyokosabrey:20211010000916p:plain

f:id:hiyokosabrey:20211013001948p:plain

 

あとは、テクスチャのデザインに合うようにサイズと位置を調整します。

[ S ]キーで スケール

[ G ]キーで移動

[ホイール] ズームイン/アウト

[中ボタン]ドラッグでスクロール

  ※Blenderのデフォルト操作設定

 

f:id:hiyokosabrey:20211013003317p:plain

 

完成まであと少し。

 

 

 

 

縁取りを除いた中身をほったらかしにしてるので、残りの頂点をUV展開します。

3Dビューポート側のヘッダーメニューから Select > Invert

f:id:hiyokosabrey:20211009142714p:plain

で選択箇所が反転します。

f:id:hiyokosabrey:20211010003102p:plain

再び  UV > Unwrap

f:id:hiyokosabrey:20211009152925p:plain

f:id:hiyokosabrey:20211014001620p:plain



この頂点をマウスドラッグで矩形選択して、[ S ]キーで適当に小さくします。

f:id:hiyokosabrey:20211014001836p:plain

 

これも Resize のポップアップから、Scale X と Y に数値を入力。

f:id:hiyokosabrey:20211010003737p:plain

スケールを ゼロ にすると 1点に集約されます。

f:id:hiyokosabrey:20211014002123p:plain

これを、邪魔にならない場所に移動します。[ G ]キー

f:id:hiyokosabrey:20211014002135p:plain

メッシュはこれで完成です。

 

FBXとかで書き出してエンジンに持っていくことができます。

 

UVが思った通りにあたっているか、確認しておきます。

まずシェーディングタイプをマテリアルにします。

f:id:hiyokosabrey:20211014003103p:plain

f:id:hiyokosabrey:20211014012602p:plain

マテリアルがアサインされていないので、生ポリゴンの状態です。

 

新しいマテリアルをアサインします。

f:id:hiyokosabrey:20211014012450p:plain

Base Color のところにある 黄色の丸をクリック ③

f:id:hiyokosabrey:20211014013657p:plain

ポップアップウィンドウが出てくるので、Image_Texture を選択 ④

f:id:hiyokosabrey:20211014013946p:plain

表示内容が変化するので、UVエディターのときと同様に、プルダウンからテクスチャ画像を選択します ⑤

f:id:hiyokosabrey:20211014014231p:plain

 

f:id:hiyokosabrey:20211014014657p:plain

デフォルトのマテリアルとシェーダーで描いているので色味がおかしいですが、ここではUVが正しく展開できているかが大事なので、歪みが出たりしていなければOK。

 

メッシュはこれで問題なくエクスポート(書き出し)できます。

エクスポート方法については、開発環境に依存するので、今回説明は省かせていただきます。

 UE4とUnityは、FBXをサポートしているので、ぼくはFBX形式で書き出します。

 

残るはテクスチャ。

テクスチャに、メッシュで使用するUVの範囲をわかるようにしておくと、ギリギリまでスペースを使うことができます。

うっかりUV展開している範囲に他の余計なピクセルが侵入しないようにしたいので、UVレイアウトを画像で書き出す機能を利用します。

 

UVエディタ上で、UVの頂点を選択した状態で、

f:id:hiyokosabrey:20211015001333p:plain

UVエディタのヘッダーメニューから UV > Export UV Layout

f:id:hiyokosabrey:20211009153038p:plain

ファイル書き出しのダイアログが出るので、指定した場所にそのままPNGフォーマットで書き出します。

f:id:hiyokosabrey:20211009154612p:plain

 


この書き出した画像をPhotoshopで開きます。

f:id:hiyokosabrey:20211015001802p:plain

半透明なのと黒色で分かりにくいですが、このレイヤーをテクスチャ用のドキュメントに移植します。

Photoshopでドキュメント間でレイヤーを移すとき、

[ Ctrl ]+[ Alt ]+[ Shift ]を押しながらドロップすると、まったく同じ位置に配置できます。

f:id:hiyokosabrey:20211015003158p:plain

           ※UVレイアウトの画像が見えにくいのでカラーを反転しています

 

f:id:hiyokosabrey:20211015004752p:plain

ぴったり。同じサイズのドキュメント間で有効な隠し技です。

 

このUVレイアウトを避けてさえいればぎりぎりまで使えます。

書き出す際は、レイヤーを非表示にします。

 

仕上げに圧縮対策をします。

アルファチャンネルで透明になるピクセル付近のカラーを広げて塗りつぶしておく感じで。

↓今はまだ周りに何もないので手を抜いて矩形で塗ってる状態。

f:id:hiyokosabrey:20211015005438p:plain

RGBチャンネルは ↑

アルファチャンネルは ↓

f:id:hiyokosabrey:20211015005807p:plain

これでテクスチャも用意できました。

 

 あとは、エンジンでマテリアルとかシェーダーを用意してくっつければ画面に表示できると思います。

 

f:id:hiyokosabrey:20211015021950j:plain

f:id:hiyokosabrey:20211015231904j:plain

 

 エンジンの環境によっては、描画のタイミングや思ったような色にするのに設定が必要な場合もありますが、結構手軽に表示させることができます。慣れてくると5分もかからないです。マテリアルやシェーダーについては、一度汎用的なのを用意すれば、特殊なことをしない限り使いまわせます。

 インポートやエクスポートの方法については、エンジンや開発環境に依るところが大きいので書くのをやめました。DCCツールに書き出すためにスクリプトを用意する開発現場もあるかと思います。余計なデータをくっつけて書き出さない、余計なデータを取り込まない、というのに気を付けて、パラメータやスイッチ等のパラメータを試行しながら最適な手順を見つけることになると思いますが、UIの場合アニメーション関連(スケルトンとかボーンとか)は不要でいいと思う。マテリアル関連も、エンジンで組むのでそれほど必要になったことはないかな。

 

 ちょっとしたUIパーツを、わざわざ3Dメッシュで作るのは、手間が増えるだけなので、オススメはしませんが、見た目に驚きを与えたり、データ効率が良くなるのであれば、技術習得も兼ねて積極的に使っていきたいですね。

 

今回は以上になります。

次回は、カーブを使わずに四角形を分割しながら作る方法か、カーブで作ったゲージのどちらかを書いてみようかと考えています。

 

ではでは

素敵なメッシュUIライフを!