Table of Contents

Material

Overview

Material represents a surface to be rendered on top of 3d mesh on the material area defined by the material slot. Material definition affects visual quality the most and is therefore one of the cornerstones of configuration to the perfection. Almost every parameter that you can configure directly affects how the product looks visually.

To add a material, select "Material" from the contextual menu for Part or Item List. AddingMaterial

Root Properties cover the thumbnail picture, naming and description of the material to be shown on the planner view. The PBR Propertyset covers surface definition and the TilingTexture property set from the optional propertysets are commonly used for defining the surface.

PBR Properties cover the look and feel of the material itself. These parameter define how Physically Based Rendering gets applied and affect how the surface looks. The Materials cover examples of the parameters and how the output look.

Base properties

RootProperties

Material Root Properties

Property Name Type Localized Description
ThumbnailImageAssetId PNG/JPEG Asset N An image thumbnail to show to the buyer on the planner, ideally 256x256 pixels
DisplayName Text field Y The name to show on the planner for this material
Description TextField Y The description to show on the planner for this material
Hidden Toggle N Is the material visible or not?

PBR (Physically Based Rendering)

Material PBR Properties

Property Name Type Localized Description
BaseColorTexture PNG/JPG Asset N The base texture file for the item selection which can be applied onto the item as material, texture files should be square and multiples of 512x512 pixels
ColorFactor RGB Color N Color from colorpicker, leave empty when selecting the color from the BaseColorTexture or tint the base color with this additional color as overlay
NormalTexture PNG/JPEG Asset N The texture to create a normal map. The RGB values affect the surface normal for each pixel fragment and change the way the color is lit. Normal maps do not change the actual shape of the surface, only the lighting. The encoding must follow right-hand rule
NormalScale Number N How much the normal map affects the material. Typical ranges are 0-1
MetallicTexture PNG/JPEG Asset N File where the blue channel of this texture is used to alter the metalness of the material. Leave empty for non-metallic surfaces. A texture file for metallic surfaces
MetallicFactor Number N How much the material is like a metal. If MetallicTexture is also provided, the values get multiplied with each other. Default is 0. Use 0 for non-metallic materials like wood or stone, Use 1.0 for metals. A value between 0.0 and 1.0 could be used for a rusty metal look.
RoughnessTexture PNG/JPEG Asset N File where the green channel of this texture is used to alter the roughness of the material. This forms small bumps and alterations based on the map into the texture making the surface look uneven. Useful for fabrics and cloths
RoughnessFactor Number N How rough the material appears. 0 means a smooth mirror reflection, 1 means fully diffuse. Default is 1. If RoughnessTexture is also provided, the values are multiplied
TransparencyMode Radio Button N
OpacityTexture PNG/JPEG Asset N File where ... is describing the opaqueness of the surface
AlphaTest Number N Sets the alpha value to be used when running an alpha test. The material will not be rendered if the opacity is lower than this value.
EmissiveTexture PNG/JPEG Asset N Set emisssive (glow) map. The emissive map color is modulated by the emissive color and the emissive intensity. If you have an emissive map, be sure to set the emissive color to something other than black.
EmissiveFactor RGB Color N Emissive (light) color of the material, essentially a solid color unaffected by other lighting. Default is white. Choose a color from color picker
EmissiveIntensity Number N Intensity of the emissive light. Modulates the emissive color.

Optional property sets

TilingTexture

Tiling Texture property set affects how the texture is tiled over the 3d mesh. This is important when thinking that the textures do not have to and typically do not, cover the mesh surface area without being stretched over the surface, thus making really bad visual outlook.

Additionally the filter values affect og Magnification (MagFilter) and zoom out (Minification) affect tiling and optimizing how pixels are converted when zooming in or zooming out. These affect visual quality of the rendering and depending on the surfaces needed, might have to be adjusted

Material Tiling Texture Properties

Property Name Type Localized Description
TileScale Vector(2) N The number of repeats (when necessary) to do to scale the texture.
Offset Vector(2) N How much a single repetition of the texture is offset from the beginning, in each direction U(X) and V(Y). Typical range is 0.0 to 1.0.
WrapS Radio Button N This defines how the texture is wrapped horizontally and corresponds to U in UV mapping. The default is ClampToEdgeWrapping, where the edge is clamped to the outer edge texels. The other two choices are RepeatWrapping and MirroredRepeatWrapping. See the texture constants in Materials
WrapT Radio Button N This defines how the texture is wrapped vertically and corresponds to V in UV mapping. The same choices are available as for .wrapS
MinFilter Radio Button N How the texture is sampled when a texel covers less than one pixel. The default is LinearMipmapLinear, which uses mipmapping and a trilinear filter. See MinFilter constants in Materials for more details of the choices.
MagFilter Radio Button N How the texture is sampled when a texel covers more than one pixel. The default is LinearFilter, which takes the four closest texels and bilinearly interpolates among them. The other option is NearestFilter, which uses the value of the closest texel. See the Mag Filter constants in Materials for more details of the choices.

SalesCodeMapping

SalesCodeMapping property set is used to define the logic to determining SKU (Stock-Keeping Unit) codes used for integrations and Summary. When integrating the 3D ecommerce configurator with eCommerce platforms, both must explicitly know the same set of SKUs in order for the configurator to be able to show proper prices and map the composition configuration to an order (Add To Cart)

SalesCodeMappingPropertyPanel

Property Name Type Localized Description
Amount Scripting N The defaul number of units each item where this property is defined will be counted, typically 1, but occasionally something else based on logic
CaseGroups Logic Fields N For each logic group, a selection of case split logic rules in the rule field that define an outcome code into the code field. * denotes applies to all definition A case-split can be based on scripting logic, a child condition (eg. material slot or accessory slot selection), Multiple case groups perform an composed SKU code. Refer to Sales Code Mapping for more information

CustomProperties

Custom Property set (or sets) allow definition of logic that defines something that otherwise is not predefined in the system logic.

CustomPropertyPanel

Property Name Type Localized Description
Name Text field Y The name of the custom property. It can be referred to in scripting from elsewhere
Value Scripting N Value or scripting logic that the property has

ValidationRule

Validation rule property set is used to define logic that can be useful to ensuring the the item where the validation rule is will follow define rules.

ValidationRulePropertyPanel

Property Name Type Localized Description
DisplayMessage Text Field Y Text that is shown on the Planner when the conditions of the rule are true
Level Radio Button N Selection should the rule show error, suggestion or indicating something is missing
Trigger Scripting N The logic that defines the validation rule

ClassificationTag

Classification tag allows the configurator to define a name in the system that can be referred to in other logic components through the scripting system

ClassificationPropertyPanel

Property Name Type Localized Description
Tag Text field N A label that is associated with the item it's been configured to

IntegrationData

Integration data property set is used to add metadata to product parts and / or materials.

IntegrationDataPanel

Property Name Type Localized Description
Name Text field Y The name of the integration data property. It can be referred to in scripting from elsewhere
Value Scripting N Value or scripting logic that the property has

Example of how this might look in the SalesData json:

     "properties": {
        "Material": "Fabric Petrol"
     },

Originally our product summary / Bill of Materials(BOM) has listed and counted items(parts of the composition) based on SKU's. When using integration data, the list takes the provided metadata into account while summarizing items.

This change means that parts with identical SKU's but different integration data (colors or materials specified) are treated as separate items in the summary / BOM.

Example of usage

Some e-commerce platforms have product variant limits, which hinders stores that have a vast variety of colors and materials. Using integration data property set in manager (management.vividworks.com), material and color options can be put to product parts metadata.

IntegrationDataExample

This removes the need for putting SKU's for materials, thus also removing the issue of product variant limit.

How above example would work and look in Shopify

In Shopify, the visibility of data can be configured with two options:

  1. The data can be displayed to both the shop owner and to the customer. It would be visible in cart and checkout (and for shop owner only, in 'orders' tab in Shopify admin view.) This can be implemented using Shopify's cart line item properties.

    CartView
    Red arrow in above image shows the result of configuring integrationdata in the way of the example.

    CheckoutView
    Red arrow in above image shows the result of configuring integrationdata in the way of the example.

    AdminOrdersView
    Red arrow in above image shows the result of configuring integrationdata in the way of the example.

  2. The data can be set to display only to the shop owner, in 'orders' tab in Shopify admin view. This can be implemented using Shopify's cart line item hidden properties. This way, the end customer will not see the metadata at all.

HiddenVisibleInAdminOrdersView
Red arrow in above image shows the result of configuring integrationdata in the way of the example.

Notes

Tiling of images in textures only functions if image dimensions are powers of two (2, 4, 8, 16, 32, 64, 128, 256, 512, 1024, 2048, ...) in terms of pixels. Individual dimensions need not be equal, but each must be a power of two. This is a limitation of WebGL.