Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Custom fabric shader for unreal engine 4

11,604 views

Published on

How to implement realistic fabric material by Unreal engine?
This slider shows the way. You can make realistic and physically correct fabric shader by this method.

Published in: Software

Custom fabric shader for unreal engine 4

  1. 1. Custom Fabric Shader for Unreal Engine 4 Gregory Dongseok Kim 2016-04-11
  2. 2. ■ Two types of Fabric ⚬ Non-Metal: Cotton, denim, flax and common fabrics ⚬ Metal: Silk, satin, velvet, nylon and polyester ■ The Order approach ■ Limitations of Unreal Engine shader ■ My approach ⚬ Oren-nayar diffuse shading ⚬ Specular Term ⚬ Fiber Scatter Term ■ Result Overview 2
  3. 3. Two types of Fabric: Non-Metal ■ Cotton, Denim, Flax and Common fabrics ⚬ Tiny furs on each fibers ⬝ Roughness value of those fabrics is always 1.0 unless they wet ⬝ Reflect lights to random directions ⬝ It induces not only front scattering but also back scattering Fuzz on rim part ⚬ Specular lobe is widely spread on view direction surface ⬝ Specular color is white but it is looked like desaturated color of base one because of front scattering 3
  4. 4. Two types of Fabric: Metal (1) ■ Silk, Satin, Velvet, Nylon and Polyester ⚬ Silk has round triangular cross section and smooth surface ⬝ It induces simiral reflection with metal ⬝ Smooth surface: Reflects lights as perfect as metal surface ⬝ Triangular cross section: Reflects specific light wave ⚬ Silk can have Roughness value around 0.3 - 0.7 ⬝ Thickness of each fibers is 5 - 10 μm ⬝ Thin to make smooth surface as metal 4
  5. 5. Two types of Fabric: Metal (2) ■ Special properties of Silk and Satin ⚬ They have much less fuzz on rim part then cotton or common fabrics ⬝ Their intensive structure makes similar specluar with metal’s one ⚬ They can have various specular colors ⬝ If they are woven by different colors strings ⬝ Specular color can be changed by view direction ⚬ They have anistropic specular shape 5
  6. 6. Two types of Fabric: Metal (3) ■ Special properties of Velvet ⚬ Tiny fibers are attached on the surface ⬝ Its Roughness value has to be 1.0 ⬝ If the light is behind, those fibers give foward scattering and it gives rim light effect on edge part ⚬ Diffuse shading is simiral with metal’s diffusion ⬝ Its surface color is darker than original color of fibers 6
  7. 7. The Order approach1 ■ Custom microfiber model ⚬ Ashikhmin’s Distribution based BRDF for fresnel term ⚬ Inverse Gausian for specular term ⚬ No geometry term to improve rim light effect ⚬ Smoother specular than GGX ■ Future works ⚬ Ambient specular ⚬ Modify fresnel term to match with direct light 7
  8. 8. Goal of my approach ■ Shading model for every types of fabrics ⚬ From cotton to velvet ⚬ Easy to use for artists ■ Technical perspective ⚬ Oren-nayar diffusion ⚬ Specular term for fabrics ⚬ 2 colors specular ⚬ Fresnel term which is toward to light direction 8
  9. 9. Limitations of Unreal Engine shader ■ Hard to implement custom shading model ⚬ Diffuse shading: Lambert ⚬ No way to change specular model ■ Base Color slot can be only available slot to input custom shading code, but ⚬ The value is clamped as 0.0 - 1.0 ⚬ Range of value is too narrow to use specular light Fortunately, fabrics do not need strong specular, so its specular can be implemented to Base Color 9
  10. 10. My approach - Diffuse term (1) ■ Oren-nayar diffuse shading ⚬ Based on Pope Kim’s approximation ⚬ It is not matched with real Oren-nayar shading, but its quality is great, cheap and easy to implement ■ Removing (n∙l) from the original code 10 1
  11. 11. My approach - Diffuse term (2) ■ Replace (n∙l) to 1.0 ■ Output value multiplys Base Color ■ If surface is smooth(Roughness = 0.0), than uses Unreal default diffuse shading 11
  12. 12. My approach - Specular (1) (Fresnel Term × Specular) + Fiber Scatter ■ Fresnel Term ⚬ Fuzz on rim part ■ Specular Term ⚬ Customized inverse gausian specular ⚬ For describing back scattering ⚬ Secondary specular lobe ■ Fiber Scatter Term ⚬ For describing front scattering ⚬ Primary specular lobe 12
  13. 13. My approach - Specular (2) ■ Fresnel term ⚬ Based on Schlick Fresnel approximation1 ⬝ ⚬ Modified 5th power of 1 - cosθd to 4th power for increasing rim lighting effect 13
  14. 14. My approach - Specular (3) ■ Specular Term ⚬ Based on The Order’s approach ⬝ iverse gausian specular ⚬ Not related with Roughness value, but much simpler equation ⬝ Result is simiral with The Order’s approach when Roughness value is 1.0 ⬝ I premise every non-metal fabrics’s roughness value is 1.0 If fabric surface has lower roughness than 1.0, using Unreal default specular term Primary specular is implemented in Fiber scatter term ⚬ Masking fresnel term and it induces light direction toward rim lighting 14
  15. 15. My approach - Specular (3) ■ Roughness value ⚬ GGX: 0.65 ⚬ The Order: 1.0 ⚬ My approach: 1.0 15
  16. 16. My approach - Fiber Scatter Term (1) ■ Fiber Scatter Term ⚬ Wrap lighting for front scattering ⬝ Week transmission effect for the eye facing surface ⬝ Can be used as a secondary specular color for metal fabrics such as Silk or stain ⚬ Linear interpolation between two types of fresnel ⬝ First one is wider ⬝ Second one is narrwer ⬝ Blend them by fabric scatter amount value Can describe from fuzzy cotton to smooth denim ⬝ Fabric scattering color is multiplied to this value 16
  17. 17. My approach - Fiber Scatter Term (2) ■ Wrap lighting 17
  18. 18. My approach - Fiber Scatter Term (3) ■ Linear interpolation between two types of fresnel 18
  19. 19. My approach - Final 19
  20. 20. Result - Fabric scatter amount compare ■ Define which part will use fabric scatter color ⚬ If the value is 0, than rim part will use fabric scatter color ⚬ If the value is getting increased, area of fabric scatter color is getting wider ⚬ If the value is 1.0, most of surface is fabric scatter color and rim part is base color 20
  21. 21. Result - Fabric examples (1) 21 Cotton Velvet
  22. 22. Result - Fabric examples (2) ■ Hint to make good look fabric material with my approach ⚬ Set Metalic value for ratio of silk fibers in the fabric ⚬ Only Metal fabrics can have lower Roughness value than 1.0 ⚬ Do not use Normal map to describe patterns on silk surface ⬝ Using different values of Roughness for pattern and non-pattern part 22 Satin
  23. 23. Recomend values for fabrics 23 Fabric Types Metalic Roughness Fabric Scatter amount Cotton or ordinary fabrics 0 1 0.5 Velvat 1 1 0 Silk, Satin 0.8 - 0.9 0.35 - 0.7 1
  24. 24. Bibliography ■ Page 3 ⚬ image 1: http://www.apparelsearch.com/fibers.htm ⚬ image 2: http://www.trimfabric.com/nv-97.html ■ Page 4 ⚬ image 1: https://www.asahi-kasei.co.jp/fibers/en/cupro/what/function1.html ⚬ image 2: https://quizlet.com/92490419/intro-2-textiles-test-1-flash-cards/ ⚬ image 3: https://quizlet.com/92490419/intro-2-textiles-test-1-flash-cards/ ■ Page 5 ⚬ image 2: https://wallpaperscraft.com/download/silk_material_soft_light_50576/3840x2160 ■ Page 6 ⚬ image 1: http://www.bloomsburgcarpet.com/resources/weave-structures ⚬ image 2: http://www.textilestock.in/productdetail/47/Fabrics-HomeFurnishingFabrics-Velvet-Velvet-Stock.html 24
  25. 25. Bibliography ■ Page 7 ⚬ citation 1: Neubelt, David, Matt Pettineo, and Ready At Dawn Studios. "Crafting a Next-Gen Material Pipeline for The Order: 1886." part of “Physically Based Shading in Theory and Practice,” SIGGRAPH (2013). ■ Page 10 ⚬ citation 1: http://www.slideshare.net/blindrenderer/rendering-tech-of-space-marinekgc-2011 ■ Page 13 ⚬ citation 1: Schlick, Christophe. “An inexpensive BRDF Model for Physically-based Rendering.” Computer graphics forum 1 Aug. 1994: 233-246 25

×