スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

今度は法線マップをマジメにいじってみる

寛永通宝できあがり

去年のアドベント・カレンダーに投稿した光沢マップと、このとき上げ損なったブログ記事、アルファモードに続く、テクスチャ周りのちょっと高度な設定、第3弾ですよ。

法線は英語だとNormal(ノーマル)ですが、ここでの意味は「標準」じゃありませんよ。断じて違いますからねおいこらわかってんのかリンデンラボ(笑)。

さて。

これで何ができるかというと、のっぺりしたオブジェクトの面に、凹凸を作る~正確には「あたかも凹凸があるかのように描画させる」ことができます。


1、法線マップの仕組み

法線マップに使うテクスチャは、まあ、雑な言い方をすれば、ふつうのRGBの画像です。
フルカラーの画像は、赤(R)、緑(G)、青(B)の3原色が、それぞれ256階調を持っています。
このうち、赤と緑の階調を、法線の角度としてビューアに読み込ませ、疑似的に凹凸を描画させるというのが、法線マップの役割です。

赤は、テクスチャの左右方向、右からの光に対する角度、緑は、上下方向、上からの光に対する角度に対応します。
それぞれ、255が光源に正対する法線、0は光源の反対側を表わします。
光源に対して90度、つまり、もとの真っ平らな面では、どちらも128(厳密には127.5であるべきですが)ですね。

この理屈さえわかっていれば、法線マップを自動で作ってくれるソフトやプラグインを持っていなくても、Photoshopの「レイヤースタイル」やGIMPの「フィルター」についている、ドロップシャドウを重ねることで、簡単な法線マップであれば自作できます。

2、メリット

オブジェクトの表面の凹凸は、いちいちポリゴンで作り込むのではなく、法線マップを上手に使うことで、作成の手間だけでなく、頂点数を減らし、ひいてはランドインパクトを大きく減らすことができます。
また、通常プリムでも、表現の幅が広がります。

ちなみにトップ画像の寛永通宝は、通常プリムの「シリンダー」です。
ちょっとそうは見えないでしょ?


3、作りかた

3-0、作例の古銭は、文字の部分が平らで、その周囲が沈んだ形状をしています。
この場合、法線は、文字レイヤーの周囲にできますから、そのまま、ドロップシャドウを適用します。

寛永通宝001

逆に、位牌の銘のように平面に刻まれた文字や、リベットのように出っ張った側に立体感が欲しい場合は、文字やリベットの形状に切り抜いたレイヤーを用意してから、ドロップシャドウを適用します。

リベット001


3-1、背景とレイヤーの色は、どちらもRGBで#8080FFです。青チャンネルは使わないので、#808080とかでも差し支えありません。

3-2、レイヤーにドロップシャドウを適用します。
シャドウといっても、要は着色ですから、例えば影の描画色を白にし、描画モードを「通常」にすれば、光彩と同じ効果が得られます。
シャドウ01
上下方向には、#FF80FFと、

シャドウ02
#0080FF、

シャドウ03
左右方向には#80FFFFと、

シャドウできあがり
#8000FFの「影」をつけます。

Photoshopの場合、レイヤーを4つ複製して、それぞれのレイヤーに、ひとつづつドロップシャドウを適用します。
GIMPの場合はドロップシャドウ自体が独立したレイヤーになるので、元のレイヤーにパラメータを変えながら4回適用すればOKです。ドロップシャドウの不透明度は、すべて50%です。

3-3、出来上がった画像を、png形式で書き出します。

リベットできあがり

こちらはリベットのほう。
平面から出っ張らせたい箇所と、凹ませたい箇所とで、明暗の割り当てが逆になっている点に留意してください。

3-4、ベータグリッドにアップロードしてプリムに貼り、効果を確認します。凹凸の深さは、png画像のコントラストを変えるだけでも、ある程度調整が可能です。

作例できあがり

4、細かい注意点

4-1、オブジェクトの面に貼り付ける際、法線マップを回転させると、ビューアがあるべき光源の向きを勘違いします。
そこで、なるべく回転させなくて済むように法線マップを作るか、回転が避けられなければ、法線マップの作成時に、これを考慮して作るように注意しましょう。

4-2、これも去年のアドベントカレンダーに書きましたが、通常プリムに法線マップを適用する場合、ランドインパクト爆発のリスクがあります!
法線マップを貼る前に、実像の種類が「Convex Hull(凸面の外殻構造)」になっていることを必ず確認してください。

※この記事は、「セカンドライフ技術系 Advent Calendar 2016」に参加しています。
スポンサーサイト

テーマ : Seond Life(セカンドライフ)
ジャンル : オンラインゲーム

ランドインパクト爆発

LI1.jpg

「Build」メニューから、球体を出します。

1プリムなので、ランドインパクトは1です。当たり前ですね。

ここに、テクスチャを用いた光沢を設定します。

LI63.jpg


…ありゃ?
ランドインパクトが妙な数字になりましたよ。

この状態で、球体に「ひねり」を入れてみます…おおお?

LI98.jpg


ちなみに、トーラスをばね状に変形して、ここに光沢を施したりなんかすると…。

LI2243.jpg

ひええ、ランドインパクトが2,243!
1プリムなのに!!

じつは、メッシュの実装と前後して「特徴 / Features」タブ内に設けられた「実像の種類 / Physics Shape Type」を、通常プリムのデフォルトである「プリム / Prim」にしたまま、通常プリムに光沢または法面を設定するか、または、透明部分を持つテクスチャのアルファモードを「アルファブレンディング / Alpha Blending」以外に変更すると、このようなランドインパクトの【爆発】が起こります。
このとき「ひねり」や「テーパー」など、通常プリムを大きく変形することで、ご覧のようにたった1個の通常プリムのランドインパクトが2,000を超えることさえあります。

公共のサンドボックスであればまだよいのですが(よかねーよ)、うっかり自分の土地でこれをやっちゃうと、「土地のプリム数がオーバーした」ことになって、家から家具から商品から、いっさいがっさい返却されて壊滅的な打撃を被ります!

あ、でも、対処法というか予防法はいたって簡単で、Rezしたプリムを変形したり、光沢や法面を設定する前に、「実像の種類 / Physics Shape Type」を「凸面の外殻構造 / Convex Hull」に指定しておけば、ともかくもアホみたいなランドインパクト爆発は起きません。

ConvexHull.jpg

すごく簡単なことですが、さきに書いたとおり、通常プリムは、これがデフォルトで「プリム」になっているので、編集を始める前にまずここを変更しておく、というのは、意外と忘れちゃうんですよね…。



ランドインパクト爆発は、その破壊力から、バグの一種であると考えています。
しかしながら、メッシュオブジェクトが普及したことで、凝った通常プリムの需要が低下しているのか、少なくともまる1年、対応されず放置されているようです。



…と、まあ、今年のアドベントカレンダーの締めくくりには全然ふさわしくないような記事ではありますが…、えーと、えーと、あれですよ、ほら、そういう罠にも気を付けながら、来年も通常プリムで遊べたらいいなあ、と。

め、メリー・クリスマス!

テーマ : Seond Life(セカンドライフ)
ジャンル : オンラインゲーム

アルファモードも真面目にいじってみる。

アルファモードパネル

2012年に始まった、SecondLife技術系アドベントカレンダー。
今年はなんだか、あっという間に全25日分が埋まっちゃったので、コネタをひとつ出しそびれてしまいました。



ということで、カレンダーには載りませんが、今回は、アルファモード / Alpha mode ですよ。

樹木や、窓のある壁面など、透過・半透過部分を持つテクスチャはおなじみですね。
あと、なんといってもスカルプテッド・プリムのUVテクスチャの盗用対策として…いえなんでもないですどうせみんな知りませんよねいいです忘れてください。

さて。

透過/半透過部分を持つテクスチャは、通常TARGA形式で作成・アップロードします。

アルファモードサンプル

PNG24形式との違いは、ピクセル毎の透過度を設定するアルファチャンネルを、RGBチャンネルと別個に持っている、ということです。
このため、TARGA画像ならば、完全に透明なピクセルにも、RGB値を持たせることができます

ここまで、便宜上「透過」だ「透明」だと書いてきましたが、アルファモードをいじる、というのは、このアルファチャンネルを透過以外の目的で使おうじゃないか、ということなのです。



では、実際に見てみましょう。

アルファモード実演

◆ なし / None

透過を無効化します。
アルファチャンネルを持たないテクスチャを貼った場合は、この値に固定されます。


◆ アルファブレンディング / Alpha blending

アルファチャンネルを持つテクスチャを貼ったときのデフォルト値です。
見た目が完全に不透明なテクスチャでも、明度100%単色のアルファチャンネルを持っていれば、こちらがデフォルトとなります。
ご存じのように、アルファチャンネルの明暗が、そのピクセルの透過度を決定します。


◆ アルファマスキング / Alpha masking

アルファチャンネルによる透過を無効化するようです。実質的に「なし」と同じだと思われます。


◆ 放射状マスク / Emissive mask

「放射状」はEmissiveの直訳ですが、本当なら、発光マスク、あるいは明るさマスクとでも意訳すべきモードです。
アルファマスクの明度によって「明るさ最大 / Full Bright」に相当する効果を、ピクセル単位で、よりきめ細かく設定できます。

作例では文字だけを『明るさ最大』にしましたが、例えば、機械のテクスチャでランプやメーターだけ光らせるとか、昼設定でも夜設定でも違和感のない間接照明の当たる壁とか、アイディア次第でいろいろ応用できますよ。

プリムの光沢を真面目にいじってみる。

OlderShininess2.jpg

今年も大詰め、セカンドライフ技術系アドベントカレンダーのシーズンがやってまいりました。
そこで今年は、オブジェクトに設定できる「光沢」について、簡単におさらいしておこうと思います。



2007年、2008年にSecondLifeを始めたクリエイターにとっては、オブジェクトの光沢というのは悩ましい機能でした。
光沢といえば、金属か鏡のような質感の、低・中・高の3段階か、それが嫌なら完全な艶消ししか選べなかった上、半透明や透明な部分を持つオブジェクトには適用できなかったためです。

しかし、メッシュの実装、またはビューアのバージョン3あたりから、より詳細な光沢が実装され、例えば、金属と磁器とプラスチックの光沢を作り分けたり、半透明の表面にガラスのような光沢を与えたり、螺鈿や沈金のように、ひとつの面に異なる光沢をマッピングしたりできるようになりました。

では、具体的なパラメータを見てゆきましょう。



SelectShininess.jpg

「材質 / Texture」タブの「テクスチャ(拡散) / Texture(diffuse)」プルダウンメニューをクリックすると、「凹凸(標準) / Bumpiness(normal)」(*)と「輝き(反射) / Shininss(specular)」という項目が現われます。
* ここでいうnormalは「法面(のりめん)」のことで、「標準」というのは誤訳なのですが、とりあえず実害はないので放っておきましょう。

「輝き(反射) / Shininss(specular)」を選択すると、「輝き / Shininess」というプルダウンメニューが現われ、「なし / None」、「低 / Low」、「中 / Medium」、「高 / High」の選択肢が出てきます。
これらはビューア2以前から引き継がれたパラメータで、これらのいずれかを選択すると、以下のパラメータは使用できません。

ClickHere.jpg

ここで、左のバッテンをクリックすれば、光沢用テクスチャの指定ウィンドウが開きます。
光沢用テクスチャが貼られると、「輝き / Shininess」プルダウンメニューに、「テクスチャを使用 / Use texture」という項目が加わります。

光沢用テクスチャは、グレースケールの画像で、その明度が光沢の強さを決めます。
白(明度100%)が最大、黒(明度0%)で艶消しです。
単色でなくグレースケールの画像を使うことで、ひとつの面に異なる光沢を割り当てることができます。

「光沢度 / Glossiness」では、光の反射の拡散を指定します。
0~255の256階調で、数字が大きいほど金属的な光沢になります。



光沢設定一覧

以上2つのパラメータを実際に適用したものが、この画像です。

「環境 / Environment」では、周囲の光の映り込みを指定します。
数字が大きいほど、鏡面に近くなります。

「色 / Color」で、反射光の色を指定します。

おそらく、くだくだとテキストで説明するよりも、実際にいろいろいじってみたほうが、簡単に感覚が掴めると思います。

質感の作り分け

さらに、去年の技術系アドベントカレンダーomallさんが書いてくださった法面マップと組み合わせれば、通常プリムやローポリゴンのメッシュでも、表現の幅が広がりますよ。

テーマ : Seond Life(セカンドライフ)
ジャンル : オンラインゲーム

スカルプテッド・プリムを使い続けるワケ

Why_Sculptie.jpg

放送部に入っているという、小学4年生の男の子から、質問をもらいましたよ。

面や頂点の配置の自由度は小さいし。
頂点数が固定だから、小さくオブジェクトを作ってもLI(ランドインパクト)減らないし。
1プリムあたりテクスチャは1枚しか貼れないし。
陰影のレベルでシャープな角を出したければ、頂点数を2倍使うし。
描画の精度は低い(各座標軸方向の最小解像度は、長さの255分の1)し。

…欠点だらけなのに、なんでメッシュに完全移行しないんですか?

はい、すみません嘘です、時事ネタに乗っかりました、ごめんなさい。



それにしても、いまだにメッシュでなく、スカルプテッド・プリムを使っているクリエイターは、それなりにいます。
…と、かく言う私もその一人なんですが…。

ええ、もちろん、ちゃんとした理由があるのですよ。


スカルプテッド・プリムのメリット1。
でかくしてもランドインパクトが増えない!

メッシュオブジェクトは、まったく同じ頂点数、同じ形、同じテクスチャでも、サイズを変えるとランドインパクトが変動します。
スカルプテッド・プリムは、小さくしてもLIが減らない代わりに、最大サイズにしてもLIが1プリムあたり1のままです。

Why_Sculptie3.jpg

例えば、画像のニタリクジラは、全長約15m。
スカルプテッド・プリム2個、通常プリム2個でできていて、LIは4です。
その隣の楕円球は、32×32面、つまりスカルプテッド・プリム1個と同じ頂点数を持つメッシュオブジェクトですが、クジラと同じサイズだと、LIは21になりました(アップロード時の設定によって、もっと減らせるかもしれません)。

Rezして使用する大きなオブジェクトを作るときに、スカルプテッド・プリムはとても重宝するのです。

スカルプテッド・プリムのメリット2。
1プリムで、疑似アニメーションが作れる!

例えば、尾びれを動かして泳ぐイルカを作るとします。
スクリプトを使い、尾柄から先のプリムの位置や角度を制御して、実際に「動かす」こと不可能ではありませんが、この場合、プリムの継ぎ目が目立ってしまうので、一般的には、尾びれを上げた形、下げた形と、必要に応じてその途中の形を作っておき、これらをスクリプトで、ストップモーションアニメのフレームのように切り替える、という手法が取られます。

Why_Sculptie2.jpg

メッシュオブジェクトの場合、ひとつのオブジェクトが持てる形はひとつだけなので、フレーム数分の個数のオブジェクトを作って重ねておき、スクリプトではそれらの透明度を順に切り替えることになります。
オブジェクト数が増えるので、ランドインパクトも増します。

Why_Sculptie1.jpg

しかし、スカルプテッド・プリムの場合は、UVテクスチャを変更すれば、自由に形を変えられます。
そこで、フレーム数分のUVテクスチャをコンテンツに入れておき、これをスクリプトで切り替ることで、1プリム、すなわちランドインパクト1のままで、疑似アニメーションが実現できるのです。
ランドインパクトをなるべく減らしたいRez型のオブジェクトでは、この違いは大きいですよ。

しかしながら、儒艮堂の動く海洋生物の中にも、敢えてメッシュで、擬似アニメーションを搭載したものがあります。

クリオネ

それは、クリオネ。

サイズがじゅうぶんに小さく、頂点数もじゅうぶんに少なく、フレーム数分のオブジェクトをぜんぶ合わせたランドインパクトが1に収まるのであれば、いろいろ制約の多いスカルプテッド・プリムにするメリットが何もないためです(あ、言っちゃった…ひとつ前のマイクロスカルプの記事が台無しじゃんか…)。

※ このエントリーは、「セカンドライフ技術系 Advent Calendar 2014」に参加していますよ。

テーマ : Seond Life(セカンドライフ)
ジャンル : オンラインゲーム

プロフィール

儒艮堂店主

Author:儒艮堂店主
SecondLifeで、建築物、樹木、タイニーアバター、海洋生物などを製作中。

最新記事
最新コメント
最新トラックバック
月別アーカイブ
カテゴリ
検索フォーム
RSSリンクの表示
リンク
ブロとも申請フォーム

この人とブロともになる

QRコード
QRコード
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。