次世代遊戲貼圖的概念和製作

導言：

本教程詳細的介紹了次世代遊戲貼圖的概念，對實際生產中的一些製作要點進行了分析，對遊戲製作者有很大的幫助。

下麵教程開始

次世代貼圖和傳統貼圖的比較

造成差別的主要原因有兩點，一是由於圖像技術的突破，二是貼圖數量的提高。這兩個因素使得次世代貼圖在發揮上有了更大的空間。（圖01）

圖01

1、彩色貼圖肩負多重責任，高光陰影、深度的三維效果都要同時通過貼圖表現出來。

2、高光和陰影不會因光源方向的變化而改變。

3、貼圖尺寸小，為了節省貼圖，所以用四方連續貼圖來貼滿整個麵牆，容易看出有重複，影響畫麵品質。

4、細節均勻，因為需要大量的四方連續的關係，所以不能有特別突出的細節。

5、整體的立體感較弱，傳統貼圖隻能表現比較緩和的高光和陰影，太強調貼圖本身的光影會對遊戲場景裏實際光源的打光效果產生幹擾。（圖02）

圖02

1、除了彩色貼圖之外，還有法線貼圖（Normal map）、高光貼圖（Specular map），有的還用凹凸貼圖（Bump map），是幾張貼圖組合成的一套貼圖。

2、高光和陰影可以隨光源方向的變換而有相應不同的光影效果，有了法線貼圖（Normal map）、高光貼圖（Specular map），透過貼圖上所提供的信息，即可以隨著光源的方向的不同而做相應的光影效果運算。

3、高精度的貼圖畫麵，貼圖尺寸比較大，四方連續的次數少了，可以加入更多獨特的細節。

4、很好的三維效果，通過法線貼圖（Normal map）、高光貼圖（Specular map）、凹凸貼圖（Bump map）的組合可以產生很多微妙的立體細節變化。

5、豐富的貼圖細節，以前因為貼圖限製而無法深入的細節現在可以有進一步的發揮。

什麼是次世代貼圖

次世代貼圖是由彩色貼圖（Color map）、法線貼圖（Normal map）、高光貼圖（Specular map）、凹凸貼圖（Bump map）的組合而成的一整套貼圖。

每個部份所發揮的功能說明如下：（圖03）

圖03

法線貼圖（Normal map）記錄了貼圖裏每個像素的法線方向，它不能當成一般的貼圖來看，它記錄了圖麵上每一個像素的法線向量數據。（圖04）

圖04

高光貼圖（Specular map）記錄了貼圖細節的高光及受光度，這個貼圖跟法線貼圖是互相搭配的，圖麵上的立體的效果其實是靠高光體現出來的，高光貼圖可以針對局部高光做結構上的突顯和強化，達到更真實的視覺效果（針對高光貼圖在下麵的文章中做進一步的說明）。（圖05）

圖05

 #p#e#

凹凸貼圖（Bump map）是通過灰度貼圖來得到細節實際凹凸的信息，然後在三維空間中進行準確的位置運算，有一點需要提醒的是，如果貼圖中有比較明顯的凹凸才需要用到凹凸貼圖。如果凹凸不太明顯則用凹凸貼圖的效果並不大。（圖06）

圖06

法線貼圖和高光貼圖的原理和作用

對於上麵提到的四種貼圖，很多的讀者可能會對法線貼圖（Normal map）及高光貼圖（Specular map）比較陌生或是隻有一個模糊的概念。針對這兩種貼圖，我們談談它的基礎運算理論，在不提及運算方程式的前提下，做一個比較直觀的分析。（圖07）

圖07

模型麵受光度的判斷

在繪圖程序裏一個模型平麵的受光度如何來判斷呢？如果以0-1的程度來算，0是最暗，1 是最亮的話，兩個向量長度是1的向量相乘的結果就決定了這個平麵的亮度。所以當入光向量和模型上的平向夾角的小的話，表示這個模型麵直接麵對光源，所以會很亮，反之如果夾角大的話，表示模型麵不直接麵對光源，所以會比較暗，當然如果是背光的情形的話，兩個向量相乘結果小於0，就會是全亮。（圖08）

圖08

法線貼圖和受光度的關係

法線貼圖的作用就是把麵上的法線方向利用貼圖提供的信息來改變其方向，我們可以把貼圖裏的每一個像素都當作是模型上的一個平麵，用RGB三個原色記錄了每個像素的法線方向（x、y、z）值，自運算時先讀了模型的法線方向之後，再用法線貼圖上的RGB也就是x、y、z值算一次。（圖09）

圖09

在此，遊戲貼圖上的法線方向已經不再是傳統定義中垂直於平麵的法線了，這點請一定要注意，不要弄混了。

下圖是由一張法線貼圖上針對其中的一個像素的法線方向做的分析（這隻是一個概念性的說明，可能會和程序上實際的運算的數值和流程會有點偏差）。（圖10）

圖10

有些不了解這個原理的美術人員可能會試圖在Photoshop裏直接修改，事實上這幾乎是不太可能的事，因為它並不是直觀的彩色貼圖，與其說它是貼圖，不如說它是儲存數據的數組。

法線貼圖（Normal map）的生成

法線貼圖的生成方法有兩種，一個是通過三維軟件的功能（Maya裏是通過surface sampler，3ds Max是通過Render to texture）把同一個模型的高低版本對在一起，然後把高模的細節生成法線貼圖記錄下來，另一個方法是通過Photoshop裏NVIDIA 提供的nvtools，把Bump貼圖提供的高度信息，轉成法線貼圖。（圖11）

圖11

在Bump貼圖裏，亮部（淺色）是代表比較高的位置，相對的暗部（深色）就比較低，就是利用這種高低關係來換算出每個像素位置的相對高度，然後針對這個高度關係所形成的曲麵算出其相應位置的法線角度，進而轉換成法線貼圖。（圖12）

圖12

有一點需要特別提醒的是，一旦生成了法線貼圖，不但無法用手繪的方式去針對細節上做任何改變，也無法把法線貼圖轉回灰階的凹凸貼圖。

 #p#e#

高光貼圖的原理和作用

高光貼圖在定義上是針對某特定的角度範圍反光，而不是全範圍的漫射光。基本上高光的亮度是取決於麵的法線方向、攝像機和光源的平均方向，除此之外，高光貼圖還可以反映不同的材質，例如金屬的反光範圍較小，比較接近全漫射光，而且高光還可以體現結構的光滑程度。（圖13）

圖13

由於需要考慮的因素較多，高光貼圖如果直接由凹凸貼圖或彩色貼圖去色直接生成，都無法準確地反應細節上的細致程度，所以高光貼圖還是需要一定程度的手繪來加強其效果。

次世代貼圖的製作流程

1、選擇一張好的貼圖來源圖片，可以對高質量的貼圖產生事半功倍的效果，以下是幾點需要注意的：（圖14）

圖14

a、來源圖片精度大於我們最後想要的貼圖精度。

b、來源圖片的光源不能太亮或太暗，最能準確保留材質顏色的層次和細節的是在一個明亮的陰天，如果是太陽天，亮部會因為曝光過度而失去了顏色的彩度，而且會有很多的過度受光和陰影需要處理掉，如果是陰暗的天氣，同樣的材質的顏色會失去它的彩度，尤其是暗麵，會因為過暗而失去它的細節。

c、來源圖片沒有太大的透視角或變形，照相機鏡頭用的鏡片本身就不是平的鏡片，所以照出來的圖片多多少少都會變形，如果變形過大，要調平整的話，會犧牲掉來源圖片的畫質。

d、來源圖片本身就有豐富的細節內容。

2、對圖片做處理及裁剪。

a、將圖片拉平整，把透視變形修正。

b、將圖片大小以遊戲的規格切割。（圖15）

圖15

3、用ZBrush把細節用模型雕出來，生成法線貼圖（Normal map）。

用早期的一些法線貼圖製作是用Photoshop的插件直接將彩色貼圖去色來完成，這種做法會使法線貼圖的質量有很大的損失，所以現在往往直接用高模生成法線貼圖。ZBrush是一個很好用的工具，可以很快地把高模建出來。（圖16）

圖16

在ZBrush建出一個方塊平麵，然後細分。（圖17）

圖17

 #p#e#

將彩色貼圖貼在方塊上。（圖18）

圖18

把圖片上的凹凸雕出來。（圖19）

圖19

完成整張貼圖，在邊緣部份用四方連續的處理方法，或在Photoshop裏修凹凸貼圖。（圖20）

圖20

導出法線貼圖和Alpha通道貼圖，先在ZBrush的材質文件夾中導入NormalRGBMat這個材質，會發現模型變成法線貼圖的顏色，然後再用MRGBZGrabber工具把圖片截下來，然用Export的方式導出圖片（生成法向貼圖時我們並不是直接用截下來的法向貼圖，而是用生成的Alpha 通道貼圖再在Photoshop轉換）。

4、生成法向貼圖

我們利用截下來的Alpha通道貼圖做進一步處理，其實Alpha通道貼圖就是凹凸貼圖，我們可以利用凹凸貼圖做進一步的圖像編輯。

先把凹凸貼圖的接縫處理掉：（圖21）

圖21

加入細部紋理，用彩色貼圖去色，以1%~5%的透明度疊放在凹凸貼圖上，利用Photoshop的nvtools的插件將灰階的凹凸貼圖轉成法線貼圖。（圖22）

圖22

 #p#e#

5、製作高光貼圖

製作高光貼圖需要將來源貼圖去色，過濾出高光的部份。注意凹凸貼圖所提供的凹凸信息，凸起的部份本身受光度就比較高，凹下去的地方不太受光，將這兩個貼圖適當的調整對比度後疊加，然後因材質的不同整體調整灰度來區別其受光度，再針對特定的細節或結構來調整。（圖23）

圖23

6、完成彩色貼圖

彩色貼圖不能帶高光陰影，如果彩色貼圖帶有高光陰影會幹擾遊戲場景中實時的光影效果，所以高光陰影需要去掉。（圖24）

圖24

7、檢視結果

在Maya或3ds Max裏建一個四方平麵，以Maya為例，把彩色貼圖放在Color通道，把法線貼圖放在Bump通道，把高光貼圖放在Specular Color通道，就可以看到結果，如果對結果不滿意就再回頭調整一下相應的貼圖。（圖25）

圖25

高質量的次世代貼圖需要符合的幾個條件：（圖26）

圖26

顏色貼圖：

應該用很高精度的來源圖片製作，不但要高精度，而且還要有豐富的細節，要盡量可以四方連續以達到最高的利用率，貼圖的精度必須符合製作上的需要，在選用來源圖片時如果精度不夠會使貼圖的細節達不到要求。

高光貼圖：

高光對強化凹凸貼圖和法線貼圖的凹凸感有很大的幫助，可以創造出更真實的感覺，通常手繪高光貼圖會比直接用Photoshop轉的好。

法線貼圖：

這是從貼圖上增加細節，而不是直接把高精度的三維模型放在場景中。因此它是很耗資源的，需要有效的利用，它和其它的法線貼圖連續融合在一起會更好。

次世代的貼圖相當強調真實度，它所要營造出來的是一個虛擬的遊戲世界，用來構建這個想象世界的元素，需要和真實的世界有一定的關聯，美術人員除了要有很好的審美能力之外，還要對這個真實世界的細節有很好的觀察力，把有趣的元素和細節表現在貼圖上。