投稿者: 忍野 拓

LightWaveで二次元キャラ系人物モデリング奮闘記 ―ボーンウェイト編―

最終更新：2016/09/06

ウェイト・マップと一口に言っても用途は多岐にわたるので、ボーンが移動又は旋回することによってモデルが変形する影響範囲を決めるウェイト・マップをボーン・ウェイトと呼ぶことにする。

ウェイトの設定には「マップ」メニューグループにあるVertex Paintを使用する。簡単なウェイト・マップの設定の場合は同じグループのエアブラシツールやMAP値指定などを使用して設定していくこともできるんだけど、それらのツールは結果がプレビューに反映されるまでに時間がかかり、関節が多く多数のボーン・ウェイトを調整しなければならない人物モデルの場合は作業効率が悪く、微調整くらいにしか使えない。

Vertex PaintがあるおかげでLightWaveはなんとか実用的な3DCGソフトウェアとしての地位を保っていられると言っても過言ではない。古いLightWaveではボーンの組み込みはレイアウトで一発勝負だったため、左右の足のボーンの影響範囲がお互いに干渉し合わないように保険をかける意味で大の字型に人物モデルを作らなければならなかったりなど、今では笑ってしまうような苦労が多かった。

もっとも、そのVertex Paintも動作を軽くするためにサブパッチを適用した状態での表示ができず、厳密を期そうとすればするほど熟練を必要とし、最後にはやはり勘に頼らざるを得ないところが欠点と言えば欠点。サブパッチ適用後の状態を想像しつつトライ・アンド・エラーで補うより他にない。それでも、Vertex Paintがなかった頃よりはセットアップは遥かに楽になった。

ボーン・ウェイトの自動算出

何はともあれVertex Paintを起動する。表示モードは「Weight Value」にし、「Weight」タブを選択する。透視投影の「Pers」モードよりは平行投影の「Ortho」モードのほうが細部は見やすいかもしれない。モデルにはまだウェイトが設定されていないので全体が灰色で表示される。

Weight000

今回扱っているモデルにはIK用のものも含めて68本のボーンが組み込まれていて、ひとつひとつ手作業でウェイトを設定していくのは非常に骨が折れる。そこで、ある程度まではボーンの情報を元にVertex Paintに自動でウェイトを計算してもらう。「Calc」タブでフォールオフを「Distance ^ 32」に設定し、「Calculate Weights」ボタンをクリックするとすべてのボーンのウェイトが計算され、ボーンと同数だけのウェイト・マップが作成される。

Weight001

ウェイトが設定された箇所は赤く染まる。ただし、ウェイトを算出するとすべてのボーンのウェイトが再設定され、手動で設定したウェイトは失われてしまうという点には注意しなければならない。

ボーン・ウェイトの手動修正

まずは小手調べにRootボーンのウェイトを変更する。

Weight002

Rootボーンはモデルの変形には関係がないので、ウェイトを消してしまう（消さなくても特に問題にはならないけれど）。「Paint」タブを選択し、「Operation」を「ERA」にして赤い部分をマウスでなぞってみる。ウェイトは頂点に設定されるものなので、頂点付近をなぞると赤い部分の面積が少なくなっていく。グラデーションはあくまでも目安で結構いい加減なので、面の色よりもどの頂点までウェイトの範囲が及んでいるかに注目してペイントするようにする。

Weight003

ペイント・オペレーションには5種類あり、動作は次のとおり。

  • ADD
    加算オペレーション。元のウェイト値にValueで設定したウェイト値を足す。
  • SUB
    減算オペレーション。元のウェイト値からValueで設定したウェイト値を引く。
  • REP
    置換オペレーション。元のウェイト値に関係なく、Valueで設定したウェイト値で置き換える。100%など一定の値で塗りつぶしたい時に便利。
  • ERA
    消去オペレーション。元のウェイト値に関係なく、Valueで設定したウェイト値で塗りつぶす。普通は「0%」に設定して使う。REPオペレーションで「0%」を指定しても同じ。
  • OVR
    上書きオペレーション。Valueで設定したウェイト値が元のウェイト値を上回っている場合だけValueのウェイト値で上書きする。使いどころがあまりない。

Strengthなどの設定はエアブラシのように少しずつペイントしていくためにあるものだけど、RGBAの4チャネルで設定した色をブレンドしていくカラー頂点マップとは異なり、ボーン・ウェイトではパラメータがひとつなのであまり意味がない。

なお、「Brush Size」の隣りにある「Front」ボタンをトグルしてオンにしておくと表面に見えている側だけペイントされる。オフにしていると直接見えていなくてもブラシの範囲内に入った頂点はすべてペイントされる。

「Object」の隣りにある「Save」ボタンをクリックすると実際にモデルのボーン・ウェイトに反映される。ウェイトを変更している状態でVertex Paintを終了しようとすると次の画像のような確認ダイアログが表示される。ここで「Yes」を押せば同様にボーン・ウェイトに反映されるけど、変更の反映は「Save」ボタンで、変更を破棄したい時はダイアログで、と使い分けるようにしておくとうっかり大事な変更を破棄してしまったり、必要ない変更を反映してしまったりするミスを防げる。

Weight004

Vertex Paintが終了したら、モデラーウィンドウ右下の「W」ボタンを押し、頂点マップ名を選択するとボーンと同名のマップが大量にできているはず。

可動部分のボーン・ウェイトの修正例

ひとまずボーン・ウェイトはできたけれど、あくまでも自動算出なので必ずしも想定どおりのウェイトになっていないことがある。ここでは左肩を例にあげてウェイトを修正する。

左上腕のボーンを選択し、スケルゴン回転（Rotate Skelegon）でヘディングを適当な角度まで回して腕を降ろしてみる。サブパッチ適用状態でマウスのドラッグで回転させようとすると動作が重いので、数値入力ウィンドウ（Nキー）を利用するといい。

Weight005

左腕を降ろしてみたところ、次の画像で赤い矢印で示した部分に不具合があった。まず、髪の毛にも左上腕のボーン・ウェイトが影響してしまっていて、想定外の膨らみができている。次に、肩章にあたる部分が強く引っ張られて伸びきってしまっている。伸縮性の高い素材という設定なのであればこれでも問題ないけど、制服のようにほとんど伸び縮みしない服装の場合は型崩れと捉えられる。更にもっと問題なのは、ジャケットの脇に大きな陥没が生じていてインナーが見えてしまっている。重ね着はこのような問題を生じることがあるため、できる限り避けたほうがいい。場合によってはインナーは襟と裾を残して際どいところは削除してしまったほうがいいかもしれない。

Weight006

アンドゥ（Ctrl+Z）でスケルゴン回転を元に戻し、再度Vertex Paintを起動する。スケルゴン回転を元に戻さないとスケルゴンが回転したままのモデルが表示されるので注意。左上腕のボーンを選択し、Shift+Aで当該ボーンを中心にして拡大する。確かにボーン・ウェイトの範囲がかなり広いことがわかる。髪の毛にもうっすらではあるけど赤い範囲がある。

Weight007

Ctrlキーを押しながら赤いリングを掴んでボーンを回してみる。LightWaveでは赤リングはヘディング（H）、緑リングはピッチ（P）、青リングはバンク（B）と統一されているので、この際レイアウトに移る前に覚えてしまったほうがいい。

プレビューで確認済みだけど、肩章が肩に食い込むように大きく沈み込んでいるのがわかる。髪の毛の変形やジャケット脇の陥没も見受けられる。この状態でサブパッチがかかった状態を容易に想像できるようになれればいいんだけど、慣れが必要なのでVertex Paintの起動と終了を繰り返すことになるのは最初のうちは仕方がない。

Weight008

ひとまず、肩章の端に設定されているウェイトを消去して所定の場所に戻す。ボーン・ウェイトを消去する度に変形が復元されていく様子は少し面白い。

Weight009

左上の「Edit」ドロップダウンメニューから「Reset All Bones」を選ぶか、Shift+Rでボーンを最初の位置に戻せる。ジャケット脇を陥没させた原因になっていたウェイトも消去すると同時に、左上腕のボーン・ウェイトの範囲を狭くする。ボーンを回してみて、様子を見ながら袖のポリゴンがジャケットにめり込まない程度にウェイトを少し足しておく。ほんの10%程度なので、スクリーンショットではわかりづらい。

Weight010

右側へのボーン・ウェイトの複製

左上腕のボーン・ウェイトが設定できたので、右上腕にウェイトを複製する。「Edit」ドロップダウンメニューから「Copy」を選ぶか、Cキーでボーン・ウェイトをコピーする。

Weight011

右上腕のボーンを選択する。ボーンを回すまでもなく、左上腕のボーン・ウェイトと同様の問題が起こっているのがわかる。

Weight012

左上腕のボーン・ウェイトを左右反転してペーストする。「Edit」ドロップダウンメニューから「Paste -X」を選ぶか、Shift+VでX軸対称ペーストができる。

Weight013

左上腕のボーン・ウェイトが右上腕のボーン・ウェイトにも反映された。ただ、右上腕のボーン・ウェイトはジャケットの襟も巻き込んでいるようなので、ERAオペレーションで消去しておく。

Weight014

ボーン・ウェイト修正の確認

「Save」でボーン・ウェイトをモデルに反映し、Vertex Paintを終了する。再度、スケルゴン回転で左腕を降ろしてみる。今度は髪の毛の変形、肩章の異常な伸長、ジャケット脇の陥没は見られなくなった。脇が若干苦しいけど、これ以上はボーン・ウェイトでなんとかするのは難しそうなので、どうにもならなくなった時はジャケットのオブジェクトを再検討して修正したほうが良いような気がする。

Weight015

このような作業を繰り返して全身のボーン・ウェイトを設定していくわけだけど、慎重な設定を要求されるのは可動範囲の広い肩関節と股関節くらいで、膝、肘、指など曲げ伸ばしが特定の方向のみに決まっている部分は最初の自動算出の時点で大体できてしまっている。

途中経過

ボーン・ウェイトの設定が終わってしまえばリギングはほとんど終わったようなもの。レイアウトでのIKの設定をしなくても次の画像のような簡単なポーズをとらせることはできる。ひとまず両手を水平に広げて両足を揃えた棒立ちの状態からは卒業できた。

Weight016

補足

話が混乱するのでボーン・ウェイトのみに絞って書いたけど、ウェイト・マップの応用範囲は広い。これまでにも軽く触れてきたエッジ・ウェイトやサブパッチ・ウェイトの他にも、軟体シミュレーションであるSoftFXを利用してプルプル震えるゼリーを作ったり、布地シミュレーションであるClothFXを利用して足の動きには影響されるけどボーン・ウェイトだけでは実現が難しいスカートの「裾捌き」の再現などの物理演算の影響範囲をウェイト・マップで文字通り「重み付け」することができる。

また、グラディエント・マップにウェイトを入力してサーフェースの各種パラメータに変化を加えることもできる。例えば、自己発光度にウェイトを入力することで、同一のサーフェースを割り当てられた平面上にありながら自己発光度の輝度が異なる部分を作ることができる。そうすることによって、電球のような発光体を奥に仕込んだり、半透明のポリゴンの屈折率を設定したりといった微細な加工を簡略化できる。大きく拡大して見ることが少ない灯火類や人型ロボットの目などの細かな部分に有効。

関連記事

参考記事

LightWaveで二次元キャラ系人物モデリング奮闘記 ―ボーン編―

最終更新：2016/09/06

これからリギング作業を始める。一口にリギングと言ってもどこからどこまでをそう呼ぶのか解釈のわかれるところだろうけど、ボーンの作成、ウェイト・マップの設定、IKの設定などをひとまとめにしてリギングと呼ぶことにする。

最初に、ボーンを組み込む。LightWaveではモデラーにおけるボーンを「スケルゴン（Skelegon）」と呼んでいて、スケルトン（Skeleton）とポリゴン（Polygon）を合わせた造語らしい。スケルゴンはLightWaveモデラーではポリゴンの扱いになっていてポリゴン選択モードで選択でき、また、2頂点の線ポリゴンに分類されている。モデラーでのボーンの呼称が別に必要になったというのが主な理由なんだろうと思うけど、古いバージョンのLightWaveでは決して操作性がいいとは言えないレイアウトでボーンを目分量で組み込んでいく職人技のような作業が必要だったため、ボーンの精密な設計をある程度モデラーでしておくことができるようになったのは大幅に改善された点と言える。

LightWaveでは「ボーン」と「スケルゴン」は厳密な意味では異なる概念だけど、一般的な呼称ではないのでコマンドなどの固有名詞を除いては極力ボーンで統一していく。

首の接合

これまでずっと保留にしてきた頭と首の接続を行う。頭か体のどちらかに問題が出た場合を想定していたわけだけど、結局大きな問題は発生しなかった。もっとも、深く考えずに頭をボールから作ったことによって顎の先端にトポロジーが集中してしまっている問題は残っているけど、これといった解決策も見つからなかったし、ここへ来ての作り直しというのも気が向かなかったというのもある。

Bone000

首側と頭側のエッジの数が合わなかったので、少々強引だけど首側のエッジを分割して接続してある。なお、頭側と首側の接続部にある向かい合わせのポリゴンは削除してある。

Bone001

基幹ボーンと背骨から頭のボーンの組み込み

体のオブジェクトがあるレイヤーを背景レイヤーに設定し、新しい前景レイヤーにスケルゴンを作成する。最終的には体のオブジェクトのレイヤーと統合するので同一レイヤーにスケルゴンを追加していってもいいんだけど、体のオブジェクトが邪魔になることが多いし、LightWaveの仕様上、体のオブジェクトをマスクすることもできないので別のレイヤーで作成して後で統合したほうが操作性は良い。

最初にすべてのボーンの中心になる基幹ボーンを組み込む。「セットアップ」メニューグループにあるスケルゴン作成（Draw Skelegons）でX軸方向からYZ平面を見るビューで背中側の任意の点から左ドラッグで体の中まで引く。最初のボーンだけはドラッグで作らないと長さが0のスケルゴンができてしまうことになるので、細かい調整は後ですることにして一気に引き切る。

Bone002

後は、左クリックで連続してボーンを作成していくことができる。まずは背骨にあたるボーン群を下から順に組み込む。背骨は胴体の後ろ寄りにあることをイメージしながら位置を決めていく。

人体の背骨は全部で30個の椎骨から成り立っていて、ボーンの数を増やせば増やすほど滑らかな旋回が可能になるけど、ヘビやタコのようなモデルを作る場合でない限り、実際にはそこまで細かくする必要はない。あまりボーンの数を多くするとウェイト・マップの設定が大変になるので、首、胸、背中の3つか4つくらいで十分。首の先に頭に相当するボーンを加えてひとまずスケルゴンの作成を終了する。

なお、頭のボーンは頭のモデルを貫通するくらい長くしておく。ウェイト・マップの範囲はボーンの長さに影響を受けるので、頭のギリギリの長さにしてしまうと、頭の一部や髪の毛などがボーンの旋回に追従してこなくなることがある。

Bone003

すぐに手足のボーンの作成に移っていってもいいんだけど、練習の意味も兼ねてボーンに名前を付けるためにスケルゴンエディターを起動する。スケルゴンエディターは重要な機能の割に「その他」のサブグループに入っているので、メニュー編集で表に出しておくか、元のメニューを変更したくない場合はユーザーメニューグループに追加していつでも使えるようにしておく。

スケルゴンエディターを起動すると、親子関係を持ったボーンが5つできている。名前はモデラーが機械的につけたものなので、これを右クリックで「名称変更」を選択し、ひとつずつ名前をつけていく。

Bone004

ひとまず、次の画像のように名前をつけた。ボーンの名称に限った話ではないんだけど、LightWaveで日本語用の2バイトや3バイト文字を使用すると文字化けを起こしてトラブルの元になるので、必ず半角英数字で名前をつける。英語が苦手ならローマ字でも問題ない。要は後で自分がわからなくならないような命名を心がけるということ。

Bone005

腕から手のボーンの組み込み

腕のボーンを追加していく。枝分かれさせる箇所の親になる胸のボーンを選択し、スケルゴン作成を選択する。

Bone006

次の画像のように左クリックで肩のボーンを枝分かれさせて追加できる。肩口と手首にごく短いボーンをひとつずつ追加しておく。これらはIKに使用するもので、モデルの動きには直接影響しない。

Bone007

肩、肩口IK、上腕、下腕、手首IK、手（小指の根元）、小指1、小指2、小指3と関節ごとにボーンを追加していく。

Bone008

ここまで作成できたら、胸のボーンを枝分かれさせた時と同様の方法で手首IKのボーンを選択し、薬指のボーンを枝分かれさせて追加していく。小指のボーンをコピーして薬指から人差し指までのボーンを作成し、後で手首IKのボーンにポイントの統合ツール（Ctrl+W）で接続してもいいけど、指の長さや位置はそれぞれ少しずつ異なり調整が必要になるため、一本ずつボーンを作成していくのとそれほど手間は変わらない。

Bone009

次の画像が腕から指先までのボーンを作成し終わった状態。画像では上から見た状態しか示していないけど、パースビューを利用してちゃんと腕や指の中にボーンが入っているかどうかよく確認する。親指は関節が他の指よりひとつ少ないので余計なボーンを作ってしまわないように注意。

Bone010

片腕のボーンの作成が済んだら、再びスケルゴンエディターで各ボーンに名前をつける。左腕なので、すべてのボーンの名称の末尾に「_L」をつける。

手は人間の骨格の中でもっとも複雑な動きをする場所でもあり、3DCGでも細かい部分の割にもっとも多くのボーンを必要とする箇所。指のボーンが非常に多くて名前に困るかもしれないけど、ここは番号で管理したほうが簡便。医学的には親指を「第一指」、人差し指を「第二指」、中指を「第三指」、薬指を「第四指」、小指を「第五指」と呼ぶので、それぞれ「Finger1」、「Finger2」、「Finger3」、「Finger4」、「Finger5」と名付けた。指の関節は医学的には指先のほうから第一関節、第二関節、第三関節と呼ぶけど、スケルゴンツリーで並べた時に数字が逆転してしまうので、手首に近いほうから1、2、3と付けた。

Bone011

足のボーンの組み込み

片腕のボーンの命名が済んだら、足のボーンを組み込む。左腕のボーンを作成したならば左足のボーンを作る。最初に作成した基幹ボーンを選択する。

Bone012

次の画像のようにスケルゴン作成で下向きにボーンを追加する。これが腰のボーンになる。

Bone013

更に股関節、大腿（ふともも）、脛（すね）、足首IK、足、爪先、爪先IKと連続してボーンを追加していく。足の指を個別に管理する必要が発生することは滅多にないため、足首から下のボーンは1本のツリーで簡単に設定する。

Bone014

この時注意しなければならないのは、膝にあたる、ふとももとすねのボーンの接続部には少しでもいいので角度をつけておくこと。完全にまっすぐに接続してしまうとIKを使おうとした時に関節が反対側に曲がってしまって骨折したようになってしまうことがある。これはLightWaveに限った話ではなく、すべての3DCGソフトウェアで共通とされているボーン設定の注意事項のひとつ。

実は肘にも同じ事が言えるんだけど、手は実質上宙に浮いていてIKの設定次第でどうにかなるのに対し、地面と胴体の位置関係でしゃがんだりジャンプしたりといった動作にIKを使う足は設定だけではどうにもならないことがある。IKなんて面倒くさい機能は使わないということであれば問題ないんだけど、関節の多い人体モデルをFK（キーフレーム）だけで管理するのはそのうち嫌になってくるはず。

スケルゴンエディターで足のボーンにも名前をつける。左足なので左腕と同様に末尾に「_L」をつけるのを忘れないように。最後にスケルゴンツリーで名前のつけ忘れがないか確認する。

Bone015

反対側の手足のボーンの複製

左腕と左足ができたら、それらに属するすべてのボーンを選択し、鏡面Xで右側に複製する。

Bone016

右側のボーンは背骨のボーンに接続されていないので、胸のポイントを選択し、ポイントの結合ツール（Mキー）か統合ツール（Ctrl+W）で肩のボーンの根元と胸のボーンの先端を接続させる。背骨は横から見たビューで作成しているのでX座標は0になっているはずだけど、何らかの理由で0になっていない場合は整列ツールで揃える。

Bone017

同様に、右股関節を腰のボーンに接続する。

Bone018

右腕と右足のボーンは左側のものをコピーして作ったものなので、ボーンの名前は左と同じになっている。そこで、スケルゴンエディターを使って一括で名前を変更する。右腕にあたるボーン群をすべて選択し、「操作」タブから「接尾辞を削除」を選択し、番号に「2」を入力する。「適用」ボタンをクリックすると、末尾2文字の「_L」が選択したすべてのボーンの名称から削除される。

Bone019

ボーンの選択を解除せずに、「接尾辞を追加」を選択し、名称に「_R」を入力する。「適用」ボタンをクリックすると、選択したすべてのボーンの名称に「_R」が追加される。

Bone020

同様にして右足のボーンも改名しておく。「接頭辞」と「接尾辞」を間違いやすいので注意したい。

スケルゴンエディターはこのように大量のボーンを操作するのに非常に有用で強力なツールなんだけど、逆にボーンひとつだけを改名したい時に現在の名称を表示してくれなくてファイルの改名のようにちょっとした追加や削除ができなかったり、少々不便なところもある。スケルゴン名変更ツールではそういった問題はないので微妙なところでかゆいところに手が届かない感じもするんだけど、スケルゴンツリーを眺めながらミスがないかを確認しながら操作できるという点ではスケルゴンエディターのほうがやはり便利ということになる。

ねじれ補正

最後に、すべてのボーンを選択し、「バンク」タブを選択する。「種類」を「-Zに整列」に設定し、「OK」ボタンをクリックする（「+Zに整列」でも可）。作成したばかりのボーンはバンク角がまちまちで、これをやっておかないと、レイアウトでヘディングやピッチを同じ角度だけ旋回させたのに左右で違う方向に向いてしまうといったトラブルが起こる。そのトラブルを回避するための手順。

Bone021

以上でボーンの作成は終了。せっかく作ったボーンの情報が失われてしまわないうちに、ファイルを保存する。

オブジェクトの準備

次に、ボーンで変形させたいオブジェクトを加工する。ウェイト・マップの設定が煩雑になるため、基本的に見えていないポリゴンはバッサリ削る。重ね着になっているところなどもできる限り二重や三重にならないようにする。ゲーム用のローポリゴン・モデルなどで体のラインにピッタリのボディスーツ状の衣装がよく用いられるのはポリゴンの節約と同時にウェイト・マップの簡略化の意味合いが強い。

Bone022

もったいないようだけど、次の画像のように上半身のほとんどと上腕まで、足首から下を削除する。もちろん、後で調整が必要になった場合のことを考え、完全な状態の体のモデルのバックアップは別のレイヤーにとっておくようにしたい。

Bone023

ボーンを作成したレイヤーから主ボーンをコピーし、加工済みのモデルに貼り付ける。切り取りはしないほうがいい。場合によっては複数のレイヤーに分けてウェイト・マップを設定したほうがいいこともあるため、主ボーンの本体をいきなりモデルに埋め込んでしまわないほうがいい。

体の一部がないのでなんとも間抜けな姿だけど、体のオブジェクトにボーンを組み込んだのが次の画像。レイアウトではモデルと同一レイヤーに存在するボーンが読み込まれるので、必ずボーンとモデルは同じレイヤー上に存在しなければならない。

Bone024

服を加工し、同一レイヤーにコピーする。服の裏地はほとんど要らなくなるので、見えるか見えないかギリギリのところまで削る。場合によっては袖口などは適当なポリゴンで塞いでしまう。髪の毛や靴など必要なものはすべてコピーして同一レイヤーにまとめる。

Bone025

以上でウェイト・マップの設定の準備ができた。ここまでできたところでボーンの作成完了。

最後に、足りないボーンがないかどうかよく確認する。と言うのは、レイアウトでスケルゴンをボーンに変換してしまった後でボーンが足りなかったことに気付いたとしても、モデラーでスケルゴンを編集しただけではレイアウトには反映されないばかりか、再度スケルゴン変換を行うとまったく同じ位置にボーンが二重にできてしまうことになり、非常に面倒なことになる。IKは面倒だからとIKを考慮しないボーンを組んでおいて、後でやっぱりIKを使いたくなったから追加したいというのは困難だということ。不可能とまでは言わないけど、せっかく設定したボーンやウェイト・マップをすべて破棄しなければならず二度手間になる。モデラーにおけるスケルゴンとレイアウトにおけるボーンの概念が独立していることによる最大の問題点がここにあり、アニメーション作成におけるLightWaveの地位が大幅に後退した原因になっているわけだけど、人体モデルの関節が急に増えたり減ったりすることはないのでボーンの設計は周到にしておくに越したことはない。

ボーンの分割

ボーンを作成していて、うっかり必要なボーンを作り忘れてしまった場合は、ボーンの分割を行うと解決できる。次の画像で示している例は、手首IKのボーンを作り忘れてしまった場合。分割したいボーンを選択し、「セットアップ」メニューグループにあるスケルゴン分割（Skelegon Split）を選択する。

Bone026

スケルゴンの分割を行うと、ちょうど半分のところに新しいボーンが作成されるので、位置や長さを調整する。ボーンの名称は両方とも分割前とまったく同じになっているので、足りなかったボーンが根元側だとしても、先端側だったとしてもスケルゴンエディターで改名してしまえば親子関係を崩すことなくボーンを追加できる。

Bone027

なお、画像のように左右の区別があるボーンを追加しなければならなくなった場合は、反対側を一度削除してから再度鏡面複製して接尾辞を一括改名したほうが無難。

途中経過

Bone028

参考までに、今回のボーンのリスト。

  • Root
    • Spine
      • Breast
        • Neck
          • Head
        • Chest_L
          • ChestIK_L（IK用）
            • Upper_Arm_L
              • Lower_Arm_L
                • Wrist_L（IK用）
                  • Hand1_L
                    • Finger11_L
                      • Finger12_L
                  • Hand2_L
                    • Finger21_L
                      • Finger22_L
                        • Finger23_L
                  • Hand3_L
                    • Finger31_L
                      • Finger32_L
                        • Finger33_L
                  • Hand4_L
                    • Finger41_L
                      • Finger42_L
                        • Finger43_L
                  • Hand5_L
                    • Finger51_L
                      • Finger52_L
                        • Finger53_L
        • Chest_R
          • ChestIK_R（IK用）
            • Upper_Arm_R
              • Lower_Arm_R
                • Wrist_R（IK用）
                  • Hand1_R
                    • Finger11_R
                      • Finger12_R
                  • Hand2_R
                    • Finger21_R
                      • Finger22_R
                        • Finger23_R
                  • Hand3_R
                    • Finger31_R
                      • Finger32_R
                        • Finger33_R
                  • Hand4_R
                    • Finger41_R
                      • Finger42_R
                        • Finger43_R
                  • Hand5_R
                    • Finger51_R
                      • Finger52_R
                        • Finger53_R
    • Hip
      • Coxa_L
        • Upper_Leg_L
          • Lower_Leg_L
            • Ankle_L（IK用）
              • Foot_L
                • Toe_L
                  • FootIK_L（IK用）
      • Coxa_R
        • Upper_Leg_R
          • Lower_Leg_R
            • Ankle_R（IK用）
              • Foot_R
                • Toe_R
                  • FootIK_R（IK用）

関連記事

LightWaveで二次元キャラ系人物モデリング奮闘記 ―服装編3―

最終更新：2016/09/06

基礎的なモデリングももう大詰め。最後にまったく手をつけていなかった靴を作る。

足の調整

まず、どんな靴を履かせたいのか検討し、それに合わせて足の形状を調整する。最初は次の画像のように爪先から踵までぴったり地面に着いている。当初はヒールの高い靴のことを想定していなかったため。

Clothes100

そこで、爪先側のポイントを選択して下（Y軸方向のマイナス方向）に変形させる。移動量は、仮に靴のサイズを24cmとした場合、7cmのヒールがある靴だと大体足の大きさの3分の1くらいが目安。単純に爪先を下げるだけだと足全体のサイズが大きくなってしまうので、少し後ろに下げて足の大きさが不自然に伸びてしまわないように調整する。

Clothes101

靴の基礎を作る

ローポリゴン・モデルでは靴を脱がないことを前提にして足を直接加工して靴を作ってしまうという方法が一般的。ウェイト・マップの設定が簡略化できるなどの利点もあるけど、靴の種類を変えたい場合などに後の応用がきかないので、あえて別パーツで作る。

まず、片方の足首から下の部分をコピーして別のレイヤーに貼り付ける。デフォルトでいいので靴用のサーフェースを設定しておくとわかりやすいだろう。他の服装と同じようにThickenツールで厚みをつけてもいいんだけど、靴は入口がひとつしかなく出口もなくて比較的簡単なので、別の方法を使ってみる。

先に裏地を作る。もうひとつ同じものを別のレイヤーに貼り付け、全体のポリゴンを反転（Fキー）させる。

Clothes103

足首から下の部分は必要ないので削除する。服の裏地は方向によっては見えることもあるかもしれないけど、どんな方向から見ても靴の中まではさすがに見えない。モデリングを簡単にするためにもポリゴンを減らしておく。

Clothes104

最初にコピーしたレイヤーに戻り、靴の外形を形成する。ここではスムース拡大縮小ツールを使用する。ここでは20mm拡大している。普通の拡大縮小ツールと異なり、法線方向を参照して拡大縮小してくれるので、足の形を単純に大きくしただけのゴム長靴のような形にはならない。

Clothes102

裏地を作ったレイヤーを切り取って外形のレイヤーに貼り付ける。次の画像のように表地と裏地の間に隙間ができているので、エッジを1組ずつ選択してブリッジで接続していく。いっぺんにブリッジできれば便利なんだけど、想定外のところとブリッジしてしまうことがあるので、八角形くらいならひとつずつ確実に処理していく。

Clothes105

ブリッジが終わってサブパッチを適用すると次の画像のようになる。まだ靴下のような形だけど、これが靴の基礎になる。

Clothes106

爪先と足の甲を作る

さすがに八角形のままではポリゴンが少なくて加工しにくいので、正中線を挟んで右左のポリゴンをバンドソープロで分割する。まず左側を分割。

Clothes107

右側も同様にバンドソープロで分割する。

Clothes108

靴らしい形に整えていくために、爪先の部分のポリゴンと足の甲にあたる部分を次の画像のように選択する。

Clothes109

拡張プラス（Eキー）でポリゴンを増やし、更にスムース拡大縮小ツールで更に20mm拡大する。

Clothes110

靴底が丸くなっていて陸上競技用のランニングシューズのようになっているので、更にエッジを追加して靴底の角を立たせると同時に装飾をはっきりさせる。普通は拡張プラスを使っていくんだけど、いつも同じでは芸がないので、ここでは実験的にラウンダー（Rounder）を使ってみる。サブパッチを解除し、次の画像のようにエッジを選択する。

Clothes111

ラウンダーの設定は次の画像のとおり。「Rounding Polygons」を「1」に、「Inset distance」を「10mm」にしてある。

Clothes112

ラウンダーを実行すると次の画像のようになる。うまく外縁部のエッジにだけラウンダーがかかった。サブパッチを適用してみると爪先の靴底がかなり平らになり、足の甲の装飾部分も少し際立った。

Clothes113

踵とヒールを作る

次に、踵の部分のポリゴンを選択し、拡張プラスとスムース拡大縮小ツールで踵の厚みを増す。

Clothes114

そのままの状態で選択をエッジに（Sel Edges）を使用してエッジ選択モードに切り替える。

Clothes115

選択しているエッジを減らし、次の画像のように踵の上と下の部分のエッジだけ選択しておく。

Clothes116

ここで更にラウンダーを実行する。設定は爪先と同じ。踵のほうでは上下のエッジが縦に接続されてしまい、角を丸めるためのポリゴンが追加されてしまった。

Clothes117

ラウンダーの動作としてはまったく問題ないんだけど角を丸めるポリゴンは必要ないので、ポイントの統合ツール（Ctrl+W）か平均統合を使って間を詰める。すると、線ポリゴンが多数できるので、Wキーを押してポリゴン状態ウィンドウから「2頂点」のものだけを次の画像のように選択して削除する。

Clothes118

ラウンダーを使用したら、サブパッチ（正確にはキャトマル）がかかっていない部分ができてしまった。

Clothes119

「面」という行に表示されているポリゴン数がサブパッチがかかっていないところなので、それだけを選択して、Tabキーを押してサブパッチを適用する。

Clothes120

サブパッチがかかっていないポリゴンだけを選択した状態が次の画像。投げ縄選択なんかでも選択できそうだけど、サブパッチがかかっているところとかかっていないところが入り組んでいると問題ないところまで更にトグルしてしまうので、ポリゴン状態ウィンドウを使ったほうが確実。

Clothes121

もちろん、ラウンダーを使用しなければこういった事態は起きなかったかもしれないので、サブパッチ・モデリングにラウンダーを持ち込むのは少々無理があるようだ。

このあたりで軸でポイント整列（Align Points to Axis）ツールを使って踵周囲のポイントのY軸を揃えておいたほうがいいと思う。先走って先に進めてしまったので、後で整列させることになってしまったけど、加工を始める前に整列させておいたほうが賢明。

次にヒール部分を作る。踵の底面のポリゴンを選択し、拡張プラスと移動ツールで引き伸ばしていくいつもの方法。

Clothes122

先細り（Taper2）ツールでヒールの先を20%程度まで尖らせておく。

Clothes123

選択範囲を1段階拡張（}キー ＝ Shift+]）し、斜体（Shear）ツール（[キー）でヒール部分を前にずらす。フォールオフ形状は初期設定の「右上がり」では踵のほうが動いてしまったので、次の画像のように「右下がり」に変更してヒールのほうが動くようにする。

Clothes124

斜体を実行した後の状態が次の画像。

Clothes125

靴底の整理とサブパッチ強度の調整

足の甲のあたる部分のポリゴンが前後に長く、爪先や足首側のエッジを大きく引っ張っていて操作しにくいので改善したい。バンドソープロで分割するのが手っ取り早いんだけど、足から切り取って靴を作った都合で足の裏にあたるポリゴンが少し込み入っていてうまく分割できない。そこで、靴底のポリゴンを少し整理する。

ポリゴンの切り分けを変更するためにトポロジーが集中している箇所の次の画像に示したエッジを選択し、デバイドを1回使ってポイントを1つ増やす。

Clothes126

スペースキーを押してポリゴン選択モードに切り替えると次の画像のようになっているので、選択をポイントに（Sel Points）を使用して関連するポイントを絞り込む。このあたりは細かいポリゴンが集中していてマウスによるポイントの選択や選択解除が難しいので、いったんサブパッチを解除して大きく拡大し、自分がどのようにポリゴンを区切りたいのかよく検討する。

Clothes127

次の画像がポリゴンの分割方向を切り替え終わった状態。

Clothes128

3ポイントのポリゴンができているので、靴底側の隣りのポリゴンと結合（Shift+Z）する。これでトポロジーがすっきりする。

Clothes129

次に、靴底中央部分にあたるポリゴンも整理したいので、次の画像の矢印で示した方向でポリゴンを選択し、バンドグル（Band Glue）ツールで自動統合させる。バンドグルを使いたい時は、統合させたい方向にエッジと交差するように選択しなければならない。同じポリゴンを選択していても、選択方向を間違えると統合のされ方が変わってしまう。

Clothes130

バンドグルで統合し終わった状態が次の画像。選択したのは矢印で示したポリゴンだけだけど、その隣りにある2ポリゴンも同様に統合されているのがわかる。今回は4組8ポリゴンだったので手動で統合していってもそれほど苦労はないんだけど、これが数十組という単位になった時、一括で処理してくれるバンドグルは特に高い威力を発揮する。

Clothes131

靴底のポリゴンの整理が終わったので、靴の周囲のポリゴンをループ選択で綺麗に選択できるようになる。うまく選択されない場合は、バンドグルの処理の過程で生じた不要なポイントが残っていることがあるので、それらを削除する。

Clothes132

このポリゴン群をバンドソープロで3等分した。2分割でもいいかとも思ったけど、もう少し作り込みたいので、3分割にした。

Clothes133

バンドソープロで分割したのが次の画像。分割前の上の画像と比べてみると、足の甲と爪先の部分の引っ張られ具合が緩くなり、無理矢理引き伸ばしたような印象がなくなった。

Clothes134

片方の靴が大体できたら鏡面 Xで反対側の靴を複製する。

途中経過

まだ靴にベルトなどの装飾を加えていきたいけど、同じような操作の繰り返しになるので省略。出来映えはともかく、必要なものはひととおり揃ったこともあり、モデル本体の作り方の過程はひとまずこれで終わり、次回からボーンやウェイト・マップを設定するリギング作業に移っていきたいと思う。

まずはひととおり完成させないことにはポーズひとつ満足につけられない。UVマップの展開やテクスチャの作成などやるべきことはまだたくさんあり、モデリングにばかり時間を使っていられなくなってきたのもある。

Clothes135

関連記事

LightWaveで二次元キャラ系人物モデリング奮闘記 ―服装編2―

最終更新：2016/09/27

前回はおおまかな形にするところまでで終わってしまって大幅に省略したので、ここからは細かいところを作り込んでいく。今回はジャケット編。

襟を作る

最初に襟を作る。Thickenツールで厚みを増した生地の端を選択する。

Clothes025

拡張プラス（Eキー）でポリゴンを追加し、上に伸ばしていく。

Clothes026

襟に段差をつけていきたいので、伸ばした部分の前方部のポリゴンを選択し、削除する。裏側もあるので忘れずに。

Clothes027

表面のポリゴンがなくなって空洞になった部分のポイントの表と裏それぞれを選択し、襟側のポイントに統合（Ctrl+W）する。サブパッチがかかっているとループ状になってわかりにくくなるので、一度解除してから統合ツールを使ってもいい。なお、統合ツールは後に選択したポイントに吸着する特性があることを頭に入れておくと思わぬところに吸着されてしまうミスは防げる。

Clothes028

Thickenツールで厚みをつけると、概ねベースになったポリゴンの法線方向にシフトするので、襟の端にあたるポリゴンのエッジは斜めになっている。ここで後の作業がしやすいようにポイントを整列させて少し整理する。

次の画像のように襟の一番前側のポイントを最初に選択する（対称モードを使用しているので2つ選択している）。

Clothes029

整列させたいポイントを次の画像のように追加し、「変形」メニューグループにある軸でポイント整列（Align Points to Axis）ツールを選択する。

Clothes030

前後方向を揃えたいので、Z軸を選択し、「Align to」を「First Point」に設定し、「OK」をクリックする。最初に選択したポイントのZ座標に合わせて他のポイントが整列される。

Clothes031

同様にして、襟の上面にあたる部分もY軸座標で整列させる。整列が終わった状態が次の画像。

Clothes032

再度サブパッチをかけると次の画像のようになる。ほとんど変わっていないように見えるけど、整列をやっているのといないのとでは以後の作業のしやすさが大きく変わってくる。

Clothes033

移動ツール（Tキー）で襟を大きく広げる。内側に向いているポリゴンをいっぺんに大きく移動させると無理が出てくるので、回転ツール（Yキー）などで向きを調整しながら少しずつ広げていく。多少ポリゴンがよじれてしまっても問題ないので、無理に平面を維持しようとしなくてもいい。ただ、襟の厚さが途中で大きく変わってしまうのは問題なので、表と裏をもれなく一緒に移動させたり回転させたりする。そこだけ意識するようにしたい。

Clothes034

襟の上半分の連続したポリゴンをいくつか選択し、ループ選択で表から裏までぐるっと選択する。

Clothes035

ちなみに、ループ選択は多用する割にはショートカットキーが割り当てられていないので、「˜」（Shift+^）に割り当てている（日本語キーボードには書いてないけど、BackSpaceキーの2つ隣り）。初期設定では「曲げる」ツールに割り当てられているショートカットだけど、そんなに頻繁には使わないので上書きしてしまった。「`（グラーブアクセント記号）」（Shift+@）のドローツールを「開いたカーブ（Make Open Curve）」に置き換えてあるので、隣り合うキーにショートカットを割り当てておくと曲線を量産したい時に便利。どんな場合に曲線を量産する必要があるのかはいずれ説明したい。

バンドソープロで次の画像のように2分割する。ループ選択をするまでもなく、バンドソープロはループしながらポリゴンを分割していくので、いきなりバンドソープロでも同様の結果は得られる。

Clothes036

襟の上半分の前側のポリゴンを次の画像のように選択する。

Clothes037

拡張プラスと移動ツールで次の画像のように前に押し出す。

Clothes038

更にループ選択してバンドソープロを使って3分割する。

Clothes039

バンドソープロの設定は次の画像のとおり。5%と95%の部分で分割するようになっている。

Clothes040

分割し終わった状態が次の画像。主な目的は、そのままでは丸みがありすぎて締まりがない角をきちんと立たせ、制服っぽいハードな襟に見せるため。ここで先ほど表に見えているポイントを整列させた効果が出てくる。斜めのまま放置しておくとどんなにバンドソープロで分割しても傾いたままになってしまう。ここからポイントを整列させようとすると手間は単純に4倍になる。

Clothes041

拡大して更に襟を作り込む。次の画像のように襟の先端のポリゴンをひとつ選択する。

Clothes042

拡張プラスでエッジを増やし、移動はさせないで次の画像のように拡大縮小ツール（Shift+H）で50%まで縮小する。

Clothes044

今まで特に触れてこなかったけど、「アクションの中心」は「選択範囲」モードにしておく。マウスなどのポインティング・デバイスの位置で中心点を決める「マウス」モードではどうしても大雑把な指定になってしまうので、ある程度モデラーの計算に任せる。特に意図がある場合以外、基本的には「選択範囲」モードを使用している。

Clothes043

更に拡張プラスと移動ツールで窪みを作る。押し込む移動量は大体でいいけど、とりあえず襟の厚さの半分くらいにした。

Clothes045

今度は次の画像のように前側の先端のポリゴンを選択する。

Clothes046

同様に拡張プラス、拡大縮小ツール、拡張プラス、移動ツールの順に適用し、次の画像のように側面と同じような窪みを作る。

Clothes047

サブパッチを解除すると次の画像のようになっている。

Clothes048

前面と側面の窪みを繋げて切り欠き状にしたいので、余分なポリゴンを削除する。側面の窪みが目論見の切り欠きに近いので、前面の窪みのほうのポリゴンを削除していく。

Clothes049

ポイントの統合ツール（Ctrl+W）を使って前と横をつなぎ合わせいく。側面の窪みを基準にして要所でポイントを整列させながら統合していくと綺麗にできる。色々つぎはぎはしたけど、4ポイントのポリゴンしか使ってないことがわかると思う。

Clothes050

このような切り欠きを作りたいのであれば、ブーリアンの減算を使うほうが簡単だと思うかもしれない。もちろんそれでもいい。

ただ、ブーリアンの場合は背景レイヤーに切り欠きに相当するオブジェクトを別途用意しなければならないし、今回のようにちょうど半分の大きさの切り欠きにしたい場合は位置合わせにも神経を使う。また、ブーリアンを使った直後は前景レイヤーと背景レイヤーのポリゴンが交差した部分のポイントが統合されていないので統合する手順が必要になる（統合し忘れるとサブパッチが崩れる）。その上、4ポイントのポリゴンを維持するには分割ツール（Ctrl+L）で丹念に切り分ける必要が出てくる。切り欠きの形状が複雑な場合はブーリアンを使うメリットのほうが大きいかもしれないけど、今回のような単純な直方体の場合は拡張プラスを活用して1レイヤー完結でジオメトリを構築していったほうが後始末は簡単に済む。要は適材適所といったところで、どの方法を使うのが能率がいいかはその時々で判断していくしかない。

サブパッチを適用すると次の画像のようになる。目的の切り欠きにだいぶ近くなってきた。

Clothes051

まだエッジの角が丸く、思ったほどのシャープさがない。更にポリゴンを分割してエッジを追加していってもいいんだけど、細かいところに過剰な労力をかけても仕方がないので、別の方法を使う。

切り欠きのエッジを全部選択し、「詳細」メニューグループにあるシャープネス設定を選択する。

Clothes052

ここではひとまず「50%」に設定してみる。何も設定していなければ0%になっているので、基本的には増やす方向。100%を超える値や負の値にはならない。

Clothes053

シャープネスを設定すると次の画像のように思い通りの切り欠きになった。100%にするとサブパッチがまったくかかっていない状態と同じになるけど、あまりシャープネスを上げすぎても周囲の丸みをおびたエッジに比べて不自然になるのでほどほどにしておく。「シャープネス増加」と「シャープネス減少」を1回クリックすると10%ずつ増減するので、それで様子を見ながら設定してもいい。

Clothes054

ここで言うシャープネスというのは、「エッジ・ウェイト」のことで、設定すると「Edge Weight」という名称のウェイト・マップが自動的に作成されてそこに情報が保持される。ウィンドウ右下の「W」ボタンを押し、「Edge Weight」を選択した上でビューポートの表示モードを「ウェイトシェイド」にすると設定状態を視覚的に確認することができる。エッジを選択した状態でIキーを押してエッジ情報を表示させても数値を確認でき、一括で値を変更することもできる。

Clothes099

エッジの先鋭化（シャープネスの増加）は、エッジ選択ができるようになるLW 9.6の前までは対象ポイントにサブパッチ・ウェイトを設定することで実現していたものなんだけど、サブパッチ・ウェイトはその名のとおりサブディビジョン（SubD種）が「サブパッチ変換」の時しか作用しないもので、エッジを先鋭化させたい場合は3ポイント又は4ポイントのポリゴン以外は許されないサブパッチ変換によるモデリングを余儀なくされていた。ところが、エッジ・ウェイトは5ポイント以上のポリゴンも許容される「キャトマル変換」でも有効で、見た目の上ではサブパッチ・ウェイトと何ら変わりがない。事実上、サブパッチ・ウェイトを使うかどうかは、古いLightWaveで作成した過去の作品を活かしたい場合を除いてはユーザーの好みの問題だけになった。

肩章を作る

ミリタリー風のジャケットやコートなどによく見られるエポレットを作る。特に難しいところはない。

肩と袖がつながっているあたりのポリゴンを次の画像のように2つほど選択する。

Clothes055

拡張プラスでポリゴンを増やし、拡大縮小ツールで適度にサイズダウンする。選択範囲モードで縮小すると肩の高さより低くなるので、移動ツールで高さを揃えておく。布の部分なのでそれほど厳密でなくてもいい。

Clothes056

拡張プラスと移動ツールで引き延ばしながら先端のポリゴンを45°ずつ回転させていき、90°回転したところで襟側に向かって引き延ばす。先端の位置が大体決まったら前後方向を縮小して先端を少し尖らせておく。

Clothes057

肩章はこれで終わり。ただ、なんとなくおかしい感じがしたので画像検索でエポレットが備えられた服飾を調べてみたら、こんなに大きいループを描くエポレットはほとんどなかった。肩の生地に水平に縫い付けられていてほとんど隙間がないことが多いので、ちょっとやりすぎた。資料はよく見ましょう…。

やりすぎてしまった場合は「構造」メニューグループにあるバンドグル（Band Glue）ツールでポリゴンを減らして適当な形になるように調節する。

袖章を作る

袖章はテクスチャで描いてしまってもいいんだけど、せっかくサブパッチを活用してハイポリゴン・モデルを作っているので、オブジェクトで作る。昨今はZBrushをはじめとするスカルプチャ・モデリングができるソフトウェアの台頭でテクスチャ・マップやノーマル・マップに頼らなくても3Dモデルに直接精緻な彫刻を施すことが可能になっているので、可能な限り凹凸をポリゴンで再現していきたい。

まず、袖に袖章を接続するための土台を作る。袖の下腕部分を選択してバンドソープロを使用する。表側だけでいいので、裏地のポリゴンも分割してしまわないように。最近のPCは安くても高性能なものが多いので、多少ポリゴンが増えたところで体感できるほどレンダリング時間が延びることはないけど、用もない分割は極力避けたい。

Clothes075

バンドソープロの設定は次の画像のとおり。10%の位置で分割するようにしてある。半分に切って移動ツールでポイントかエッジを移動させてもいいんだけど、袖には多少なりともテーパーがかかっているものなので、できればその先細りを維持したい。

Clothes074

なお、作業の途中でWindows 10にアップグレードしてしまったので、ここからスクリーンショット内のウィンドウデザインが変わってしまうけど、ご勘弁願いたい。ちなみに、Windows 7/64bitからの移行だったけど、LightWave10.1はちゃんと動作している。

袖の上側のポリゴンを4つ選択し、拡張プラスと拡大縮小ツールで土台を形成し、袖口のほうへ移動させておく。次の画像のようになった。

Clothes076

土台ができたので、袖章を作っていく。当初は袖を拡張プラスなどで盛り上げて作る方法も考えたんだけど、手動で加工するとどうやっても歪むので、別のレイヤーでディスクから作ることにした。袖章のモールにはループがあるデザインなんだけど、それを可能な限り円形に近くしたいから。

まず、ディスクツールで正八角柱を作る。Y軸方向に3分割してある。例によって八角形なのは土台が4ポイントのポリゴン4つで構成されているから。

Clothes059

後で縮小するのは余分な手間なので、袖の太さと比較して適度な大きさになるように最初から小さく作っておく。中心点は後からでも調整がきくので、とにかく正八角柱を作る。

Clothes058

上面と底面のポリゴンは必要ないのでDeleteキーで削除する。サブパッチでモデリングしていく場合、ディスクの上面と底面は大抵必要ない。

Clothes062

平均統合（Weld Average）を用いて八角柱の外縁のポイントを中心位置で統合させる。上面と底面のポリゴンが残っていると点ポリゴンになってしまうので注意。

Clothes060

高さを揃え、上面の8つのポリゴンを選択する。拡張プラスでポリゴンを増やし、拡大縮小ツールで40%まで縮小する。40%という数値はあらかじめデザインしておいた袖章の比率から求めた。

Clothes061

底面も同様に加工し、上面と底面の合計16ポリゴンを選択する。

Clothes063

ブリッジで中央に穴を開ける。ブリッジは本当に便利。ブーリアンの減算のように交差したポイントが分離されてしまうこともない。

Clothes064

ブリッジの処理で残ってしまった中心のポイントを削除する。

Clothes065

ここまでやってしまってから八角形のポリゴンのまま縮小してブリッジしても結果が同じだったことに気付いたけど、この程度の加工は頭を使わなくても進められるし、よくあることなので気にしない。

穴の内側のポイントの位置を調べる。X座標は2.733mであることがわかったので、これをコピーする。

Clothes066

ナイフツール（Shift+K）のX座標に2.733mをペーストし、次の画像のようにカットする。本当は内側まで切り進めたいところなんだけど、交差する座標がまったく同じだと結果が不確定になるので外側のひとつ目までにしておく。

Clothes068

なお、途中までカットしてできる宙に浮いたポイントを内側のポイントに接続すると、ポリゴンが分割されたことにならず、7ポイントの1ポリゴンとして扱われてしまってサブパッチ適用時におかしいことになってしまう。途中まで切り進めたポイントはもったいないけど残さず削除する。

Clothes067

地味だけど、分割ツールで次の画像のように内側のポイントとエッジを接続して3ポイントと4ポイントのポリゴンに切り分ける。

Clothes069

袖章の腕の部分を引き延ばしていく。角に直接つながっている3ポイントのポリゴンがあるとサブパッチ適用時に想定外の方向へ歪むので、次の画像のように外側のエッジを選択して半分にデバイドしてポイントを増やす。

Clothes070

デバイドしたポイントと内側のポイントを接続するために次の画像のように分割ツール（Ctrl+L）で切り分ける。

Clothes071

3ポイントのポリゴンを選択してポリゴンを結合（Shift+Z）する。

Clothes072

反対側の腕も伸ばして袖章の基礎は完成。サブパッチをかけてみて次の画像のようになっていれば成功。

Clothes073

ここまでできたら、袖章の裏側のポリゴンは削除する。裏側をそのままにしていると袖と接合した時にポイント間の距離が0になり、サブパッチが処理しきれなくなって奇妙なトゲのような出っ張りができてしまう。おそらく、0で除算すると計算結果が無限大になってしまうという数学の反比例の関数のグラフと同じような現象なんだろうと思う。

袖章をジャケットのあるレイヤーにコピーする。ここで袖の正中線に合わせて位置を調整しておく。

袖章の形に袖側の土台を合わせていきたいので、袖章のポリゴンのスケッチ色を「詳細」メニューグループにあるスケッチ色で赤に設定する。これによって間違って袖章を構成するポイントを動かしてしまった時にすぐに気付けるようにする。

Clothes077

残念ながらLightWaveのモデラーには他のソフトウェアにあるようなマスクに相当する機能がないため、任意のポリゴンを誤って操作することがないようにロックすることはできない。運用面でカバーするしかないわけだけど、このスケッチ色という概念は他の3DCGソフトウェアには意外とないものらしい。レンダリングの結果にはまったく影響しないものだけど、ポリゴンの簡易グループとして使い方次第ではかなり重宝する。ただし、スケッチ色は「なし」も含めて14色しかないので、本格的なグループ化をしたい場合はパーツ作成機能を使う。

あとは、とにかくどんな手段を使ってもいいので、袖側のポイントを袖章に接合する。サブパッチを解除して内側から順に接合していくと少しはやりやすい。

Clothes078

途中で袖側のエッジが足りないことに気付いたので、ポリゴンの分割方向を切り替えたり、無理矢理デバイドで接合先のポイントを増やしたりもしている。はっきり言っておすすめできないし、あまりにややこしくて詳しい手順を書く気にもならない。袖章のモールを円形にしたいだけの理由でわざわざ背負っている苦労だから。もはやこだわりの問題で、ローポリゴン・モデルのようにテクスチャとノーマル・マップで作ることにしてしまってもまったく問題ない。

大体接合が終わったら、スムース押し出しで袖章の続きとなるモールを作る。スムース押し出しはポリゴンの法線方向にシフトしてくれるので、意外に簡単にできる。

Clothes080

特に示すまでもないかもしれないけど、スムース押し出しの設定は次の画像のとおり。

Clothes079

袖章の腕を統合ツール（Ctrl+W）でスムース押し出しで作ったモールと接合する。どこがモールなのかわかりやすいように全体のスケッチ色を統一して仮にマテリアルを割り当ててみた。

Clothes081

袖章の上の部分は平らのままなので、回転ツールを使って袖の曲率に極力合わせる。この時、回転の中心を袖章の正中線に位置しているポイントから取得するようにすると歪まなくて済む。ポイントをひとつ選択して「選択範囲」モードで回転ツールを適当に動かしてみるとポイントの座標が中心点に代入されるので、ポイント情報からコピー&ペーストする手間が省ける。1ポイントなら回転させようがないので、誤って変な方向に動かしてしまうこともない。これは結構おすすめな方法。

Clothes082

袖章のポリゴンを隠す（-キー）でどかしてみると、袖の表面は次の画像のようになっている。相当ゴチャゴチャなトポロジーになっているけど、目的のためには手段を選んではいられない。ちょうど袖章の裏打ちになるようにしている。

Clothes084

袖章のポリゴンを透明にしてみるともう少しわかりやすいだろうか。スムース押し出しで作った部分にも裏打ち用のポリゴンを追加してある。

Clothes083

袖側のポリゴンで裏打ちをしてあることによって、遠方にある袖のポイントに引っ張られて袖章の形が大きく崩れてしまうのを防いでいる。こう書くとすごい工夫のように思うかもしれないけど、かなり苦肉の策で、本当のところは反則技。

この方法を用いると、ひとつのエッジを3つ以上のポリゴンで共有することになってしまい、他のソフトウェアにこのようなオブジェクトのデータをインポートしようとするとエラーが出る。通常はエッジを共有するポリゴンは2つまでというのが常識。3つ以上あるということは、そのうちいずれかのポリゴンの法線方向が不確定ということになり、オブジェクトの外形を構築できなくなるからだ。特に、中身が詰まっていて表面に見えていないポリゴンがないことを前提としているスカルプト系のソフトウェアでは間違いなくエラーになる。

本来は反則技なわけだけど、LightWaveでは許されてしまうので、このまま進める。なんで問題を放置するかというと、袖章は1種類ではないから。この袖章は少尉のもので、最低でも中尉、大尉、少佐までの4種類の袖章を用意する必要がある。必要分が揃ってから裏打ち問題をどうにかすることにしても遅くはない。正攻法では、袖章の側面をバンドソープロで分割して袖側のポイントに引っ張られないように制限をかける。他のソフトウェアへのデータ移行の際はその時に考える。

合わせ部分を作る

最後に、ジャケットの前にあたる合わせ部分を作り込む。途中から対称モードが使えなくなるので、左右の対称性に疑問が残る場合はX軸の0座標で半分に切って鏡面 Xで再度貼り合わせて不安要素を取り除いておく。合わせ部分を最後に残しておいたのは、対称モードが使えなくなるからに他ならない。

Clothes085

内側に向いている合わせの端のポリゴンを選択する。まだ対称モードは使える。

Clothes086

拡張プラスと移動ツールでメッシュが大体均等になるように2段階に分けて左右を交差させる。目的によっては段階をもうけないで一気に引き伸ばしてもいいけど、そうするとメッシュが極端に伸びるためにポイント間の距離が遠くなって生地の端も内側に引っ張られる力が強くなる。結果、元の形状を維持できなくなることには注意したい。

Clothes088

ただ、こういった点に注意しなければならないからと言ってそれがただちにLightWaveの欠点になるわけではない。他のソフトウェアでも、ポリゴンのメッシュが他の部分と比較して極端に粗いところがあるとサブディバイドをかけても粗くて制御しにくいのは変わらないため、あらかじめ適度に分割しておく必要がある。むしろ、サブディバイドをかける前に結果がある程度予想できるという点はLightWaveの長所と言える。

右側が前になるデザインなので、左側の合わせを後ろに移動させる。右側から飛び出してしまう場合は回転ツールなどを使ってなんとか内側に収まるように調節する。左側は以後前に出てくることはないので、インナーにぶつからない程度であれば位置決めはおおまかでいい。

Clothes089

元の襟の形の影響で斜めになっている部分があるので、軸でポイント整列（Align Points to Axis）でX軸を揃えておく。

Clothes091

どこのポイントを基準にするか特に決まりはないけど、ここでは裾側のポイントを基準にした。

Clothes090

右側の合わせは上側で折り返すデザインなので、右側の合わせの上面のポリゴンを選択する。

Clothes092

拡張プラスと移動ツールで上に伸ばし、そのまま回転ツールで90°前に回転させ、更に拡張プラスと移動ツールで前に伸ばし、もう一度90°、合計180°回転させて折り返す。更に下に伸ばし、前に垂らす。

Clothes093

斜体（Shear）ツール（[キー）で前に垂らした部分を斜めにずらす。斜体ツールはちょっとクセのあるツールだけど、間隔を変えずに均等に斜めにしたい場合は移動や回転ツールを使うよりも斜体ツールを使うほうが便利。メカのモデリングでは装甲厚を変えずに断面を斜めにしたい時などに活躍するツール。

Clothes094

奥に押し込んだ左側の合わせ部分も同様に斜体ツールでずらして襟を大きく開ける。斜体の基準点が右側になってしまってうまくいかない場合は、フォールオフの形状を「右上がり」から「右下がり」に変更してやり直す。

Clothes095

前に垂らした襟を形成する。角の部分のひとつが要らなくなったので、ポリゴンを3ポイントに分割し、端のポリゴンをひとつ減らしてある。

Clothes096

前に垂らした襟に装飾を施す。ここでもあまりおすすめできない方法をたくさん使っているので詳しくは書かないけど、ベベル（Bevel）ツール（Bキー）のインセット量で生地の端からのマージンを一定量確保してから各ポリゴンごとに分離してしまったエッジを再度貼り合わせ、拡張プラスと移動ツールで襟をまつった上でバンドソープロでエッジを立たせてある。手順が煩雑な上、どのポリゴンが余分かを判断して切り落としていく過程がわかりづらいかもしれない。

一般的な方法としてはスムース押し出し、ノーマル移動、拡大縮小ツール、拡張プラスなんかで作っていくのが常套なんだけど、細かいところで法線方向に一斉に動かれるとジオメトリがゴチャゴチャになって自分でもどこがどうなってるのかわからなくなりやすい。裏は表と反対向きに形成することを考慮しなければならないため、私としてはシフト量を0にしたベベルを使い、シフトをツールに任せずに自力で調整したほうが気が楽だと思ったのでそのような方法を採った。

Clothes097

過程を記録していたGIMPがファイルの保存時に異常終了してしまったので、スクリーンショットがいくつか飛んでしまった。Windows 10はまだ新しいためか、7よりも安定性が悪い気がする。Win 7ではGIMPがフリーズしたことは記憶にある範囲では1回もなかったのに。

それはそうと、Windows 10にアップグレードして数日してからモデラーのカラーワイヤーの色が変わってしまった。サーフェースの設定を変更していないのにOpenGLのシェーダのかかり具合も前と比較して明らかに異なる。他でLightWaveを扱っているブログなんかを見ると、確かこんな感じの色だった気もするので、これが正しい表示なのだろう。以前は選択した直後のポイントやポリゴンの色が異様に濃かったりしたので、むしろ前のほうがおかしかったのかもしれない。特に設定をいじった記憶はないのでGeForceのドライバーとの適合が適正化されたということなんだろうか。調べてみたけど、詳細な原因は不明。

途中経過

ひとまずジャケットは完成。レンダリングするとやはり袖章の周囲の影が少しおかしい。やはり反則技は反則ということか。あとまったく手をつけていないのは靴だけ。髪型が変わってるけど、実は髪の毛もやり直し中。

Clothes098

関連記事

Janetterにフォロワー数/リツイート数/いいね数を表示する

最終更新：2017/01/27

カスタムテーマを設定すると、アカウントのアイコンの下にフォロワー数が表示される。6桁までは表示できた。リツイートされたツイートだとしても、ツイート元のアカウントのフォロワーが表示されるようになっている。また、本文の下にリツイート数といいね（お気に入り）の回数が表示されるようになる。自分のツイートでは良い条件のツイートがなかったので、ニュース記事のツイートを借りてきた。

TwitterクライアントJanetter（ジャネッター）にはタイムラインの表示方法やデザインを選べる「テーマ」という機能がある。標準で実装されているシンプルなテーマ群でも実用上はそれほど困らないんだけど、本家のTwitterのウェブ・クライアントと比べて情報量がやや少ない。

本家では「リツイート」や「いいね」（旧仕様の「お気に入り」）の回数がこれといった操作なしに常に表示されているけど、Janetterでは各ツイートの日付・時刻に備えられたリンクをクリックしてブラウザで確認しないとどのくらい「リツイート」や「いいね（お気に入り）」されているツイートなのか確認できない。

また、そのツイートをつぶやいたアカウントがどのくらいのTwitterユーザーにフォローされているのかはアカウントのリンクをクリックしてプロフィール用ウィンドウを表示させなければならない。本家のウェブ・クライアントではマウス・ポインタをユーザー名の上に置けば簡単なプロフィールを確認することができる。

全部は無理としても、アカウントのフォロワー数とツイートのリツイート数といいね（お気に入り）の回数くらいは視覚的に確認できるようにしたい。なお、名前が変わっただけで、Twitterの内部的には「いいね」と「お気に入り」はまったく同じもので、APIから送られてくるツイートの情報は相変わらず「Favorite(d)」になっている。

そこで、改良したユーザーテーマを作成してこれらの情報を表示させてみようと思う。なお、テーマの作成は一種のプログラミングなので失敗しても当方は責任を負えない。プログラムやスクリプトの作成経験がない場合は特に慎重に。

言うまでもないことだろうけど、Janetterを終了してからテーマの変更を行う。

テーマの移設

テーマを最初から全部作成するのは大変なので、標準のテーマのうちのひとつを複製して移設する。ここではもっとも標準的なSparrowテーマを使用する。

テーマを構成するデータは次のフォルダに入っているので、これをフォルダごと複製し、まずはフォルダに適当な名前をつける。ここでは仮に「TestTheme」とする。

C:\Program Files (x86)\Janetter2\Theme\Items\Sparrow

本来は*.janetthemeというテーマ・ファイルからJanetterに読み込ませてテーマを自動インストールするんだけど、自作の場合はフォルダを増設することで手動インストールすることができる。また、テーマ・ファイルは名前が違うだけで実態はzip形式の圧縮ファイルなのでJanetterの代わりに自分が解凍済みのデータをインストールしたと思えばいい。

TestThemeフォルダに入ったら、theme.iniという初期設定ファイルを開く。UTF-8（BOMなし）で記述されているので、Windows標準のメモ帳（Notepad）よりはあらゆる文字コードに対応した高機能テキスト・エディタを使用したほうが無難。

theme.ini
1
2
3
4
5
6
7
8
9
10
11
12
[TestTheme]
name = TestTheme
description = Left side menu
sample_image = sample.jpg
author = Jane, Inc.
url = http://janetter.net
twitter_id = Janetter_jp
main_frame_html = index.htm
popup_html = ..\..\Common\notice\notice.htm
image_viewer_html = ..\..\Common\viewer\viewer.htm
map_viewer_html = ..\..\Common\viewer\map.htm
profile_html = ..\..\Common\profile\profile.htm

最初の2行を書き換える。Janetterは最初の1行でテーマの存在を識別するので、必ず2行とも書き換える。また、標準のテーマから移設した場合、index = 0010といったようにインデックス番号を付けられているけど、この行は削除しておく。あっても害はないけど、Janetterでのテーマの表示順に関係しているので、最後に表示させることにする。

テンプレートの改造

次に、標準テーマで共通で使用されている共有テンプレートのtweet.tplファイルをTestThemeフォルダにあるtemplateフォルダにコピーする。

C:\Program Files (x86)\Janetter2\Theme\Common\template\tweet.tpl

また、同じフォルダにあるtweet.cssファイルも同様にコピーしておく。

C:\Program Files (x86)\Janetter2\Theme\Common\template\tweet.css

tweet.tplファイルを開くわけだけど、ここからは本当に高機能テキスト・エディタを使うべき。コードの間違いなのかファイルのデータ形式の問題なのか区別できなくなるので、信頼できるコーディング用テキスト・エディタを使うことを強くおすすめする。無料で使えるところではStyleNote5などがおすすめ。ウェブ作成関連で使用しそうな言語やマークアップにはすべて対応しており、コメントの閉じ忘れなど単純な書き間違いはその場でわかる。

フォロワー数の表示

テンプレートはJartyという一種のスクリプト言語で記述されている。ファイルの最初のほうは次のようになっている。わからなければprofile-boxというクラスを目印にして検索するといい。

tweet.tpl
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
<div class="profile-box">
    {if $retweeted_status}{* RT *}
        <p class="main-profile">
            <a action="all"><img src="{$retweeted_status.user.profile_image_url}"></a>
        </p>
        <p class="sub-profile">
            <a action="all" class="sub-profile"><img src="{$user.profile_image_url}"></a>
        </p>
        <div class="icon-rt"></div>
    {elseif $user}{* Normal *}
        <p class="main-profile">
            <a action="all"><img src="{$user.profile_image_url}"></a>
        </p>
    {elseif $sender}{* DM *}
        <p class="main-profile">
            <a action="all"><img src="{$sender.profile_image_url}"></a>
        </p>
        {if $isMe}
            <p class="sub-profile-dm">
                <a action="all" class="sub-profile"><img src="{$recipient.profile_image_url}"></a>
            </p>
            <div class="icon-dm"></div>
        {/if}
    {else}{* Search *}
        <p class="main-profile">
            <a action="all"><img src="{$profile_image_url}"></a>
        </p>
    {/if}
</div>

profile-boxクラスはツイートしたアカウントやそれをリツイートしたアカウントのアイコンが表示される領域で、そこにツイート元のアカウントのフォロワー数を表示する行を追加する。

tweet.tpl
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
<div class="profile-box">
    {if $retweeted_status}{* RT *}
        <p class="main-profile">
            <a action="all"><img src="{$retweeted_status.user.profile_image_url}"></a>
            <div style="width:36px; margin:0 0 4px 0; text-align:center; color:Black; font-size: x-small;">{$main_user.followers_count}</div>
        </p>
        <p class="sub-profile">
            <a action="all" class="sub-profile"><img src="{$user.profile_image_url}"></a>
        </p>
        <div class="icon-rt" style="top: 57px;"></div>
    {elseif $user}{* Normal *}
        <p class="main-profile">
            <a action="all"><img src="{$user.profile_image_url}"></a>
            <div style="width:36px; margin:0 0 4px 0; text-align:center; color:Black; font-size: x-small;">{$main_user.followers_count}</div>
        </p>
    {elseif $sender}{* DM *}
        <p class="main-profile">
            <a action="all"><img src="{$sender.profile_image_url}"></a>
        </p>
        {if $isMe}
            <p class="sub-profile-dm">
                <a action="all" class="sub-profile"><img src="{$recipient.profile_image_url}"></a>
            </p>
            <div class="icon-dm"></div>
        {/if}
    {else}{* Search *}
        <p class="main-profile">
            <a action="all"><img src="{$profile_image_url}"></a>
            <div style="width:36px; margin:0 0 4px 0; text-align:center; color:Black; font-size: x-small;">{$main_user.followers_count}</div>
        </p>
    {/if}
</div>

リツイート数/いいね（お気に入り）数の表示

次に74行目付近。tweet-bodyクラスが記述されている。ここにツイートの本文を表示するようになっている。

tweet.tpl
74
75
76
77
78
79
80
<div class="tweet-body">
    {if $retweeted_status}{* RT *}
        <p class="text">{$retweeted_status.text}</p>
    {else}
        <p class="text">{$text}</p>
    {/if}
</div>

本文の直後に「リツイート」の回数が2回以上あればリツイート数を表示し、「いいね（お気に入り）」の回数が1回以上あればいいね（お気に入り）数を表示するコードを記述する。

tweet.tpl
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
<div class="tweet-body">
    {if $retweeted_status}{* RT *}
        <p class="text">{$retweeted_status.text}</p>
    {else}
        <p class="text">{$text}</p>
    {/if}
    {if $retweeted_status}{* RT *}
        {if $retweeted_status.retweet_count>1}
            <p class="rtcount">{$retweeted_status.retweet_count}</p>
        {/if}
        {if $retweeted_status.favorite_count>0}
            <p class="favcount">{$retweeted_status.favorite_count}</p>
        {/if}
    {else}
        {if $retweet_count>1}
            <p class="rtcount">{$retweet_count}</p>
        {/if}
        {if $favorite_count>0}
            <p class="favcount">{$favorite_count}</p>
        {/if}
    {/if}
</div>

$retweet_count変数はTwitterから取得したリツイートの回数を、$favorite_count変数はいいね（お気に入り）の回数を格納している。ただし、これらの変数の数値はリツイートの場合（$retweeted_status == true）にはリツイートした人のツイートについての情報になるため、元のツイートのリツイート数を知りたい場合は$retweeted_status.retweet_count変数から参照しなければならない。いいね（お気に入り）の回数についても同様で、$retweeted_status.favorite_count変数から参照する。

以上でテンプレートの編集は終了。ファイルを保存する。

CSSの追加

次に、tweet.cssファイルを開く。ファイルの最後までスクロールし、次のスタイルを追加する。リツイート数といいね（お気に入り）数の表示にはそれぞれrtcountとfavcountというクラスを割り当ててあり、それをどのような表示形式にするかという指定にあたる。CSSの記述方法を知っているのならば、ここは好みで自由に変更できる。

tweet.css
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
.rtcount {
    color: #fff;
    background-color: #19cf86;
    display: inline-block;
    width: 25%;
    border-radius: 5px;
    text-align: center;
    font-weight: bold;
}
.favcount {
    color: #fff;
    background-color: #e2264d;
    display: inline-block;
    width: 25%;
    border-radius: 5px;
    text-align: center;
    font-weight: bold;
}

厳密には、Jartyが表示する場所や内容をクラスで管理していると言ったほうが正しく、新しい表示要素を追加したい場合にはそれに対応するクラスを新たに定義しなければならない。

例えば、textクラスはツイート本文のクラスだけど、ただのテキストだからと思ってこれを別の用途に流用しようとすると、ツイート本文が2回、3回と連続で表示されたりする。また、クラスを定義していないHTMLタグを記述するとタイムラインが表示されなくなる。つまり、クラスはCSSのためだけにあるのではなく、内容にも紐付けられて管理されているということになる。

最初はHTMLを動的に生成するPHPのようなものかと思っていたけど、テンプレートに特化したスクリプトなのでPHPほどには融通はきかない。フォロワー数がクラスを定義しなくても表示できたのは本当に偶然。なんで大丈夫なのかは今でもよくわかっていない。とは言え、Jartyは構文をPHPに似せて作ってあり、関係演算子などはそのままコピーできるように設計されているようだ。

アイコン画像パスの変更

Sparrowテーマは独自のtweet.cssファイルを持っていないため共通ファイルから引っ張ってきたわけだけど、アイコン画像は共通のものをそのまま使いたいのでパスを変更しなければならない。基本的には、../../Common/images/timeLine/を../../../Common/images/timeLine/に一律に置換すればいい。

独自のtweet.cssファイルを最初から持っているテーマから移設した場合は変更しなくてもいい。なお、CSSには独自にかなり変更を加えてしまったので、行番号は大体の位置。

「お気に入り」アイコン。今のTwitterの仕様で言うところの「いいね（お気に入り）」をしたツイートの左上隅に表示される黄色い星のアイコン。

tweet.css
18
19
20
21
22
23
24
25
.favorited .star-batch{
    position: absolute;
    top:0px;
    left:0px;
    width: 15px;
    height: 15px;
    background-image: url(../../../Common/images/timeLine/star-batch.png);
}

相互フォロー（スマイル）アイコン、非公開アカウント（鍵）アイコン、未読アイコン、位置情報（ジオピン）アイコン。

tweet.css
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
span.friend{
    float: left;
    display: block;
    width: 9px;
    height: 9px;
    margin: 4px 1px 0 1px;
    text-indent: -99999px;
    background-image: url(../../../Common/images/timeLine/smile.png);
}
span.protected{
    float: left;
    display: block;
    width: 9px;
    height: 11px;
    margin: 5px 0 0 2px;
    zoom: 0.9;
    text-indent: -99999px;
    background-image: url(../../../Common/images/timeLine/key2.png);
}
span.unread{
    float: left;
    display: block;
    width: 9px;
    height: 9px;
    margin: 4px 0 0 1px;
    text-indent: -99999px;
    background-image: url(../../../Common/images/timeLine/unread.png);
}
span.geopin{
    float: left;
    display: block;
    width: 9px;
    height: 11px;
    margin: 0 2px 0 0;
    text-indent: -99999px;
    background-image: url(../../../Common/images/timeLine/geopin2.png);
}

タイムラインのギャップに表示される波型のアイコン。

tweet.css
429
430
431
432
433
434
435
.gapArea{
    margin: 3px 0 10px 0;
    height: 24px;
    text-align: center;
    background-image: url(../../../Common/images/timeLine/gap_line.png);
    background-repeat: repeat-x;
}

以上でCSSの編集は終了。ファイルを保存する。

CSSファイルを保存したら、Janetterを起動する。設定画面から「デザイン」を選び、最も右に作成したTestThemeがあるので、それを選択し、「テーマを変更する」ボタンをクリックする。もしも、画面が真っ白になってしまって変化がない場合はテンプレートのコードがどこか間違っているので、別のテーマに戻して不具合を探す。エラーコードなどがはっきり出るわけではないので、変更した箇所をよく確認する。CSSの記述が間違っている程度であればタイムラインが止まってしまうような事態が起こることはまずない。

問題点

Janetter002
（参考）Janetterを利用したことがない方のために変更前のSparrowテーマの表示。フォロワー数、リツイート数、いいね（お気に入り）の回数は表示されない。サムネイル画像のサイズが大きいのはカスタムスタイルシートを設定してあるため（前の記事参照）。

フォロワー数は概ね期待どおりの結果になったんだけど、リツイート数といいね（お気に入り）の回数には少し問題があった。

リツイート数といいね（お気に入り）の回数はあくまでも大体のものだと思ったほうがよさそう。Janetterが定期的にAPIを叩いた時点での数値なのでツイートを読むまでに時差があった場合、本家のウェブ・クライアントと比べてみるとリツイート数にかなり差が出てしまっていることもよくある。

特に、「いいね（お気に入り）」の回数はかなりあてにならない。実は、実装はしていても$favorite_count変数はJanetterの公式でも現在公開されていなくて、信頼性が低いことは認識しているようだ。

それから、フォローしているアカウントのツイートが流れる「ホーム」のタイムラインに限ってはリツイート数もいいね（お気に入り）の回数も表示されないことがある。「再読み込み」をかけると表示されるんだけど、リアルタイムで追加されていくツイートには表示されない。一方、同じくリアルタイムで追加されていくものでも「リスト」では正しく表示される。

テンプレートは同じものを使っているので、おそらくリアルタイム性を重視したホーム用のユーザーストリームAPIとリストのデータをまとめて読み込むクローラーAPIの違いなんだろうと思うけどTwitter本家の仕様なのでクライアント側ではどうしようもない。Janetterがリツイート数といいね（お気に入り）数の表示に標準で対応していないのはこのへんに理由があるのかもしれない。

表示例

関連記事

参考記事

LightWaveで二次元キャラ系人物モデリング奮闘記 ―服装編1―

最終更新：2016/09/27

前にも少し書いたけど、服は体のラインから作っていく。現在の体は次の画像のようになっている。多少いじってはいるけど、ほとんど変わっていない。

Clothes000

インナーを作る

内側の服から順に作っていく。インナーも本来は長袖という設定だけど、上着を着せる予定なので袖が二重になっていると肘を曲げた時に内側の服が外側の服を突き破ってしまうことがあるため、袖は作らない。また、後でスケルゴンを組み込んだりウェイト・マップを設定する時にも邪魔になるため必要最小限の範囲に留める。次の画像のようにウェストから肩口までのポリゴンを選択して別のレイヤーにコピーしておく。

Clothes001

コピーした服のベースは次の画像のようになっている。デフォルトの設定で「Inner」というサーフェースを仮に割り当ててある。

Clothes002

「ユーティリティ」メニューグループにある追加プラグインからThickenを選択する。服の表面は体の表面よりは外側にあるので、「Direction」は「Outside」を選択する。「Change Sides Surface」と「Change Outside Surface」にチェックすることでThickenで追加されるポリゴンのうち側面に相当する部分と外側に相当する部分のサーフェースを別に割り当てることができる。ベースになるポリゴンのサーフェース名が「Inner」なので、それぞれ「Inner_sides」と「Inner_outside」というサーフェースが追加される。「Smooth Scale」はどのくらい押し出すかの指定で、布の厚さに相当するんだけど、あまりに近すぎると後が大変なので、作業しやすいくらいの値にしておく。

Clothes003

3Dプリンターでの出力を考えているなどフィギュアの原型を作っている場合はどんなに薄くても厚さが必要になるので1枚ポリゴンでは不都合が生じるけど、3DCGの範囲に留める場合には最終的に側面と内側のポリゴンは不要になることが多いので、後で選択しやすくするためにもサーフェースはわけておいたほうが無難だと思う。

ただ、Thickenで追加されたサーフェースは不安定で、Thicken実行後に作業を続けていたらいつの間にかベースのサーフェースに統合されてしまっていることがある。このインナーを作っている時もそういった症状が起きた。念のため、サーフェースが追加されたのを確認したら一度保存しておくのをおすすめする。

「OK」をクリックすると、次の画像のようにノースリーブの服のようなものができあがる。

Clothes004

襟をタートルネックにしたいので、首のポリゴンを選択してバンドソープロで次の画像のように横に分割する。

Clothes005

内側のポリゴンも同様にバンドソープロで分割する。

Clothes006

分割した内側のポリゴンの上半分を選択し、更にバンドソープロで分割する。本物の服と同じように、襟を折り返してタートルネックにしたいので、折り返し部分のポリゴンが必要になるためだ。

Clothes007

折り返した後の部分は、元は内側だったポリゴンが外側に、外側だったポリゴンが内側になるので、ちょっとややこしいけど、よく考えながら変形させていけばポリゴンを裏返したりすることなく襟を折り返すことができる。サブパッチがかかっているとポリゴンの裏表がはっきりしなくて余計にわかりにくいこともあるので、サブパッチを解除して形を整えてからサブパッチをかけてもいい。

Clothes008

どうしてもわからなくなってしまった場合は、襟を別に円筒などからモデリングして接続するという方法もあるけど、かえって手間がかかるかもしれない。サブパッチ・モデリングの練習のためにも、できるだけ連続したポリゴンを加工するほうをおすすめしたい。ちょっとしたパズルのような楽しみもある。

上の状態だと首にピッタリすぎるので、次の画像のように少し前に変形させてたるませる。インナーはこれで完成。上でも書いたようにサーフェースがうまく振り分けられてくれなかったので、内側のポリゴンで不要なものは後で削除することにする。

Clothes009

ジャケットを作る

裾から頭を通して襟から出して着るタイプのシャツやセーターといった服や、羽織って着る服であっても生地が薄くて合わせが浅いワイシャツのような服であれば上で書いたインナーの方法で作ればいいけど、ジャケットやコートといったような生地が厚くて合わせが深い服で、前を開けたり閉めたりできて着こなしに変化がある服の場合は少し工夫がいる。

体のラインからおおまかな形を切り取るのはインナーと同じ。ジャケットは長袖にするので、次の画像のように上腕の根元あたりくらいまで切り取る。

Clothes010

インナーと同様にThickenツールで生地の分だけ厚くする。

Clothes011

合わせになる部分の連続したエッジをいくつか選択し、ループ選択（Select Loop）で襟側と裾側、内側のエッジも選択する。

Clothes012

選択をポイントに（Sel Points）でエッジで選択した部分をポイント選択に切り替える。

Clothes013

合わせ部分を切り離すために「詳細」メニューグループにある統合解除（Unweld）ツール（Ctrl+U）でポイントの統合を解除する。次の画像のようにサブパッチが崩れるので、いったんサブパッチを解除する。

Clothes014

片方の合わせ部分のポリゴンを選択する。内側のポリゴンはもちろん、襟側と裾側のポリゴンも忘れずに選択しておく。三面図で上から見た図で選択するとやりやすい。

Clothes015

反対側の合わせと再統合されないようにするために、合わせ部分が離れるように移動（Move）ツール（Tキー）でX軸方向に少し動かす。要は結合ツールの自動モードで統合されない範囲まで離れていればいいので、ほんの少しでいい。

Clothes016

この状態で、一度ポリゴンの選択をすべて解除し、結合（Merge Points）ツール（Mキー）で解除していた統合を再統合させる。サブパッチを再適用すると、先ほどのサブパッチの崩れはひとまず解消している。ただ、合わせ部分にポリゴンがないため、空洞になっていて次の画像のように向こう側が見えている。

Clothes017

合わせ部分の生地の端にあたる外側と内側のエッジを次の画像のようにひとつずつ選択し、ブリッジ（Bridge）ツールで空洞になっている部分を埋めていく。エッジを選択してブリッジした場合は、選択したエッジを含むポリゴンをひとつ作成してくれる。ポイントを4つ選択してポリゴン作成でもいいけど、後で裏返さなければいけなくなったりしてやや手間がかかるので、ブリッジのほうが手軽で間違いも少なく能率も上がる。

Clothes018

片方の合わせ部分が完成したら、反対側の合わせは後で削除してしまうのでブリッジ作業はしないで、肩口のポリゴンを選択して拡張プラスと移動で次の画像のように袖を伸ばす。袖口はある程度ぱりっとしていて欲しいので、一段区切って更に拡張プラスで少しだけ伸ばしておく。肘関節で曲がる部分の細分化は袖の絞り具合を調整してからでも遅くない。

Clothes019

袖まで完成したら、次の画像のように袖を伸ばしていないほうのポリゴンをすべて選択し、削除する。

Clothes020

手間を半分に減らす目的もあるけど、Thickenツールは精度が悪く、ベースにしたポリゴンが完全に左右対称になっていたとしても左右対称かつ均等に厚みを増してくれるわけではないため、左右でバランスが崩れた精度を増す目的も同じくらい重要。インナーでは省略したけど、本当はやっておいたほうがいい。

機械ではないし、服なのだから精度なんてどうでもいいと思うかもしれないけど、左右対称になっていないと細部を作り込むときに対称モードでの選択がうまく働いてくれなくて無駄な神経をすり減らすことになる。経験してみればわかるけど、対称モードなのに反対側が選択されてくれないストレスは結構なものになる。

Thickenツールの影響で正中線がズレている可能性があるので、半分に切った部分の背中側のポイントを次の画像のように選択して整列させる。

Clothes021

「詳細」メニューグループにある整列（Set Value）ツール（Vキー）でX座標を0に統一する。翻訳の問題なんだけど、「変形」メニューグループにも「整列」というツールがあって紛らわしい。Alignツールと動作は似ているし代用もきくけど、表示されるダイアログが異なるので注意。

Clothes022

鏡面 X（mirrorX）ツールで袖まで作ったほうのジャケットを反対側に複製する。

Clothes023

鏡面 XはX座標が完全に一致するポイント同士（座標は0には限定されない）を見つけると自動的に統合してくれる。上でX軸を0に揃えたのはポイントの統合の手間を減らす目的もある。眉毛を作って反対側に複製した時には余計なお世話と思ったけど、こういった場合ではむしろ便利。

パースで回してみてサブパッチが崩れているところがなければ表地、裏地ともに綺麗に接合されているということなので、これでジャケットの基礎は完成。あとは襟などを作り込んでいく。学ランの詰め襟のように襟をかっちりと立たせたい場合は、エッジの丸め方と面取りやサブパッチの簡単な応用でも書いたサブパッチの影響範囲の制限をうまく利用する。

途中経過

スカートは同じく体のラインをベースにして筒を伸ばしていくだけで簡単に作ってしまったので省略。プリーツスカートやフレアスカートなんかのモデリングはまた別の機会にやろうと思う。ジャケットはまだ完成ではないけど、大体こんな感じ。靴はまだ作ってない。

Clothes024

関連記事

Janetterのサムネイルの画像サイズを変更する

最終更新：2017/01/27

Janetter000
サムネイル画像サイズ変更前。CSSで最大120×80pxに設定されている。Twitterからはthumbサイズで呼び出されるため、実質80×80px。

Janetter（ジャネッター）は、国産Twitterクライアントのひとつ。公式のアプリケーションやウェブ・クライアントではやってくれない未読管理もできてとても便利なんだけど、右の画像のようにツイートに添付されたサムネイル画像が非常に小さくて見づらいのが難点だった。

調べてみると、Janetterはウェブ・ブラウザのようにHTMLとCSSで画面表示の内容やデザインを決定しているようなので、やりようによってはカスタマイズできそうだった。

サムネイル画像サイズの変更

ユーザースタイルシートを記述できる空のファイルが用意されているので、そこに任意のCSSを記述する。具体的には次の場所。ユーザーフォルダの下の階層にあるので注意。

C:\Users\[user_name]\AppData\Roaming\Jane\Janetter2\UserStyleSheets\Custom.css

Custom.cssには次のように記述する。

Custom.css
1
2
3
4
5
6
7
8
.tweet-thumb img,
.tweet-thumb canvas{
    float: left;
    margin: 5px 5px 3px 0;
    max-height: 150px;
    max-width: 150px;
    border-radius: 5px;
}

なお、Twitterサーバーに置かれている画像ファイルには、Janetterで動作しているJavaScriptによって一律に「:thumb」のサフィックスが追加されるようになっているので、縦横ともに最大でも150pxまでしか指定できない。

上のスタイルの元になっているCSSは、次のtweet.cssファイルに記述されている。

C:\Program Files (x86)\Janetter2\Theme\Common\template\tweet.css

Janetterデバッグモード

他の要素（クラス、セレクタ）に対するスタイルがどこのCSSファイルに記述されているか調べるには、Janetterのデバッグモードを使用する。

まず、Janetterをいったん終了する。Janetterへのショートカットを別に作成し、次のように「リンク先」に--debugを追加する。

"C:\Program Files (x86)\Janetter2\bin\Janetter.exe" --debug

編集したショートカットをダブルクリックするとデバッグモードで起動される。デバッグモードになっているか確認するには、左上の「Janetter」のロゴを左クリックして「Developer Tools」や「Test」といったメニューが追加されているかどうかで判断する。

「Developer Tools」を選択すると、Chromiumの要素解析画面が表示される。上から順に要素を選択していくと、対応するJanetterの画面の一部がブロック（コンテント、パディング、ボーダー、マージン）で色分けされて表示されるので、それを参考にCSSの構造を解析する。

「:thumb」サフィックスの解除

Twitter規定のサムネイルのサイズ（150px）が実質上の最大サイズになってしまう制限を解除するには、次の場所にあるthumbnail.jsファイルをカスタムテーマのフォルダに複製してからJavaScriptコードを書き換える。カスタムテーマの作り方についてはこちらの記事を参照のこと。

（以前の版ではコモン・コードを直接書き換えていたけど、全部のテーマに影響を与えてしまい、褒められた方法ではないので、カスタムテーマをちゃんと用意するほうが良い。また、元のコードがわからなくならないように複製してコメントアウトしておいてから改変するほうが無難）

C:\Program Files (x86)\Janetter2\Theme\Common\js\janet\thumbnail.js

thumbnail.jsの125行目あたり。

thumbnail.js
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
//-------------------------------------------------------
// Twitter
//-------------------------------------------------------
function twimg(permalink){
    var a = _content.find('div.tweet-body p a[expanded="' + permalink + '"]'),
        media_url = a.attr('media'),
        extended_media_url = a.data('extended'),
        type = a.attr('type');
    if(media_url && (type=='photo' || type=='video' || type=='animated_gif')){
        if(extended_media_url){
            $.each(extended_media_url, function(){
                _append(this + ':thumb', type=='photo'? this + ':orig': '', permalink);
            });
        }else{
            _append(media_url + ':thumb',  type=='photo'? media_url + ':orig': '', permalink);
        }
        return true;
    }
    return false;
}

136行目と139行目を次のように書き換える。

thumbnail.js
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
//-------------------------------------------------------
// Twitter
//-------------------------------------------------------
function twimg(permalink){
    var a = _content.find('div.tweet-body p a[expanded="' + permalink + '"]'),
        media_url = a.attr('media'),
        extended_media_url = a.data('extended'),
        type = a.attr('type');
    if(media_url && (type=='photo' || type=='video' || type=='animated_gif')){
        if(extended_media_url){
            $.each(extended_media_url, function(){
                _append(this + '', type=='photo'? this + ':orig': '', permalink);
            });
        }else{
            _append(media_url + '',  type=='photo'? media_url + ':orig': '', permalink);
        }
        return true;
    }
    return false;
}

大きな画像やTwitterサーバー以外に置かれているメディアのことは考えていないので、タイムラインの幅にフィットさせるには上のCustom.cssの最大サイズを適宜書き換える必要がある。タイムラインの最小幅が300pxくらいだとすると、サムネイルの幅は250pxくらいになる（Developer Toolsを使えば厳密に測定できる）。

Janetter001
サムネイル画像サイズ変更後。「:thumb」サフィックスを解除してあるため画像全体が表示される。CSSで最大サイズを255×1024pxに設定してあるためサムネイルは縦に並ぶ。

「:thumb」サフィックスを解除し、Custom.cssを調整すると右の画像のようになる。1件のツイートが縦長になってスクロールするのが大変になる傾向にあるけど、未読のツイートをあまり時間をかけずに一気に閲覧していきたい時にはクリックの回数を減らせて便利。

流し読みをすると当然細かい見落としは多くなるけど、Twitter公式のウェブ・クライアントでは「1000件の新着ツイート」と表示されていても取得できるツイート数に上限があり、1000件全部を読むことはできない。寝る前に最後に見た時点のタイムラインに遡行するのも難しい。Janetterではそういう心配がない。

その代わりに、大量の未読ツイートに埋もれることにもなるけど、とにかく寝ている間や他の作業に集中している間の時系列がちゃんとつながっているだけでも大事な告知などの決定的な見落としがなくなって気分的にはだいぶ違う。

ただ、Twitterの本家は「Twitterカード」や「アンケート（投票）」など新しい機能を次々に実装しつつあるため、Janetter（この記事を書いている時点でWindows版はVer. 4.3.1.0）が徐々に旧式化しているのは事実。奇特な方が新機能に対応するプラグインを作ってくれるか、Janetterのバージョンアップを気長に待つしかない。

関連記事

参考記事

LightWaveで二次元キャラ系人物モデリング奮闘記 ―髪の毛編―

最終更新：2016/09/06

本記事は初期段階での作成方法を記載したものです。新しい作り方については続・髪の毛 HairBlade編をご覧ください。

頭部最大の難所、髪の毛。実は他の部分のモデリングの記事を書きながら、ずっと髪の毛を作っていた。作っては壊し、作っては壊しの繰り返しで、これほど難航するとは正直思っていなかった。髪の毛は本当に難しい。フィギュアの原型師の方達はいつもこんなことをやっているのかと思うとまったく恐れ入る。

LightWaveで髪の毛と言えば、繊維状オブジェクトをシミュレートするFiberFXが定番で、「LightWaveを使っているのに便利なFiberFXを使わないなんてありえない」と言われそうなくらいメジャーな機能。

FiberFXも一応試してはみたんだけど、思ったような髪型にするにはガイドと呼ばれる無数のポイントを編集する必要があり、ポリゴンで髪の毛を作るのと大差がないくらいの時間と労力がかかる。顔を衝突オブジェクトに指定して重力や風などの物理演算を使用できるのは利点なんだけど、二次元キャラクターの髪型はなかば重力を無視したものも多いので魅力にはなりにくい。また、イメージ・プロセシング・プラグインとしてのFiberFX本体のパラメータ数も非常に多く、二次元キャラクター風の質感を出すのにも研究が必要で、まったく別のノウハウが必要になる。

何はともあれ、ここではFiberFXを使わずにポリゴンで髪の毛を作っていく。ポリゴンで髪の毛というと、バナナ型の髪の毛の房を作り、それを頭の周囲に並べていくという手法がよく採られるけど、それとそんなに変わらない方法に落ち着いた。

髪の毛の基礎を作る

ボックスツール（Shift+X）で髪の毛の房を作っていく。基本は眉を作った時と同じ方法。横幅200mm、奥行きを100mmで生成してある。特に決まっているわけではないけど、奥行きを横幅の半分くらいにするのを目安にしている。

Hair000

次の画像のように上下（Y軸）に6分割、左右（X軸）と前後（Z軸）に2分割する。よほどの長髪でもない限り、6セグメントくらいあれば、大抵の髪型は表現できるように思う。

Hair001

上端と下端のポリゴンを4つずつ選択し、それぞれのポリゴンを結合（Shift+Z）する。

Hair002

ポリゴンの結合で余剰になった2ポイントをDeleteキーで削除する。

Hair003

Y軸に一列に並んでいるポイントを選択し、断面が菱形になるように移動させる。前面と背面の幅が40mm、左右の面の幅が20mmになるように形成してある。菱形の角にあたる部分の幅によって髪の房を前後左右に分かつサブパッチの鋭さが決まる。もっと鋭くしたい場合は幅を狭く、丸くしたい場合は広くする。

髪の房の断面を菱形にするのは、フィギュアの原型を作っている方のブログで髪の毛の断面を半円や円形にすると1本の太い髪のように見えてしまうという記事があり、それを根拠にしている。無用にエッジを増やしたくはないんだけど、何度も試した結果、これで必要最小限という結論になった。

Hair004

先細り（Taper2）ツールで毛先に向かって細くなっていくように加工する。これも眉を作った時と同じ方法。前の記事では先細りの倍率に「0%」は指定できないって書いたんだけど、指定できた。どこで勘違いしてしまったんだろうか。

Hair005

次の画像のように、左右だけでなく、前後も先細りさせておく。

Hair006

ここまでできたところでサブパッチを適用すると次の画像のようになる。毛先の先端にある8つのポイントは統合しないでおく。何度も書いてるけど、統合してしまうと先端が丸くなってしまう。

Hair007

複製する前に、髪の房の前面、背面、両側面、毛先の部位にわけて「選択」メニューグループにあるポイントセットで次の4つの選択セットを登録する。複製後、ポイントの数が大量に増えることになるので、少しでも管理しやすいようにグループ化しておくのが目的。

  • Hair_Front
  • Hair_Back
  • Hair_Side
  • Hair_Top

Hair008

髪の房を必要数複製（Cキー）する。必要数によってヘディングの回転角度や中心位置は変わるけど、目安としては、隣の髪の房と左右が少し重なるくらいにする。今回は複製元も含めて全部で24個の髪の房を作っているけど、二次元キャラクター風をターゲットとしているものとしてはたぶん多いほう。

Hair009

複製し終わった状態が次の画像。ここから前髪や後ろ髪に必要な分を切り取って使うことになるんだけど、ツインテールやお下げ髪など特殊な髪型の場合を除き、髪の毛全体をひとつのオブジェクトとしてモデリングしていったほうが結果としてはやりやすい。

レイアウトで焦点距離の短い広角カメラで捉えた時にパースが強くかかり、モデラーのパースで見た時よりも髪の毛の量が格段に少なく見えることがよくある。髪の毛全体のボリュームのバランスを少なからず調整することになるんだけど、前髪と後ろ髪にパーツが分かれているとこのボリューム調整が非常にやりにくい。フィギュアの原型制作でも、量産や塗装する際のパーツ分割のことを考えなければ、同様のことが言えるそうだ。

Hair010

後ろ髪を作る

前髪を先に作ってしまったので、ここでは後ろ髪だけを選んでモデリングしていくけど、基本的な方法は前髪でも同じ。

まず、髪の房の根元を接続していく。サブパッチが適用されている時に込み入った箇所のポイントを選択するのはちょっと手間がかかるので、パースで表面に見えているポリゴンをクリックして選択をポイントに（Sel Points）ツールでポイント選択に切り替えながら「詳細」メニューグループにある平均統合（Weld Average）でポイントを接続していく。隣りの髪の房と向かい合わせになっているポリゴンは不要なので削除する。

余談だけど、私は平均統合をよく使うので、「Alt+W」をショートカットキーに割り当てている。Altキーを使うショートカットは基本的に空いているので、よく使うツールなのに初期設定でショートカットがないものを割り当てておくと少し省力化できる。

Hair011

次の画像がすべての髪の房を接続し終わった状態。髪の房の数だけ同じ作業を繰り返さなければならないので、先に土台を作ってから拡張プラスなどで押し出しながら髪の毛を作っていったほうが早いのではないかと思うかもしれない。もちろん、そういう方法もあるけど、頭を覆うものという性質がある以上、必ずしも髪の房が作業しやすい角度になっているとは限らないこともあり、毛先を均等に先細りさせたりする作業が難しくなる。大変な作業を後にやるか先にやるかの違いだけだったりする。

Hair012

土台と髪の毛の房を別に作って根元をブリッジで接続するという方法も書いてて思いついた。失敗した髪の毛の房を切り取って別の房をつなぎ直したい時には使える手段かもしれない。

髪の分け目を作るために、髪の房の裏面のポリゴンを次の画像のように選択する。

Hair013

「構造」メニューグループにあるブリッジ（Bridge）で接続すると次の画像のようになる。上端のポリゴンはすでに3つに分割されているけど、本来は分割されないまま残っている。

Hair014

上端のポリゴンを髪の流れと同じ方向になるように分割（Ctrl+L）したけど、必要なかったかもしれない。

Hair015

まだ上が解放している後ろ髪の上端のポリゴンを削除し、裏側のポイントをブリッジで生成された部分の下に接続し、表側のポイントを上に接続する。ちょうどヘルメットの内側と外側を作っていくような感じ。

Hair016

角の部分などいくつか必要ないポリゴンができたので、それらを削除しながら前方も後ろ髪との曲線に沿うように形成していく。髪の分け目を作るのには明らかにエッジが足りないことに気付いたので、頭頂部の3ポイントのポリゴン群をぐるっと選択してカットツール（Shift+U）でエッジを増やす。前側のほうはバンドソープロも使える（3ポイントのポリゴンにはバンドソープロは使えない）。

Hair017

これで後ろ髪の基礎は完成。あとは、目的の髪型になるように変形させていく。平面的に移動させるよりは、回転ツール（Yキー）や拡大縮小ツール（Shift+H）などを使って断面が太くなったり細くなったりといった変化が少ないようにしていくとうまくいきやすい。

上で登録した選択セットの前面や毛先のポイント（Hair_Front や Hair_Top）で髪の流れを作り、側面のポイント（Hair_Sides）で流れに沿った髪型を、背面のポイント（Hair_Back）でボリュームを調整する。前面側のポイントだけで髪型を作ろうとすると極端に前に張り出した髪の房になりやすいので、前後方向に拡張したら左右方向もバランスをとるようにする。隣りとぶつかってしまって左右方向を拡張できないようなら、モデルに無理がきていることも考えられるので髪の房を分割することも検討する。

髪の毛はとにかくポイント数が多いので、最初は対称モード（Shift+Y）で大体の形を作ってから細部を作り込むようにしていくといい。レイアウトに移して思ったような髪型になっていなかったことに気付いた時に戻り作業が発生すると、細部まで作り込んでしまった後だと苦労が無駄になってしてしまうので、とにかくボリューム調整を最優先でやっていくほうが効率は良い。

あと、この後ろ髪のオブジェクトひとつでは髪の房がまばらすぎて後頭部がスカスカになってしまうので、毛先のほうを切り取り、二重か必要なら三重以上にしておく必要が生じる。すると管理すべきポイントは更に増えるので、ポイントの選択に苦労しないように逐一整理していく。

前髪

前髪は後ろ髪とはまったく異なるアプローチで作っていて、あまり記録も残っていないので失敗作供養も兼ねてデータが残っていた主な失敗の紹介に留める。

次の画像は、髪の房の断面を半円形にしようとして失敗したもの。正中線で髪の毛の流れを制御しようとしたところまでは良かったものの、太い房がどうにも大根か何かの棒状のもののように見えてしまい、髪の毛にはとても見えなかった。

Hair018

次の画像は、上を改良したもの。分割数を多くして髪の房を細くすれば改善するのではないかと考えたけど、その目論見が見事に外れた失敗例。半円形の断面にこだわっていたため、やはり大根のように見える印象は変わらなかった。拡張プラスで無理矢理枝分かれさせて髪のボリューム不足を補おうとしたけど、エッジの管理が面倒になるだけで大した効果もなかった。房が分かれている分岐点も下のほうにあったため、角度の広い分け目を作ると谷間が鈍ってしまい、シャープさもなかった。

Hair019

次の画像が現在のものに最も近い状態。一度髪の毛の房ごとにパーツを分割して側面の穴を塞いだ上で、フォルムを優先して大幅に改変した。フィギュアの原型では髪の毛の断面を菱形にすることもあるという情報を仕入れたので、正中線に沿ってバンドソープロでエッジを追加し、大根に見えて仕方がなかった髪の房のシルエットを改善した。ボリューム不足は背面のポイントを中心に調整するようにしたところ、だいぶ改善した。

Hair020

前髪のモデルは以上のように新しい方法を思いつくたびにポリゴンの分割方法などが二転三転していったため、計画的にモデリングしたところがとても少なく、手順を説明しづらい。眉や後ろ髪のモデリング方法は断面を菱形にする手法を知った時に考えた。

途中経過

まだ直したいところもたくさんあるけど、ひとまず現時点の途中経過。

Hair021

髪の毛のマテリアルは仮に設定してあるものだけど、詳細はまた別の機会に書くことにする。テクスチャーを用意している時間がなかったので、画像マップは一切使っていない。

関連記事

参考記事

LightWaveで二次元キャラ系人物モデリング奮闘記 ―顔編2―

最終更新：2016/09/06

顔のモデリングの続き。目と耳と眉を作る。あと、まつ毛をモデリングで作る方法も少し考えてみた。髪の毛はまた次回。

目を作る

人物モデルに限らず、目には球体を入れるのが定石。理由はIK（インバース・キネマティクス）などを利用して視線をコントロールするのが容易になるからだけど、二次元キャラクター風の扁平な顔に眼球を入れると目が前に出っ張り、斜めや横からのアングルに極端に弱くなってしまう。

横から見て前に出ないように眼球を後ろに移動させると、今度は正面寄りのアングルで眼窩の奥が見えてしまったりする。眼窩をモデリングしていないと、後頭部の裏側が透けて見える。

そうかと言って、眼窩をぴったり塞ぐように曲率を下げると眼球が頭の中に入りきらないくらいの直径になってしまうジレンマに陥る。機械工学の問題で、与えられたモーメント（トルク）に耐えられるように設計すると、計算上は歯車の直径よりも回転軸のほうが太くなってしまうといった意地悪問題のようなものだ。

したがって、二次元キャラクター風の人物モデルに眼球を入れるためには、顔のほうを眼球に合わせて工夫しなければならなくなる。不可能ではないかもしれないけど、目を球体にするためだけにそこまでするのはあまりに労力がかかりすぎる。どうせなら、作業効率を考えると眼球を最初に作り、目の周囲から順に顔をモデリングしたほうがいい。

ここでは、あえてその定石を無視して眼窩の形から目を作る。二次元キャラクターを模ったフィギュアの目は扁平か、むしろへこんでいることが多いからだ。視線のコントロールのことは後で考える。目のテクスチャーにUVマップを使うなら視線のコントロールは至難の業だけど、通常の平面マッピングでローカル座標を与えておけば首を回しても瞳が置いて行かれることはないし、フレームの進行に従って瞳を移動させるくらいのことはできそうだ。

次の画像のように眼窩の周囲のポイントを選択し、ポリゴン作成（Make Poly）ツール（Pキー）でポリゴンを生成する。サブパッチ・モデリングでは3ポイント又は4ポイントのポリゴンを使うという定石はここでは考えず、ポリゴンの分割はしない。

Face010

切り取り（Ctrl+X）で顔のモデルからいったん切り離し、同じ位置に貼り付ける（Ctrl+V）。新しく作成したポリゴンだけを選択してTabキーを押してサブパッチを適用すると眼窩より少し小さいくらいの面ができる。

Face012

別のレイヤーにポリゴンを移し、押し出し（Extrude）ツール（Shift+E）でごく短く後ろに押し出す。元のポリゴンは眼窩の周囲を無理矢理つないで作ったものなので平面性が極めて低く、押し出した時に元のポリゴンと押し出したポリゴンの法線が逆転して裏返ってしまうことがあるけど、それ以外は正常なので、ふたつのポリゴンを選択して反転（Fキー）で向きを変えてしまえば問題ない。

Face013

押し出したポリゴンを選択して拡張プラス、移動で厚さを増す。必要に応じてストレッチ（Stretch）ツール（Hキー）で垂直、水平ともに10%増しくらいに拡大しておくと眼窩をぴったり塞ぐことができる。目の表面に見えているポリゴンは後ろに拡張したポリゴンに引っ張られ、中央方向にサブパッチが作用しているので前に膨らまず、むしろややへこむ。ちなみに、眼窩を塞ぐだけで良ければ、最初のポリゴンを作成したところでやめても特に問題ない。

耳を作る

耳の位置は、目の高さよりもやや下に作る。眼鏡をかけた時に、つる（テンプル）がちゃんと耳にかかるくらいの位置と考えると決めやすい。前後の位置は顎と頬をつなぐラインからの延長線上が大前提。人物デッサンで緻密に描いた場合でも、二次元の漫画・イラストなどでデフォルメして描いた場合でも同様のことが言え、3DCGモデルでも顎から耳への線がひと続きになっていないと不自然になる。髪で耳が隠れてしまうことがわかっていても、頬のラインを正しくモデリングできているかどうかを確認する意味でも耳を作っておくことは重要。

次の画像のように、4ポイントのポリゴンを4つ選択してそこを土台にして耳を作る。作り方によってはふたつやひとつのポリゴンからでも作れるけど、4ポイントのポリゴン4つなら周囲のポイントは8つになるので、他のモデルに移設して接続する場合にも容易になる。

Face009

拡張プラスでおおまかに耳の形を作る。二次元キャラクター風にする場合はあまりリアルにモデリングする必要はないけれど、耳輪は意外に複雑な形をしているので、拡大縮小しながら拡張プラスを5回繰り返した。4回でもできるかもしれないけど、耳をモデリング中に左右対称にならなくなった時に鏡面コピーができるように顔側の頂点を動かしたくなかったので、5回になった。

Face017

耳輪の内側にある対耳輪をモデリングする時にエッジが足りなくなったので、次の画像のようにエッジを選択し、エッジベベルツール（Ctrl+B）でエッジを増やす。

Face018

エッジベベルでエッジを追加した直後の状態が次の画像。どこまでの範囲をエッジベベルで開くかはどのくらいリアルなモデルにしたいかによる部分もあるけど、少しやりすぎなくらいモデリングしておいたほうが後々の応用はきく。ファンタジー用語で言うところの種族が「人間」なら、耳ほどキャラクターによる違いが少ない部分もないのでできれば使い回しをしたい。エルフや妖精のようなとがった耳の場合はそのキャラクターが何者であるかを雄弁に語る部分のひとつでもあるので、使い回しを考えずに最初から専用に作ったほうがいいと思う。

Face019

対耳輪がうまく盛り上がってくれなかったので、もう1回エッジベベルを使用し、横方向のエッジを追加した。本来は外耳道（耳の穴）がある耳の下の部分は顔となめらかにつながっていて欲しいので、ポイントが密になっていて影ができるほど段差ができているのは都合が悪い。そこで、ポリゴンをひとつ除去してポイントを統合（Ctrl+W）し、5ポイントになってしまったポリゴンを分割（Ctrl+L）してある。

Face020

顔の他の部分と比べても、耳は存外に緻密なモデリングが必要になることがわかると思う。耳の角度は好みの問題もあるけど、少し大袈裟なくらい開き気味りにする。顔と平行にしてしまうと、レイアウトのカメラで正面から捉えた時に耳がまったく見えないということになる。

眉毛を作る

ポーズや表情が固定されているフィギュアなんかでは額に眉を直接塗装（印刷）してしまうけど、3DCG人物モデルではモーフを使って表情をつけられることを見越し、顔とは別のパーツで作る。表情を変えるつもりがない場合はテクスチャーに直接描いてしまってもいいけど、レンダリングの結果が気に入らなかった時にテクスチャーを描き替える手間が逐一発生し、画像ファイルを介してソフトウェアを切り替えて行ったり来たりすることになり、作業効率が落ちるばかりか微調整に苦しむ原因にもなるので、最初は面倒でも眉毛をオブジェクトで作ってしまうのをおすすめしたい。

眉毛の作り方にも色々あって、裏側を見ることがないのを前提として1枚ポリゴンで作る方法もあるけど、ここでは例によってボックスから作ることにする。次の画像のように左右（X軸）に4分割、前後（Z軸）と上下（Y軸）に2分割のボックスを作る。Z軸とY軸の長さは同じにしておく。

Face022

X軸の分割数を多くしたほうが眉毛に様々な表情をつけやすくなるけど、増やすのは後でいくらでもできるので、今は必要最小限にしておく。いずれにしても、偶数にしておいたほうがモデリングはやりやすい。

次の画像のようにボックスの両端の4つのポリゴンを選択し、ポリゴンを統合（Shift+Z）する。8ポイントのポリゴンができることになるけど、ここではあえてそのようにしている。

Face023

統合したポリゴンの中央に次の画像のように浮いたポイントがひとつずつできるので、それらのポイントをDeleteキーで削除する。

Face024

わざわざ統合するくらいなら、分割していないボックスからカットツール（Shift+U）で両端のポリゴンのポイントを増やすだけにしておきたかったんだけど、カットはバンドソープロほど精度が良くなく、終端の処理が実行する度に変わったりすることがあるので、確実に分割できる方法を選んだ。

X軸方向に一列に並んでいるポイントを選択し、次の画像のように断面が菱形になるように移動させる。Z軸とY軸方向の大きさを100%とすると、断面の角になる部分は10%くらいの幅にする。ここではボックスを40mm角で作ったので、前後上下のポリゴンは4mm幅になっている。

Face025

次に、菱形の前後を最初の大体半分くらいの厚さになるまでつぶす。ストレッチツールを使うよりは、移動ツールを使って角の部分のポリゴンの大きさが変わらないようにする。

Face026

「変形」メニューグループにある先細り（Taper2tool）ツールを使って眉尻を細くする。適用範囲は「自動」ではなく「固定」を使用するため、右ドラッグで先細りの開始点と終了点を指定する。次の画像のように開始点は眉の中央あたり、終了点は眉尻あたりを狙う。

Face027

先細りのフォールオフを次の画像のように設定すると、眉の中央が一番太く、弧を描いて眉尻に向かって細くなっていくように変形できる。倍率は本当は0%にしたいんだけど、先細りツールでは0%を指定できないので、とりあえず「1%」にしてある（勘違いがあり、実際には0%を指定できる）。軸を切り替え、前後方向も先細りさせておく。

Face028

右ドラッグで終了点を眉頭に移し、次の画像のように同様に先細りさせる。これで眉毛の基礎ができた。

Face029

ここまでできたところでサブパッチを適用する。極太だけど、次の画像のような眉毛らしきものができている。両端のポリゴンを8ポイントにしたのは、眉頭と眉尻の先端の処理をサブパッチに任せるため。ポイントを多くしてまで断面を菱形にしたのは毛の束を意識した形状にしたいため。ボックスの角を1本のエッジにしてしまうと全体が丸まって棒状になってしまい、毛の束のように見えなくなってしまう恐れがある。

Face030

眉頭と眉尻のポイントをそれぞれ8つ選択し、アクションの中心モードを「選択範囲」に切り替えておく。ストレッチツール（Hキー）を選択し、左ドラッグで大体の中心位置を掴まえてからいったんアンドゥ（Ctrl+Z）し、次の画像のように水平・垂直ともに「0%」にしてポイントの位置を揃える。軸を切り替え、3軸とも完全にポイントの位置を揃える。

Face031

同じ座標のポイントがたくさんできることになるけど、ポイントの統合はしない。ポイントを統合してしまうと先端が丸まってしまい、眉全体も短くなってしまう。眉の先端を鋭くしたくない場合は、別のレイヤーで加工し、統合前の基礎はとっておく。一度丸めてしまった先端を再び鋭くするのは微細すぎて加工するのが難しく、最初から作り直したほうがむしろ早いから。

主に移動ツールを使って紡錘形のオブジェクトを眉毛らしい形に整えていく。上から見たとき前後も紡錘形になっているので、背面が平らになるように調節する。

Face032

大まかに形が整ったら、ストレッチツールなどで全体を細くしていく。上下の幅だけでなく、前後の幅とのバランスもとりながら調整していく。顔の形にフィットさせるのは後回しにし、この段階では目的の太さにすることを優先する。

Face033

眉が完成したら、「選択」メニューグループにあるポイントセット（Picksets）で眉毛のポイント全部をグループ化して「選択セット」として登録しておく。新しい選択セット名を入力し、「作成」ボタンをクリックすると、モデラーのウィンドウの右下にある頂点マップ選択ボタンが「S」に切り替わり、登録したセット名が表示される。

Face034

非常に細かい部分や立体的に入り組んだ部分になってしまい、ポインティング・デバイスで個別に選択するのが難しくなってしまった場合は、選択セットで一度にまとめて選択してから減らすようすると効率がいい。管理できる自信があれば、眉毛の前面、背面、上面、下面、眉頭、眉尻にわけて登録してもいい。

選択セットを活用して再度選択するには、「選択」メニューグループにあるマップで選択（Select by Map）を使うか、ポイント選択モードの時に「状態」（Wキー）を押し、「ポイント状態」ウィンドウの一番下の逆三角形がある欄をクリックして選択セット名を選択し、「+」をクリックする。前者はオブジェクトに登録されているすべての頂点マップの一覧が出てきてしまうので、モデリング目的で使うには後者のほうが実用的。

なお、すでに登録されている選択セット名を選び、別の新しいポイント群を選択した状態で「作成」ボタンをクリックすると既存の選択セットにそのポイント群が追加される。

顔のレイヤーを下地にして、次の画像のように眉毛を顔にフィットさせる。この時、回転ツールなどを使って眉毛の断面が極力変わらないように工夫すると綺麗な眉を作れる。

Face035

片方の眉が完成したら、反対側に複製する。鏡面Xツールを使いたいところなんだけど、鏡面Xを使うとなぜだか眉頭と眉尻のポイントが自動的に統合されて先端が丸まってしまうので、複製（MirrorTool）ツール（Cキー）を使う。複製の中心を原点にして、次の画像のように「スケール X」を「-100%」にするとポイントが統合されないままで鏡面複製したように複製される。

Face037

眉毛の完成。

Face036

まつ毛を作る（オプション）

すでにキャラクター・デザインが決まっていて明確なターゲットがある場合は、まつ毛はテクスチャーで描くのが基本だけど、オリジナル・キャラクターの場合はある程度融通がきくのでモデリングで作る方法もある。

眼窩の上半分のエッジを選択し、拡張プラスで前にごくわすがに押し出す。頭の大きさが1mくらいだとすると、10mmくらい（すごくおかしいことを書いているのはわかっている…）。拡張プラスはポリゴンだけではなく、エッジからポリゴンを拡張することができる。2回押し出した後、必要であればポリゴンを裏返し、前方に解放しているポイントを眼窩の周囲にあるポイントに統合（Ctrl+W）する。まつ毛のポリゴンにマテリアルを設定すると次の画像のようになる。

Face021

この方法の最大の利点はテクスチャーを描かなくてもまつ毛を作れることなので、二次元作画力に自信がない人に向いている。また、アニメのキャラクターのように色の境目がハッキリしていているデザインに適している。エッジを更に前に伸ばしていけば立体的なまつ毛を作れるのも長所と言える。

欠点は、眼窩周囲の適当な距離に接続できそうなポイントがないとまつ毛を作れないことと、まつ毛の量の調整のためにモデルを直接編集しなければならないこと。テクスチャーを編集するのとどっちが楽かと考えると微妙だけれども。当然ながらポリゴンの数も増える。漫画やイラストのキャラクターにあるようなグラデーションで肌色に溶け込むようなまつ毛を作るのが難しいのも弱点。

途中経過

細かいところばかりだったので、なんかいまひとつ進んだ気がしないけど、目と耳と眉を作った。

Face038

関連記事

MMDモデル「らぶ式ミク」をLightWaveで再現する

最終更新：2016/09/06

MMDモデル「らぶ式ミク」は、ボーカロイド「初音ミク」のMikuMikuDance用ユーザーモデルのひとつ。初音ミクのモデルは数多くあるけど、その中でも個人的にとても気に入っているばかりでなく、二次元キャラクター風の3DCG人物モデルとしての完成度も高いと思っていて、人物モデリングの参考にもさせてもらっている。

分析のために分解してみたりもするんだけど、綿密に計算して展開されたUVマップや精緻に描かれたテクスチャー画像、豊かな表情を可能にする100にものぼるモーフ・マップなど、どこをとっても感嘆するばかり。MikuMikuDanceで表示させた時に見栄えがするようにと考えられた工夫も随所に織り込まれていて、一言で言い表す賞賛の言葉も見当たらないくらい。

自社の製品開発の一環として研究のために購入してきた競合の自動車メーカーの高性能車両を分解してみたら、その設計や構造は言うに及ばず、普通に運転する分にはまず目に触れるはずもないエンジン内部の部品も綺麗に磨かれていたのを見て二度驚いたといった逸話を思い出してしまった。

そんな「らぶ式ミク」の制作に熱意を傾けた諸氏に尊敬を捧げ、敬意を払うとともに、参考にさせてもらっている恩返しという意味もこめてLightWaveでらぶ式ミクをMMD風に再現する方法を考えてみた。LightWaveでアニメ調のレンダリング出力をさせるためのマテリアル研究も兼ねている。

モデラーでサーフェースを設定する

PMD形式ファイル・ローダーを使って「らぶ式ミク」を読み込むと、最初は次の画像のような真っ白なモデルが出てくる。単純なモデルの場合はテクスチャーもUVマップと併せてロードされるのだけど、人物モデルのような複雑なモデルの場合はUVマップとテクスチャーの対応がちゃんととれていないことがある。

LoveMiku000

レイヤーが大量に読み込まれるけど、ほとんどがモーフ用で実際のモデルが保存されているのは2番レイヤーなので、フルキーの「2」キーを押してモデル本体を表示させる。

共通設定

「らぶ式ミク」は、surf000からsurf007までの8つの部分のサーフェースに色分けされている。まず、すべてのサーフェースに対して次のとおりに設定する。色はすべてテクスチャーで再現されるため、すべて初期値の白のままにしておく。

  • 「自己発光度」を「100%」
  • 「拡散レベル」を「0%」
  • 「透明度」を「0%」

なお、透明度が設定されているとポリゴンの表裏が反転しているように見えることがある。実は上の画像もインポート直後のものではなく、透明度を0%に設定してからスクリーン・ショットを撮ったもの。本当にインポート直後だと色々透けて見えてしまうので…。

自己発光度を100%、拡散レベルを0%にするのはエッジ・ラインの抽出でも使った手法なんだけど、モデル自身の陰影を打ち消すための設定であって、別に全身を発光させたいわけではない。MMD風にレンダリングさせるにはレイトレースがむしろ問題になる。陰影にあたる部分はテクスチャーに直接描かれているので、問題にならない。

テクスチャーを割り当てる

次に、サーフェースの「色」に割り当てるテクスチャーとUVマップを対応させる。簡単にまとめると次の表のとおり。

らぶ式ミクのサーフェースとテクスチャーの対応
サーフェース名 主な部位 テクスチャー画像
surf000 ヘッドセット Lm_jac.bmp
surf001 顔・体 Lm_body.bmp
surf002 目の周囲・口・眉毛など Lm_body.bmp
surf003 服・靴・袖 Lmtex.bmp
surf004 瞳（標準） Lm_eyes.bmp
surf005 瞳（表情用） Lm_star.tga
surf006 表情用 yyk_tpo.tga
surf007 髪 Lmhair.tga

インポート直後はいずれのサーフェースにも定数（Value）のプロシージャル・マップのレイヤーが仮に割り当てられているので、それらを消去し、残ったひとつのレイヤーを「画像マップ」に切り替える。「投影」は「UV」、「UVマップ」は「Texture」をそれぞれ選択する。MMDモデルは仕様上UVマップをひとつしか持てないため、すべてのサーフェースのためのUVをひとつのUVマップに保持している。

具体的なテクスチャーの設定は次のとおり。

surf000

LoveMiku001

surf001

LoveMiku002

surf002

LoveMiku003

surf003

LoveMiku004

surf004

LoveMiku005

surf005

「らぶ式ミク」では目が手前と奥にひとつずつ、左右で合計4つあり、モーフによって入れ換えている。surf005は奥にある目のテクスチャーを設定するためのもの。

LoveMiku006

surf006

モーフによって目や口や眉に出ない様々な表情を実現するためのテクスチャーを設定する。モーフが適用されていない時は表面に出てこないようになっている。モデラーの右下にあるマップ選択で「M」ボタンをクリックし、モーフ・マップを選択すると効果を確認できる。

LoveMiku007

surf007

LoveMiku008

髪の毛のテクスチャーのTGA画像には毛先に向かってアルファ・チャンネルが設定されているのを確認してはいるんだけど、アルファ・チャンネルを透明度のマップに設定してもうまく透過されなかったので、ひとまずグラディエント・マップで代替する。「入力パラメータ」に「Slope」を選択し、パラメータ「0」を値「0%」に設定し、パラメータ「0.8」付近のところに値「0%」のキーを作り、更にパラメータ「1.0」で「20%」になるようにキーを設定する。これで前髪で目が隠れてしまっても瞳が透けて見えるようになる。

LoveMiku009

髪の毛にはお好みで「反射光」を「100%」、「光沢」を「40%」くらいに設定するとハイライトが綺麗に出るようになる。

保存

サーフェースの設定が完了すると次の画像のようになる。オブジェクトに名前をつけてLightWave形式で保存する。LightWaveでは日本語等のマルチバイト文字への対応がいまいちですぐに文字化けするので、できれば半角の英数字・記号でファイル名をつけるほうが無難。

LoveMiku010

レイアウトに読み込む

保存した「らぶ式ミク」のオブジェクトをレイアウトに読み込む。ひとまず2番レイヤーの「Model」を読み込む。オブジェクトの「アイテムプロパティ」を開き、「輪郭」タブでラインレンダーによって出力させるエッジを選択する。「シルエットエッジ」と「鋭角の折り目」だけにチェックする。

なお、モデルの作り方の都合上、顔や体の途中でパーツやサーフェースが区切られているため、「共有しないエッジ」や「サーフェイス境界」を選択してしまうと予期しないところに線が出力されてしまう。

LoveMiku011

モーフ・ミキサーで表情を制御

次に、オブジェクトの「アイテムプロパティ」の「変形」タブで変位プラグインの「Morph Mixer」を追加する。複数のモーフ・マップを文字通り混合してオブジェクトを任意に変形させることができる。MMDの表情選択や適用量のスライダーとほぼ同じ機能を持つもの。

LoveMiku012

「Morph Mixer」の「プロパティ」を選ぶと、モーフ・マップの一覧と変位量のスライダーが表示される。「1_」で始まるモーフ・マップ名が眉、「2_」で始まるモーフ名が目、「3_」で始まるモーフ名が口（及び舌や歯や顎）、「4_」で始まるモーフ名がその他の表情、髪の毛の量、袖の大きさなどに割り当てられている。

LoveMiku013

モーフ・ミキサーを閉じるとオブジェクトにモーフが適用され、表情などが変わっている。レンダリングすると次のような画像が出力される。MMDのレンダリング出力に比べると全体的にやや明るい感じになるけど、概ね再現できているように思う。

 

LoveMiku014

スケルゴン（ボーン）については今回まったく手をつけていないので、アニメーションまでは確認できていない。MMDでは、直接他のボーンに接続されていない宙に浮いたボーンを設定できるけど、すべてのボーンが直接接続されていて親子関係で連続している必要があるLightWaveのスケルゴンとは互換性がない。つながっていないボーンを適宜補間する必要があり、そのままでは動かすことはできない。

ウェイト・マップはインポートされているようなので、理論上はボーンの問題さえクリアできればLightWaveでも「らぶ式ミク」を動かせると思われるけど、ポリゴンの数が多くスケルゴンの動きをテストするにも時間がかかるため実際に動かそうとするにはかなりの労力が必要になる。

関連記事