什麼是視差貼圖?

視差貼圖是一項可為電腦產生的圖形增添紋理表面深度和細節的技術。
視差貼圖是一項熱門工具,不需要將額外的多邊形加入 3D 模型,就能營造出表面細節的錯覺。這項技術可讓紋理在不同視角下顯示凸面和凹面等不規則形狀。

a textured bluetooth speaker
雖然視差貼圖是進階功能,但只要有正確的 3D 建模工具,就能輕鬆實作。在本指南中,我們將說明視差貼圖的運作方式、分享一些技術,並說明其實際應用。

視差貼圖入門

什麼是視差貼圖?

視差貼圖是一種紋理,可說明表面細節的深度或高度,類似於地形圖。

例如,如果您看一下磚牆的 3D 圖形,它看起來很平坦,沒有特殊效果。但視差貼圖會為平面影像增添凹陷的灌漿線,使磚牆看起來更逼真。這項技術透過操作紋理使其在 2D 空間中呈現 3D 外觀,藉此「欺騙」眼睛。

這項技術可應用在許多方面,包括:

  • 電玩遊戲
  • 電影和動畫
  • 虛擬實境和擴增實境
  • 網頁設計

深度知覺的基本概念

您的眼睛和大腦會協同合作來處理視覺資訊並感知深度。您的大腦透過雙眼線索來決定深度,藉由比較左眼與右眼所看到的影像來建立一張完整影像。這可協助您判斷深度。

但我們也可以只用單眼來判斷深度,多虧有了單眼線索。視角、陰影、相對大小和紋理漸層會告訴您的大腦有關深度的重要資訊。

視差貼圖的運作取決於人腦感知深度的方式。當您移動時,較近的物件會比較遠的物件更快速移動。視差貼圖利用此原則使物件紋理因應您的角度而改變,藉此模擬您的大腦預期看到的深度。

例如,當乘坐汽車時,附近的樹木似乎快速掠過,而遠處的山脈則緩慢移動。這種運動差值可為您提供深度感。視差貼圖透過讓近距離細節稍微移動多一點來模擬這種體驗,從而在平坦表面上給人深度的錯覺。

視差紋理

視差紋理也稱為高度圖或置換貼圖。這些是灰階影像,其中不同色度的灰色代表表面細節的高度。較淺的灰色表示凸起區域,而較深的灰色則表示較低的區域。

這些紋理可讓您為平坦表面增添深度,而不需要加入更多的多邊形。這使得視覺效果更加逼真,而不會影響速度或載入時間。

視差貼圖使用紋理來指出主要紋理的每個部分應如何根據觀眾的角度而改變。此貼圖的演算法會解譯視差紋理的灰階值,以建立更逼真的影像。

建立視差紋理

若要產生視差紋理:

  1. 從一張基本影像開始。 這是您所要複製表面的平面紋理影像,例如磚塊、瓷磚或石頭。
  2. 決定高度。 將應該凹凸的紋理部分視覺化。
  3. 以灰階顯示。 使用圖形編輯器以不同色度的灰色繪製區域 — 淺色表示凸面區域,深色表示凹面區域。
  4. 微調設計。 模糊和對比處理紋理,使所有區域之間的轉場效果更流暢。

您也不需要手動執行此操作。Adobe Photoshop 隨附製作和微調灰階影像的工具。Adobe Substance 3D 是更進階的工具,只要按幾下,就能建立視差紋理。

視差貼圖技術

視差貼圖的運作方式

視差貼圖會根據以下幾個基本原則運作:

  • 紋理偏移。 視差貼圖是透過偏移紋理座標來運作。它會根據觀眾的視角來移動紋理樣本,營造出深度的錯覺。
  • 高度圖和置換貼圖。 視差貼圖使用灰階圖來引導紋理偏移的程度。
  • 視角。 視差貼圖效果會根據您觀看表面的角度而改變。隨著角度變化,偏移也會調整以模擬 3D 表面。

假設您正打開書本閱讀。每一頁代表紋理中的一個深度等級。如果您以垂直角度直視這本書,您會清楚看到每一頁。但如果您傾斜書本,則離您較近的書頁會遮住較遠的書頁。視差貼圖使用高度圖在 2D 紋理上模擬這種效果,以指出哪些紋理離您更近或更遠。

逐步視差貼圖指南

視差貼圖是一項進階技術,但 Substance 3D 之類的工具可讓您輕鬆進行。如果您是初學者,請遵循下列秘訣:

  • 從某個紋理開始。 這可以是磚牆、圓石路或瓷磚地板。
  • 建立高度圖。 使用 Photoshop 之類的軟體將紋理轉換為灰階。
  • 使用繪圖處理引擎。 大多數繪圖處理引擎 (例如 Unity) 都支援視差貼圖。匯入您的主要紋理和高度圖。
  • 套用視差貼圖著色器。 指派著色器或材質,為您的紋理加入視差貼圖,並將其連結至您的高度圖。
  • 調整參數。 調整視差效果的強度,以取得理想的深度錯覺。
  • 從不同的角度觀看。 四處移動您的相機,看看紋理會如何隨著您改變角度進行調整。

這些是可協助您開始使用的快速秘訣,但請勇於自行嘗試使用視差貼圖。

視差貼圖的優點

視差貼圖提供許多優點,包括:

  • 提升真實感。 視差貼圖為影像提供更具質感的外觀,以模擬真實世界使用者體驗。
  • 情緒沉浸感。 提升真實感會影響遊戲和動畫的述說故事能力,以生動呈現故事。
  • 最佳化的效能。 視差貼圖透過操作紋理來增添深度,而不是加入更多的多邊形。其渲染速度更快,這對於電玩遊戲等即時應用很有幫助。

實際應用

視差貼圖非常適合各種應用,例如:

  • 電玩遊戲,包括虛擬實境
  • 建築模型
  • 製造商和零售商的產品視覺化

從平面到 3D:Substance 3D 中的視差貼圖

視差貼圖徹底改變了從電玩遊戲到網頁設計的各種應用。這項技術為設計注入生命,並為平面 2D 影像增添更多細節。

若要了解視差貼圖的強大功能,最佳方法是在您自己的設計中嘗試。嘗試使用 Adobe Substance 3D 來製作躍然於螢幕上令人驚豔的複雜圖形。

常見問題集

凹凸貼圖與視差貼圖有何不同?

這兩項技術都可以模擬表面的深度,而不需要加入額外的幾何形狀。不過,凹凸貼圖使用灰階凹凸貼圖來模擬紋理的高低點,這會影響其反射光線的方式。當您從某個角度查看時,凹凸貼圖看起來很平坦。

視差貼圖更進一步,根據觀眾的視角偏移紋理座標。這為紋理提供更多深度。

法線貼圖與視差貼圖有何不同?

法線貼圖使用 RGB 色彩來表示表面上法線的方向。它給人複雜表面的錯覺。視差貼圖是表示表面細節高度的灰階影像。

視差遮蔽貼圖可以做什麼?

視差遮蔽貼圖 (POM) 可模擬表面上的自屏蔽,以產生逼真的深度錯覺。它透過高度圖追蹤來自觀眾的光線,一直到光線照射到表面,因此可以渲染表面上的細節。

視差是否會影響效能?

是的。這比加入多邊形更有效,但與平面紋理相比,仍然需要更多的運算能力。基本視差貼圖對效能的影響很小,但更進階的技術 (例如遮蔽貼圖) 則需要更多的運算資源。

https://main--cc--adobecom.hlx.page/cc-shared/fragments/products/substance3d/bottom-blade-cta-s3d-collection