【Live2Dアプデ進捗6&解説】とんでもないクオリティの眼鏡が出来てしまいました&眼鏡レンズ屈折表現の作り方 (Pixiv Fanbox)

bandicam 2022-05-31 11-27-52-150

我天才では！？！？！？！？(n回目の自画自賛)

恐らく史上初(じゃなかったらごめんなさい)、

メガネレンズの屈折を取り入れたLive2Dモデルが誕生しました

今までの進捗を見て「乾物ひものにメガネが無いなんて！！！！」とショックを受けていた生粋のメガネ好きの皆様にもきっと満足していただける出来になっているのではと思います！！！！

まだ細かいレンズの反射だったり眼鏡のつる部分だったり足りないパーツもいくつかあるのですが、まずはリムやレンズ部分の反射・屈折表現が上手く行ったのが嬉しすぎて見せびらかしたくなってしまったので記事を更新いたしました！

今回もいつも通り、工夫した点について簡単に解説していきたいと思います！

◆工夫した点①：メガネのデザインが良すぎる

そもそもの話、メガネのデザインが新しくなっていることにお気づきでしょうか！

新モデル進捗記事を最初の方から追いかけてくださってる方ならご存じだと思うのですが、当初は今までかけていたのと同じようなゴールド&べっこう柄のメガネにする予定だったんです。

しかし、プロの方にお頼みした新衣装のデザインがとてもクールでスタイリッシュで最高だったため、それと合わせたときにどうしても普遍的なデザインのメガネが浮いてしまい、「それならばメガネのデザインも一風変わったものにしよう！」と思い立ったのです。

色味はインパクトが強く目元が引き立つ黒縁に変更しました。

そして！！！何と言っても！！！！

ここ！！！！！！めちゃくちゃ可愛くないですか！！！！！！！！

「涙メガネっぽい感じの意匠を取り入れたいけどどうもしっくりこないなぁ」と悩んでいた時にふとひらめいたのです、「魚の尻尾っぽいデザインにしたら可愛いのでは！？」と！それをデザイナーさんにお伝えしたら最高の形で取り入れてくださいました。

ヘッダーはこの魚の尻尾部分を絶妙にトリミングして映らないようにしていますのでこの記事が初めての先行公開になります。近日中に全体に向けても公開するつもりですのでそれまではメガネのデザインについてはどうぞ内緒でお願いします🤭

◆工夫した点②：レンズの屈折

ヘッダーの写真だけTwitterに先に投稿しちゃってたんですけど、結構色んなモデラーさんが「レンズの屈折どうやってるの！？」って反応してくださってて有難い限りです。

おそらく皆様「クリッピングとか使って力技で出来なくもないけど…」と考えてらっしゃると思うんですけど、その方法で合ってます。

まずはこのようにメガネの周りをぐるっと取り囲むマスク用アートメッシュを作ります。

リムとの境界はリムのアートメッシュをコピペし、グルーで繋いでリム側の重みを100にしておきます。

bandicam 2022-05-31 12-06-31-144

こうすることで顔を動かすとマスクの境界も勝手に着いてきてくれます。

見た目がシュールですね。

マスク用アートメッシュは不透明度を0%にしておきましょう。

なんで「レンズの中」じゃなくて「レンズをぐるっと取り囲む」形のアートメッシュにしてるかは後述します。

次にレンズに掛かる部分のアートメッシュをデフォーマやグルーごと全て複製し、一つの回転デフォーマにまとめます。クリッピングがぐっちゃぐちゃになるので再整理が必要だし一気にコピペした事でエディタが死ぬほど重くなるしでこの作業が一番大変でした。

かなり面倒ですが混乱しないように屈折用のオブジェクトすべてに(メガネ用)と名前を付けて通常のものと混同しないようにすると何とかなると思います…。

名前付けはctrl+Fで出てくる「検索と置換」がめちゃくちゃ便利です。

コピペが何とかなったら、あとは先ほどのレンズをぐるっと取り囲むアートメッシュをコピペしたアートメッシュのクリッピング欄に入れ、「マスクの反転」にチェックを入れることで…

bandicam 2022-05-31 12-13-23-024

あら不思議！レンズの内部のみを自在に動かせるようになりました！！

何故わざわざマスクの反転を使用したかというと、Live2Dの仕様上「クリッピングとマスクの反転を併用する」「2枚のアートメッシュメッシュが重なっている部分のみクリッピングする」などの特殊な条件のクリッピングが出来ないからなんですね。

(理系的に言うとand条件とかnor条件とか言うらしいんですけどその辺の知識が全くないので上手く説明できずすみません。)

以前髪の毛の解説でお話しした通り、後ろ髪のサイドにはインナーカラーをクリッピングしているのですが、

このクリッピングを保ったまま更にレンズ内部にのみクリッピングしようと思うと、

めちゃくちゃめんどくさいですがお互いの反転マスク用アートメッシュを作ったうえで二つともクリッピング欄にぶち込んでマスクの反転にするしかないんですよね

先ほどのレンズマスク反転用アートメッシュも表示させるとこんな感じ。これで青枠の中のみクリッピングされるようになります。恐らく理系的に言うとnor条件ってやつだと思います。

Live2D本社のデザイナーチームが使ってる特殊なCubism Editorだとこのクリッピング条件を色々弄れるらしいんですけど、残念ながら我々一般モデラーが使うEditorには4.2現在も未実装ですので、応急処置でこのマスク反転ゴリ押しは覚えておいて損は無いと思います。

話が長くなってしまいましたが、ここまで出来たらあとはまとめた回転デフォーマの倍率を「98%」と少し小さくし、上下左右を向いた時に微量に動かして屈折を表現させるだけです。

bandicam 2022-05-31 13-14-43-464

★ここでレンズに関する小話

実際にメガネを掛けている方なら「近視用メガネはレンズの中が小さく見える」「遠視用メガネはレンズの中が大きく見える」というのは何となく知ってるんじゃないかなぁと思います。私もそのノリで当初は何も考えずに内部をへこませようと思ったんですが、その前に実際に眼鏡をかけて自撮りしてみたところ、あら不思議、大きく横を向いた時は逆に輪郭が出っ張って見える時があったんです。

「なんでそういう原理になるか分からないけどそう見えたからとりあえず実装してみよう」のノリで当初は横を向いた時のみ内部を出っ張らせてました。

↓※斜めを向いた時は凹ませてます

この「出っ張る時」「凹むとき」の違いがよくわかっていなかったのですが、Twitterで有識者の方から「近視用で使われる凹レンズは「レンズ中央に向かって」縮小して見えるらしいので、実体がレンズ中央よりも内側に入った時に外側に出っ張って見える」という素晴らしいアドバイスを頂きました。

分かりやすいように図で説明すると、近視用のレンズはこのようにレンズ中央に向かって中が小さく見えます。(分かりやすいように極端に表現してます)

そして、大きく横を向いた時は輪郭線がレンズの中心より内側に入ってしまうので、逆に中心に向かって引っ張られて出っ張って見えるのです。

メガネ好きの方には周知の事実なのかもしれませんが私は初めて知ったので目から鱗でした。また一つ賢くなってしまった！

それで言うと

最初の画像は中心点より実体(輪郭)が外側にあるので、実際にはまだ凹んで見える角度なのが分かりますね。

それを速攻で修正したのが今回のヘッダーでした

以前からお伝えしている通り、このモデルは最低でも横向き90°まで動かす予定なので、もっと可動域を付けたときには出っ張る処理も入れてリアルさを出したいなと思ってます。

また。今回は左右のレンズ内部を一つの回転デフォーマで管理してますが、本当は左右で分けた方が厳密な処理になると思います。しかしそんなことをしていたらクリッピング枠がいくらあっても足らないので今回は変化が分かりやすい外側の目を優先して屈折を作りました。

他にもリムの厚みや反射光など色々工夫した部分が沢山あるのですが、記事が長くなりそうなので続きは次回にします！

ちなみに、次回お話しする「リムの厚み」「反射光」「メガネの落ち影」を無くすとこんな感じになります。

急に平面感が増したというか、レンズの厚みが消えたように見えますね。

レンズの屈折だけでなく、次回お話しする部分もメガネのリアル感を出すにはとても大切な工程というわけですね！

それでは今回はここまで！