How To Change Materials

As in other 3D softwares, materials set the appearance of a 3D model. Tweaking their settings is what makes steel appear metallic, plastic as matte or glass as transparent.

Syntax

In DynaMaker, materials can be typically created as:

const materials = [
  new SKYCAD.Material({
    color: 0xcccccc,
    metalness: 0.8,
    roughness: 0.2,
    opacity: 0.7,
  }),
]

• color as any color format, white (0xffffff) by default.
• metalness as number between 0 (non-metal, default) and 1 (metal).
• roughness as number between 0 (glossy) and 1 (matte, default).
• opacity as number between 0 (transparent) and 1 (opaque, default).

note

Note that materials is a list, since multiple materials can be applied to the same model throughout its entire surface.

Then it can be applied to a model only when adding it to a geometryGroup like:

const geometryGroup = new SKYCAD.GeometryGroup()
geometryGroup.addGeometry(myModel, {
  materials: [new SKYCAD.Material({ color: 0xcccccc, metalness: 0.8, roughness: 0.2, opacity: 0.7 })],
})

Common Examples

Some example of settings for real world materials:

const steelMaterials = [new SKYCAD.Material({ metalness: 1, roughness: 0 })]
const plasticMaterials = [new SKYCAD.Material({ metalness: 0.1, roughness: 0.7 })]
const ceramicMaterials = [new SKYCAD.Material({ metalness: 0, roughness: 0 })]
const glassMaterials = [new SKYCAD.Material({ metalness: 0.6, roughness: 0.1, opacity: 0.6 })]

tip

Some metalness without full roughness can help create certain light reflection that make it look more realistic even in materials that are not trully metallic like plastic or wood.

Override Asset Material

Particularly in static models, these typically come with multiple materials with different names. Therefore in DynaMaker you can override a specific material knowing their name. As example to get the bike geometry with dynamic color in its frame, accessories and tires:

export function getBikeGeometry(
  frameColor: number,
  frameMetalness: number,
  frameRoughness: number,
  accessoryColor: number,
  tireColor: number,
) {
  const geometryGroup = new SKYCAD.GeometryGroup()
  geometryGroup.addGeometry(ASSETS.STATIC_MODELS.BIKE, {
    materials: [
      new SKYCAD.Material({
        name: 'frame',
        color: frameColor,
        metalness: frameMetalness,
        roughness: frameRoughness,
      }),
      new SKYCAD.Material({
        name: 'accessories',
        color: accessoryColor,
      }),
      new SKYCAD.Material({
        name: 'tire',
        color: tireColor,
      }),
    ],
  })
  return geometryGroup
}

tip

Materials can be richer depending on the original format of the 3D model:

• .stl & .ply, the poorest, come as flat grey models, no color, metalness or opacity.
• .step can come with multiple materials with different color and opacity, even if they are modelled as single parts.
• .glb, by far the richest, can come with every single material setting predefined, including metalness & texturing!