Introduction to materials
Materials form an integral part of the 3d product configurator. They allow the users to configure color and possible type of the material on the product under configuration. There are some important aspects of variables that are used in 3D in order to be able to represent material's realistically.
Materials are configured in 3 property sets under the 3D product configurator: Root Propertyset, PBR Propertyset and TilingTexture Propertyset
RootPropertyset, which cover the Thumbnail picture of the material visualised in many parts of the application, including the planner as a image to the user, and the DisplayName and Description parameters, which show the name and description in the planner to the user, both localizable parameters.
Note
It is recommended the material texture images be about 512 x 512 pixels in size, or at maximum 1024 x 1024 pixels if very high resolution is required. Also the texture images should be square in form (same width and height). These two factors together make sure there are no performance issues either due to big download sizes (image size) or rendering computation complexity (non square images). The classic image sizes are 128x128, 256x256, 512x512, 1024x1024, etc. Also, if the images are fairly big, for example 512x512, it is a good idea so create a smaller version of them to be used as thumbnails in the UI. So for example a 128x128 version for thumbnails would work very well.
PBR Propertyset
Intro to PBR Propertyset
The Physically Based Rendering (PBR) Propertyset for the materials in the Manager are used to define the characteristics of the surface of the item to which the material is a child of. This allows you to define options of materials for the item in order to make the type and color of the surface editable.
PBR is a 3D modelling technology term and is a vast topic which you can research further either in books or by studying for example the following articles from the internet:
In the 3D product configurator, the Material propertysets is the place where configuration of individual material is done.
PBR configurations for different types of materials
The following example properties describe a specific type of material and typical settings for the type and provide an example with image sample and exact parameters.
Cloth fabric
Woven cloth is typically used on furniture, but possibly in other objects as well.
The PBR parameters needed for configuring cloth fabrics are:
| Parameter | optionality | Description |
|---|---|---|
| BaseColorTexture | Mandatory | File that contains a picture and color of the fabric |
| NormalTexture | Mandatory | File the describes the pixel level how light affects the pixel |
| NormalScale | Mandatory | Typically 1 |
| RoughnessFactor | Mandatory | 1 |
| TransparencyMode | Mandatory | Opaque |
Example Cloth fabric configuration
| Parameter | optionality | Parameter value |
|---|---|---|
| BaseColorTexture | Mandatory | File that contains a picture and color of the fabric |
| NormalTexture | Mandatory | File the describes the pixel level how light affects the pixel |
| NormalScale | Mandatory | 1 |
| RoughnessFactor | Mandatory | 1 |
| TransparencyMode | Mandatory | Opaque |
Leather fabric
Leather, either synthetic or natural is a made of skin of an animal and used often on furniture.
Leather is similar to cloth fabrics, but include Roughness Texture and Roughness Factor to illustrate that the material is not even.
| Parameter | optionality | Description |
|---|---|---|
| BaseColorTexture | Mandatory | File that contains a picture and color of the fabric |
| NormalTexture | Mandatory | File the describes the pixel level how light affects the pixel |
| NormalScale | Mandatory | Typically 1 |
| RoughnessTexture | Mandatory | File containing the map of the surface of the leather |
| RoughnessFactor | Mandatory | between 0.4 and 0.7 |
| TransparencyMode | Mandatory | Opaque |
Example Leather fabric configuration
| Parameter | optionality | Description |
|---|---|---|
| BaseColorTexture | Mandatory | File that contains a picture and color of the fabric |
| NormalTexture | Mandatory | File the describes the pixel level how light affects the pixel |
| NormalScale | Mandatory | 1.5 |
| RoughnessTexture | Mandatory | File containing the map of the surface of the leather |
| RoughnessFactor | Mandatory | 0.55 |
| TransparencyMode | Mandatory | Opaque |
Wood
Wood is a typical type of material in many industries, but very common in furniture. Different types of wood are all visually and technically behaving differently and thus the parametrization of them varies.
The following parameters are typically used:
| Parameter | optionality | Description |
|---|---|---|
| BaseColorTexture | Mandatory | File that contains a picture and color of the wood |
| NormalTexture | Mandatory | File the describes the pixel level how light affects the pixel |
| NormalScale | Mandatory | Typically 1 |
| RoughnessFactor | Mandatory | between 0.4 and 0.7 |
| TransparencyMode | Mandatory | Opaque |
Example wood configurations
| Parameter | optionality | Description |
|---|---|---|
| BaseColorTexture | Mandatory | File that contains a picture and color of the wood |
| NormalTexture | Mandatory | File the describes the pixel level how light affects the pixel |
| NormalScale | Mandatory | 0.7 |
| RoughnessFactor | Mandatory | 0.4 |
| TransparencyMode | Mandatory | Opaque |
| Parameter | optionality | Description |
|---|---|---|
| BaseColorTexture | Mandatory | File that contains a picture and color of the wood |
| NormalTexture | Mandatory | File the describes the pixel level how light affects the pixel |
| NormalScale | Mandatory | 0.7 |
| RoughnessFactor | Mandatory | 0.4 |
| TransparencyMode | Mandatory | Opaque |
Painted wood
Painted wood panels are also common in everywhere. There are two major differences compared to wood. One is that pain reflects light the same way across the surface, therefore no need for NormalTexture and paint glossiness affects how light gets reflected. Matte paint does not reflect light as much as half-glossy or glossy paint.
| Parameter | optionality | Description |
|---|---|---|
| BaseColorTexture | Mandatory | File that contains a picture and color of the wood |
| NormalScale | Mandatory | Typically 1 |
| RoughnessFactor | Mandatory | between 0.4 and 0.7 |
| TransparencyMode | Mandatory | Opaque |
Example painted wood configuration
| Parameter | optionality | Description |
|---|---|---|
| BaseColorTexture | Mandatory | File that contains a color of the paint |
| NormalScale | Mandatory | 1 |
| RoughnessFactor | Mandatory | 0.5 |
| TransparencyMode | Mandatory | Opaque |
Metals
Metals are more complex materials than many others in the 3D modelling. Metal reflects light and depending on the material may have an uneven surface that affects how light reflects on it. This means that metals require more parameters in order to render realistically.
| Parameter | optionality | Description |
|---|---|---|
| BaseColorTexture | Mandatory | File that contains a color of the metal |
| NormalTexture | Mandatory | File the describes the pixel level how light affects the pixel |
| NormalScale | Mandatory | Typically below 1 |
| MetallicTexture | Mandatory | File containing a map describing the metal structure |
| MetallicFactor | Mandatory | typically 1 |
| RoughnessTexture | Mandatory | File containing the roughness map of the metal |
| RoughnessFactor | Mandatory | typically 1 |
| TransparencyMode | Mandatory | Opaque |
Example metal configuration
| Parameter | optionality | Description |
|---|---|---|
| BaseColorTexture | Mandatory | File that contains color of the metal |
| NormalTexture | Mandatory | File the describes the pixel level how light affects the pixel |
| NormalScale | Mandatory | 0.5 |
| MetallicTexture | Mandatory | File containing a map describing the metal structure |
| MetallicFactor | Mandatory | 1 |
| RoughnessTexture | Mandatory | File containing the roughness map of the metal |
| RoughnessFactor | Mandatory | 1 |
| TransparencyMode | Mandatory | Opaque |
Example glossy metal configuration
| Parameter | optionality | Description |
|---|---|---|
| ColorFactor | Mandatory | Red, HEX: FF2C00 |
| NormalScale | Mandatory | 1 |
| MetallicFactor | Mandatory | 0.55 |
| RoughnessFactor | Mandatory | 0.05 |
| TransparencyMode | Mandatory | Opaque |
TilingTexture Propertyset covers
Intro to TilingTexture propertyset
Tiling Texture propertyset is used when the textures are wrapped around the 3d mesh for the purpose of defining how the textures connect with each other ('tile'). In ideal case, the textures are formed in a way that when they tile, they form continuity without a visible seam. Additionally, these parameters help define how the 3D renderer should calculate the contents of a texel in various scenarios. This is essential when zooming in and zooming out of the 3D object in order to show the pixels correctly on the screen.
Note that this configuration is not mandatory for materials where no Textures are used.
Wrapping Modes
These options affect how textures are wrapped in horizontally (wrapS parameter corresponding to U in UV mapping) or vertically (wrapT parameter to V in UV mapping).
Choices: RepeatWrapping, ClampToEdgeWrapping and MirroredRepeatWrapping
These define the texture's wrapS and wrapT properties, which define horizontal and vertical texture wrapping.
- RepeatWrapping the texture will simply repeat to infinity. This is the default.
- ClampToEdgeWrapping the last pixel of the texture stretches to the edge of the mesh.
- MirroredRepeatWrapping causes the texture to repeats to infinity, mirroring on each repeat.
Magnification Filters (MagFilter)
Choices: NearestFilter, LinearFilter
For use with a texture's MagFilter property, these define the texture magnification function to be used when the pixel being textured maps to an area less than or equal to one texture element (texel).
- NearestFilter returns the value of the texture element that is nearest (in Manhattan distance) to the specified texture coordinates.
- LinearFilter is the default and returns the weighted average of the four texture elements that are closest to the specified texture coordinates, and can include items wrapped or repeated from other parts of a texture, depending on the values of wrapS and wrapT, and on the exact mapping.
Minification Filters (MinFilter)
Choices: NearestFilter, NearestMipmapNearestFilter, NearestMipmapLinearFilter, LinearFilter, LinearMipmapNearestFilter and LinearMipmapLinearFilter
For use with a texture's MinFilter property, these define the texture minifying function that is used whenever the pixel being textured maps to an area greater than one texture element (texel).
In addition to NearestFilter and LinearFilter, the following four functions can be used for minification:
- NearestMipmapNearestFilter chooses the mipmap that most closely matches the size of the pixel being textured and uses the NearestFilter criterion (the texel nearest to the center of the pixel) to produce a texture value.
- NearestMipmapLinearFilter chooses the two mipmaps that most closely match the size of the pixel being textured and uses the NearestFilter criterion to produce a texture value from each mipmap. The final texture value is a weighted average of those two values.
- LinearMipmapNearestFilter chooses the mipmap that most closely matches the size of the pixel being textured and uses the LinearFilter criterion (a weighted average of the four texels that are closest to the center of the pixel) to produce a texture value.
- LinearMipmapLinearFilter is the default and chooses the two mipmaps that most closely match the size of the pixel being textured and uses the LinearFilter criterion to produce a texture value from each mipmap. The final texture value is a weighted average of those two values.