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.

1. Custom Fabric Shader
for Unreal Engine 4
Gregory Dongseok Kim
2016-04-11

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. 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. 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. 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. 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. 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. 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. 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. 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. 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. 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. 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. 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. My approach - Specular (3)
￭ Roughness value
⚬ GGX: 0.65
⚬ The Order: 1.0
⚬ My approach: 1.0
15

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. My approach - Fiber Scatter Term (2)
￭ Wrap lighting
17

18. My approach - Fiber Scatter Term (3)
￭ Linear interpolation between two types of fresnel
18

19. My approach - Final
19

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. Result - Fabric examples (1)
21
Cotton
Velvet

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. 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. 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. 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